import {useCallback, useLayoutEffect} from 'react';
import {useNavigation} from '@react-navigation/native';
import {NativeStackNavigationProp} from '@react-navigation/native-stack';
import {BackButton} from '@components';
import {JourneyTaskDetail} from '@modules/employeeLifecycle/interfaces';
import {RootStackParamList} from '@navigation/interfaces';
import {Screens} from '@shared/constants';
import {useGoBack} from '@shared/hooks/useGoBack';

interface Params {
  task: JourneyTaskDetail;
  canShowMoreInfoDialog?: boolean;
  onOpenDialog?: () => void;
}

export function useBaseTaskDetailHeader({
  task,
  canShowMoreInfoDialog = false,
  onOpenDialog,
}: Params) {
  const navigation =
    useNavigation<NativeStackNavigationProp<RootStackParamList>>();
  const {goBack} = useGoBack();

  const onPressGoBack = useCallback(() => {
    const navState = navigation.getState();
    const previousScreen =
      navState &&
      navState.index > 0 &&
      navState.routes &&
      navState.routes.length > 0
        ? navState.routes[navState.index - 1].name
        : undefined;

    if (previousScreen === Screens.ONBOARDINGS_STEP_TASKS) {
      navigation.popTo(previousScreen, {
        journeyId: task?.userJourneyId || 0,
        stepId: task?.stepId || 0,
      });
    } else if (previousScreen === Screens.TASKS) {
      navigation.popTo(previousScreen);
    } else {
      goBack();
    }
  }, [goBack, navigation, task]);

  useLayoutEffect(() => {
    // TODO: Need backend tracked -> [SQGZ-250]
    // const headerRight = () => (
    //   <IconButton
    //     variant="tertiary"
    //     onPress={onOpenDialog}
    //     Icon={IconInfoCircle}
    //   />
    // );
    const headerLeft = () => <BackButton onPress={onPressGoBack} />;

    navigation.setOptions({
      title: task.actionTitle || '',
      // headerRight: canShowMoreInfoDialog ? headerRight : undefined,
      headerLeft,
    });
  }, [
    canShowMoreInfoDialog,
    navigation,
    task.actionTitle,
    onPressGoBack,
    onOpenDialog,
  ]);
}