import { useNavigation, useRoute } from '@react-navigation/native';
import React, { useLayoutEffect } from 'react';
import { ScrollView, View } from 'react-native';

import DetailList from '../../../../../../../../components/List/DetailList';
import Loader from '../../../../../../../../components/Loader/Loader';
import { NavProps, RouteProps } from '../../../../../../../../components/Routes/Routes';
import { getDateAsString } from '../../../../../../../../helpers/stringHelpers';
import { useEventEducationDetail } from '../../../../../../../../hooks/useEducation';
import { useUserInfo } from '../../../../../../../../hooks/useStorage';

const EducationStatus = () => {
  const { id, educationName } = useRoute<RouteProps<'EducationStatus'>>().params;
  const [userInfo] = useUserInfo();
  const navigation = useNavigation<NavProps>();

  const { data: detail, isLoading } = useEventEducationDetail(userInfo?.token, id);

  useLayoutEffect(() => {
    navigation.setOptions({
      title: educationName,
    });
  }, [navigation, educationName]);
  return (
    <View className="mx-4 mb-4 flex-1 justify-start bg-primary-bg">
      {!isLoading ? (
        <ScrollView>
          <DetailList
            title={{
              text: 'Jednotka',
            }}
            items={[
              {
                title: 'Schválení pořádající jednotkou:',
                value: detail?.dateUnitApproved
                  ? getDateAsString(new Date(detail?.dateUnitApproved))
                  : 'Neschváleno',
              },
            ]}
          />

          <DetailList
            title={{
              text: 'Data změn stavu',
            }}
            items={[
              {
                title: 'Zveřejněno:',
                value: detail?.publicized ? getDateAsString(new Date(detail?.publicized)) : ' ',
              },
              {
                title: 'Schváleno odborem pro vzdělávání:',
                value: detail?.approved
                  ? getDateAsString(new Date(detail?.approved))
                  : 'Čeká na schválení',
              },
              {
                title: 'Žádost o dotaci podána:',
                value: detail?.grant ? getDateAsString(new Date(detail?.grant)) : 'Nežádá o dotaci',
              },
              ...(detail?.grantDecision
                ? [
                    {
                      title: 'Rozhodnutí vytvořeno:',
                      value: getDateAsString(new Date(detail?.grantDecision)),
                    },
                  ]
                : []),
              {
                title: 'Rozhodnutí schváleno:',
                value: detail?.grantDecisionConfirmed
                  ? getDateAsString(new Date(detail?.grantDecisionConfirmed))
                  : 'Čeká na rozhodnutí',
              },
              {
                title: 'Záloha zaslána:',
                value: detail?.advanceSent
                  ? getDateAsString(new Date(detail?.advanceSent))
                  : 'Čeká na odeslání záloh',
              },
            ]}
          />

          <DetailList
            title={{
              text: 'Typ Akce',
            }}
            items={[
              {
                title: 'Lesní akce:',
                value: detail?.isForester ? 'Ano' : 'Ne',
              },
              {
                title: 'Kvalifikační akce:',
                value: detail?.isQualifyingExam ? 'Ano' : 'Ne',
              },
              {
                title: 'Akce žádá o dotaci:',
                value: detail?.hasGrantRequest ? 'Ano' : 'Ne',
              },
            ]}
          />
        </ScrollView>
      ) : (
        <Loader />
      )}
    </View>
  );
};

export default EducationStatus;
