import { useEffect, useContext, useMemo } from 'react';
import { TourContext } from '../context';

/**
 * useAdvancedTour is required to add AdvancedTour on the page where you need it. * */
export const useAdvancedTour = ({
  tourId = '',
  isShowTour = false,
  isTourEnabled = false,
  isHighlighted = false
}) => {
  const {
    setAdvancedTourId,
    setAdvancedTourEnabled,
    setAdvancedTourStepId,
    setShowAdvancedTour,
    setIsHighlighted,
    advancedTourStepId,
    advancedTourEnabled,
    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    stepId,
    ...rest
  } = useContext(TourContext);
  useEffect(() => {
    setAdvancedTourEnabled(isTourEnabled);
    setShowAdvancedTour(isShowTour);
    setAdvancedTourId(tourId);
    setIsHighlighted(isHighlighted);
    return () => {
      setAdvancedTourEnabled(false);
      setShowAdvancedTour(false);
      setAdvancedTourId('');
      setAdvancedTourStepId(0);
      setIsHighlighted(false);
    };
  }, [isShowTour, tourId, isTourEnabled, isHighlighted]);
  return useMemo(() => ({
    setAdvancedTourEnabled,
    setAdvancedTourId,
    setAdvancedTourStepId,
    setShowAdvancedTour,
    advancedTourStepId,
    setIsHighlighted,
    advancedTourEnabled,
    ...rest
  }), [tourId, advancedTourStepId, advancedTourEnabled]);
};