hunk.code_window: .bp3-overlay-backdrop {
     background-color: rgba(16, 22, 26, 0.7) !important;
   }
  
hunk.labels: keep keep keep add
hunk.after_edit: .bp3-overlay-zindex {
     z-index: 20 !important;
   }
  
hunk.file_path: app/client/src/index.css
hunk.type: add
file: import { TourType } from "entities/Tour";
  import { useDispatch, useSelector } from "react-redux";
  import { AppState } from "@appsmith/reducers";
  import { getActiveTourIndex, getActiveTourType } from "selectors/tourSelectors";
  import { proceedToNextTourStep } from "actions/tourActions";
  
  export const useIsTourStepActive = (
    activeTourStepConfig: { [key in TourType]?: any },
  ) => {
    const activeTourType = useSelector(getActiveTourType);
    const expectedActiveStep =
      activeTourType &&
      activeTourStepConfig &&
      activeTourStepConfig[activeTourType];
  
    const isCurrentStepActive = useSelector(
      (state: AppState) => getActiveTourIndex(state) === expectedActiveStep,
    );
  
    return isCurrentStepActive;
  };
  
  const useProceedToNextTourStep = (
    activeTourStepConfig: { [key in TourType]?: any },
  ) => {
    const dispatch = useDispatch();
  
    const isActive = useIsTourStepActive(activeTourStepConfig);
  
    return () => isActive && dispatch(proceedToNextTourStep());
  };
  
  export default useProceedToNextTourStep;
  