import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {View} from 'react-native';
import {AnsweredPdfQuestion} from '@interfaces/questions';
import {Screens} from '@shared/constants';
import {SHARED_STRINGS} from '@shared/strings';
import FormFooter from '@modules/form/layouts/FormLayout/components/FormFooter';
import {Navigation} from '@interfaces/navigation';
import ActivityIndicator from '@components/ActivityIndicator';

import PdfFormContent, {PdfFormContentProps} from './components/PdfFormContent';
import {usePdfForward} from './usePdfForward';
import {usePdfFetch} from './usePdfFetch';
import {updateAnswers} from './utils';
import PdfFormPagination from './components/PdfFormPagination';
import {styles} from './styles';

// TODO V2: Handle more steps
function PdfForm({route: {params}}: Navigation<Screens.PDF_FORM>) {
  const hasMandatory = useRef(false);
  const [formCompleted, setFormCompleted] = useState(false);
  const [formLoading, setFormLoading] = useState(false);
  const [formDisabled, setFormDisabled] = useState(true);
  const [currentPage, setCurrentPage] = useState(0);
  const [answers, setAnswers] = useState<Record<number, AnsweredPdfQuestion>>(
    {},
  );

  const {formConfig, isFormFilled, initialLoading, currentStepData} =
    usePdfFetch(params);

  const forwardText = useMemo(
    () => (isFormFilled ? SHARED_STRINGS.CLOSE : SHARED_STRINGS.FINISH),
    [isFormFilled],
  );

  const {onForward} = usePdfForward({
    forwardText,
    formConfig,
    answers,
    currentPage,
    currentStepData,
    setFormCompleted,
    setFormLoading,
    successText: params.successText,
  });

  const handleAnswer: PdfFormContentProps['onAnswer'] = useCallback(
    id =>
      ({answer, inputType, userField}) => {
        setAnswers(prevAnswers => {
          const newAnswers = {...prevAnswers};
          updateAnswers(newAnswers, {id, inputType, answer, userField});
          return newAnswers;
        });
      },
    [],
  );

  useEffect(() => {
    setFormDisabled(
      (!currentStepData?.questions.length ||
        currentStepData.questions.findIndex(question => {
          question.required && (hasMandatory.current = true);
          return question.required && answers[question.id] === undefined;
        }) >= 0) &&
        !isFormFilled,
    );
  }, [currentStepData?.questions, answers, isFormFilled]);

  if (initialLoading || !formConfig) {
    return <ActivityIndicator fullScreen />;
  }

  return (
    <View style={styles.flexGrow}>
      <View style={styles.flexGrow}>
        <PdfFormContent
          currentPage={currentPage}
          isFormFilled={isFormFilled}
          hasMandatory={hasMandatory.current}
          currentStepData={currentStepData!}
          onAnswer={handleAnswer}
          answers={answers}
        />
      </View>
      <FormFooter
        disabled={formDisabled || formLoading}
        loading={formLoading}
        totalSteps={formConfig?.steps.length}
        currentStep={0}
        forwardText={forwardText}
        formCompleted={formCompleted}
        onForwardPress={onForward}>
        <PdfFormPagination
          currentPage={currentPage}
          totalPages={currentStepData?.sourceData?.totalPages || 0}
          onPrevious={() => setCurrentPage(prevPage => prevPage - 1)}
          onForward={() => setCurrentPage(prevPage => prevPage + 1)}
        />
      </FormFooter>
    </View>
  );
}

export default PdfForm;