import {invoke} from "@forge/bridge";
import {
  Box,
  ErrorMessage,
  Form, FormFooter,
  FormSection, Heading,
  HelperMessage, Inline,
  Label, LoadingButton,
  RequiredAsterisk,
  Stack,
  Text, Toggle,
  useForm, xcss,
} from "@forge/react";
import ForgeUI from '@forge/ui';
import React from "react";
import ControlledSelect from "../../../components/ControlledSelect";
import PageSelect from "../../../components/PageSelect";
import {
  KNOWLEDGE_BASE_WRITER_CONFIG_KEY,
  KnowledgeBaseWriterConfig
} from "../../../core/config";

export interface SelectOption {
  label: string;
  value: any;
}

export interface KnowledgeBaseConfigWriterFormProps {
  projectKey: string;
  initialConfig: KnowledgeBaseWriterConfig;
  spaceOptions: SelectOption[];
  jiraFieldOptions: SelectOption[];
}

export const KnowledgeBaseWriterConfigForm = ({
  projectKey,
  initialConfig,
  spaceOptions,
  jiraFieldOptions
}: KnowledgeBaseConfigWriterFormProps) => {
  const { formState, handleSubmit, register, getFieldId, getValues } = useForm<KnowledgeBaseWriterConfig>({
    defaultValues: initialConfig
  });
  const { errors, isSubmitting, touchedFields } = formState;

  const saveConfig = async (newConfig: KnowledgeBaseWriterConfig) => {
    const storageKey = `${KNOWLEDGE_BASE_WRITER_CONFIG_KEY}_${projectKey}`;
    const oldConfig = await invoke<KnowledgeBaseWriterConfig>('storage.get', {
      key: storageKey
    });
    await invoke('storage.set', {
      key: storageKey,
      value: Object.assign(oldConfig, newConfig)
    });
  }

  return (
    <Form onSubmit={handleSubmit(saveConfig, (err) => {
      console.error(err)
    })}>
      <FormSection>
        <Stack space="space.200">
          <Stack space="space.100">
            <Inline alignBlock="center">
              <Toggle
                {...register('enable')}
              />
              <Box>
                <Text>Enable Knowledge Base Writer</Text>
              </Box>
            </Inline>
          </Stack>
          <Stack space="space.100">
            <Heading as="h4">Trigger</Heading>
            {/*  Knowledge Base Feedback Field  */}
            <Box>
              <Label labelFor={getFieldId(`kbFeedbackFieldKey`)}>
                Knowledge Base Feedback Field
                <RequiredAsterisk />
              </Label>
              <Box>
                <ControlledSelect
                  {...register('kbFeedbackFieldKey', { required: true })}
                  options={jiraFieldOptions}
                />
                {
                  errors?.kbFeedbackFieldKey && (
                    errors?.kbFeedbackFieldKey?.message ?
                      <ErrorMessage>{errors?.kbFeedbackFieldKey?.message}</ErrorMessage> :
                      <ErrorMessage>Please the knowledge base feedback field on Jira.</ErrorMessage>
                  )
                }
                {!touchedFields?.kbFeedbackFieldKey && !errors?.kbFeedbackFieldKey && (
                  <HelperMessage>
                    Select the jira field which determines whether the Knowledge Base needs to be automatically created.
                  </HelperMessage>
                )}
              </Box>
            </Box>
          </Stack>
          <Stack space="space.100">
            <Heading as="h4">Generation</Heading>
            {/*  Context Fields  */}
            <Box>
              <Label labelFor={getFieldId(`contextFieldKeys`)}>
                Context Fields
                <RequiredAsterisk />
              </Label>
              <Box>
                <ControlledSelect
                  {...register('contextFieldKeys', { required: true })}
                  isMulti={true}
                  options={jiraFieldOptions}
                />
                {
                  errors?.contextFieldKeys && (
                    errors?.contextFieldKeys?.message ?
                      <ErrorMessage>{errors?.contextFieldKeys?.message}</ErrorMessage> :
                      <ErrorMessage>Please select the fields used in the context of generation.</ErrorMessage>
                  )
                }
                {!touchedFields?.contextFieldKeys && !errors?.contextFieldKeys && (
                  <HelperMessage>
                    Select the fields used in the context of generation.
                  </HelperMessage>
                )}
              </Box>
            </Box>
          </Stack>
          <Stack space="space.100">
            <Heading as="h4">Storage</Heading>
            {/*  Target Knowledge Space  */}
            <Box>
              <Label labelFor={getFieldId(`targetSpaceId`)}>
                Target Knowledge Space
                <RequiredAsterisk />
              </Label>
              <Box>
                <ControlledSelect
                  {...register('targetSpaceId', { required: true })}
                  options={spaceOptions}
                />
                {
                  errors?.targetSpaceId && (
                    errors?.targetSpaceId?.message ?
                      <ErrorMessage>{errors?.targetSpaceId?.message}</ErrorMessage> :
                      <ErrorMessage>Please select a targetSpaceId space.</ErrorMessage>
                  )
                }
                {!touchedFields?.targetSpaceId && !errors?.targetSpaceId && (
                  <HelperMessage>
                    Select the knowledge base space to store the generated documentation.
                  </HelperMessage>
                )}
              </Box>
            </Box>
            {/*  Parent Page  */}
            <Box>
              <Label labelFor={getFieldId(`parentPageId`)}>
                Parent Page
                <RequiredAsterisk />
              </Label>
              <Box>
                <PageSelect
                  {...register('parentPageId', { required: true })}
                  spaceId={getValues('targetSpaceId')}
                />
                {
                  errors?.parentPageId && (
                    errors?.parentPageId?.message ?
                      <ErrorMessage>{errors?.parentPageId?.message}</ErrorMessage> :
                      <ErrorMessage>Please select a parent page.</ErrorMessage>
                  )
                }
                {!touchedFields?.parentPageId && !errors?.parentPageId && (
                  <HelperMessage>
                    The generated confluence page will be added under the parent page.
                  </HelperMessage>
                )}
              </Box>
            </Box>
            {/*  Generated Knowledge Base Link Field  */}
            <Box>
              <Label labelFor={getFieldId(`generatedKBLinkFieldKey`)}>
                Generated Knowledge Base Link Field
                <RequiredAsterisk />
              </Label>
              <Box>
                <ControlledSelect
                  {...register('generatedKBLinkFieldKey', { required: true })}
                  options={jiraFieldOptions}
                />
                {
                  errors?.generatedKBLinkFieldKey && (
                    errors?.generatedKBLinkFieldKey?.message ?
                      <ErrorMessage>{errors?.generatedKBLinkFieldKey?.message}</ErrorMessage> :
                      <ErrorMessage>Please the jira field to store generated knowledge base link.</ErrorMessage>
                  )
                }
                {!touchedFields?.generatedKBLinkFieldKey && !errors?.generatedKBLinkFieldKey && (
                  <HelperMessage>
                    Select the jira field to store the link of the generated knowledge base.
                  </HelperMessage>
                )}
              </Box>
            </Box>
          </Stack>
        </Stack>
      </FormSection>
      <FormFooter align="start">
        <LoadingButton appearance="primary" type="submit" isLoading={isSubmitting}>
          Save
        </LoadingButton>
      </FormFooter>
    </Form>
  )
}