function InstanceActions()

in frontend/src/old-pages/Clusters/Instances.tsx [36:95]
53 lines of code
8 McCabe index (conditional complexity)

function InstanceActions({instance}: {instance?: Instance}) {
  const {t} = useTranslation()

  const clusterName = useState(['app', 'clusters', 'selected'])
  const fleetStatus: ComputeFleetStatus = useState([
    'clusters',
    'index',
    clusterName,
    'computeFleetStatus',
  ])
  const [startPending, setStartPending] = React.useState(false)
  const [stopPending, setStopPending] = React.useState(false)

  const resetPending = () => {
    setStopPending(false)
    setStartPending(false)
  }

  const refresh = React.useCallback(() => {
    const clusterName = getState(['app', 'clusters', 'selected'])
    clusterName && GetClusterInstances(clusterName, resetPending)
  }, [])

  const stopInstance = React.useCallback(() => {
    setStopPending(true)
    Ec2Action(instance!.instanceId, 'stop_instances', refresh)
  }, [instance, refresh])

  const startInstance = React.useCallback(() => {
    setStartPending(true)
    Ec2Action(instance!.instanceId, 'start_instances', refresh)
  }, [instance, refresh])

  const isComputeFleetStopped = fleetStatus === ComputeFleetStatus.Stopped
  const isHeadNodeRunning =
    instance?.nodeType === NodeType.HeadNode &&
    instance?.state === InstanceState.Running
  const isHeadNodeStopped =
    instance?.nodeType === NodeType.HeadNode &&
    instance?.state === InstanceState.Stopped

  return (
    <SpaceBetween direction="horizontal" size="s">
      <Button
        disabled={!(instance && isComputeFleetStopped && isHeadNodeRunning)}
        loading={stopPending}
        onClick={stopInstance}
      >
        {t('cluster.instances.actions.stop')}
      </Button>
      <Button
        disabled={!(instance && isComputeFleetStopped && isHeadNodeStopped)}
        loading={startPending}
        onClick={startInstance}
      >
        {t('cluster.instances.actions.start')}
      </Button>
    </SpaceBetween>
  )
}