51 lines
1.1 KiB
TypeScript
51 lines
1.1 KiB
TypeScript
import React from 'react'
|
|
import PrimaryButton from '../PrimaryButton'
|
|
|
|
export enum ModelActionType {
|
|
Start = 'Start',
|
|
Stop = 'Stop',
|
|
}
|
|
|
|
type ModelActionStyle = {
|
|
title: string
|
|
backgroundColor: string
|
|
textColor: string
|
|
}
|
|
|
|
const modelActionMapper: Record<ModelActionType, ModelActionStyle> = {
|
|
[ModelActionType.Start]: {
|
|
title: 'Start',
|
|
backgroundColor: 'bg-blue-500 hover:bg-blue-600',
|
|
textColor: 'text-white',
|
|
},
|
|
[ModelActionType.Stop]: {
|
|
title: 'Stop',
|
|
backgroundColor: 'bg-red-500 hover:bg-red-600',
|
|
textColor: 'text-white',
|
|
},
|
|
}
|
|
|
|
type Props = {
|
|
type: ModelActionType
|
|
onActionClick: (type: ModelActionType) => void
|
|
}
|
|
|
|
const ModelActionButton: React.FC<Props> = ({ type, onActionClick }) => {
|
|
const styles = modelActionMapper[type]
|
|
const onClick = () => {
|
|
onActionClick(type)
|
|
}
|
|
|
|
return (
|
|
<td className="whitespace-nowrap px-6 py-4 text-sm">
|
|
<PrimaryButton
|
|
title={styles.title}
|
|
onClick={onClick}
|
|
className={styles.backgroundColor}
|
|
/>
|
|
</td>
|
|
)
|
|
}
|
|
|
|
export default ModelActionButton
|