import { Button } from '@tidbcloud/uikit'
import { IconRunFill } from '@tidbcloud/uikit/icons'

import { useDataApiContext } from '../context'

const RunBtn: React.FC<
  React.PropsWithChildren<{
    running: boolean
    onClick: (isAll: boolean) => void
  }>
> = ({ onClick, running }) => {
  const { editEndpoint } = useDataApiContext()

  const disabled =
    running ||
    !editEndpoint?.session_id ||
    !editEndpoint?.cluster_id ||
    editEndpoint?.cluster_id === '0' ||
    (editEndpoint.type === 'system-data' && !editEndpoint.database)
  return (
    <Button
      variant="outline"
      radius="md"
      size="xs"
      disabled={disabled}
      data-testid="dataservice-run-btn"
      data-mp-event="DataService run buton clicked"
      data-mp-source="run button"
      leftSection={<IconRunFill size={14} />}
      styles={{
        section: {
          marginRight: 4
        }
      }}
      onClick={() => {
        onClick(false)
      }}
    >
      Run
    </Button>
  )
}

export default RunBtn