import { useGetManyServerlessFunctions } from '@/settings/serverless-functions/hooks/useGetManyServerlessFunctions';
import { Select, SelectOption } from '@/ui/input/components/Select';
import { WorkflowEditGenericFormBase } from '@/workflow/components/WorkflowEditGenericFormBase';
import { WorkflowCodeStep } from '@/workflow/types/Workflow';
import { useTheme } from '@emotion/react';
import { IconCode, isDefined } from 'twenty-ui';

type WorkflowEditActionFormServerlessFunctionProps =
  | {
      action: WorkflowCodeStep;
      readonly: true;
    }
  | {
      action: WorkflowCodeStep;
      readonly?: false;
      onActionUpdate: (action: WorkflowCodeStep) => void;
    };

export const WorkflowEditActionFormServerlessFunction = (
  props: WorkflowEditActionFormServerlessFunctionProps,
) => {
  const theme = useTheme();

  const { serverlessFunctions } = useGetManyServerlessFunctions();

  const availableFunctions: Array<SelectOption<string>> = [
    { label: 'None', value: '' },
    ...serverlessFunctions
      .filter((serverlessFunction) =>
        isDefined(serverlessFunction.latestVersion),
      )
      .map((serverlessFunction) => ({
        label: serverlessFunction.name,
        value: serverlessFunction.id,
      })),
  ];

  return (
    <WorkflowEditGenericFormBase
      HeaderIcon={<IconCode color={theme.color.orange} />}
      headerTitle="Code - Serverless Function"
      headerType="Code"
    >
      <Select
        dropdownId="workflow-edit-action-function"
        label="Function"
        fullWidth
        value={props.action.settings.input.serverlessFunctionId}
        options={availableFunctions}
        disabled={props.readonly}
        onChange={(serverlessFunctionId) => {
          if (props.readonly === true) {
            return;
          }

          props.onActionUpdate({
            ...props.action,
            settings: {
              ...props.action.settings,
              input: {
                serverlessFunctionId,
                serverlessFunctionVersion:
                  serverlessFunctions.find((f) => f.id === serverlessFunctionId)
                    ?.latestVersion || 'latest',
              },
            },
          });
        }}
      />
    </WorkflowEditGenericFormBase>
  );
};
