export function Tour()

in src/components/ui/tour.tsx [28:66]

• 36 lines of code
• 2 McCabe index (conditional complexity)

export function Tour() {
  const { isRunning, endTour, steps } = useTour();

  const handleJoyrideCallback = (data: CallBackProps) => {
    const { status } = data;
    const finishedStatuses: string[] = [STATUS.FINISHED, STATUS.SKIPPED];

    if (finishedStatuses.includes(status)) {
      endTour();
    }
  };

  return (
    <Joyride
      callback={handleJoyrideCallback}
      continuous
      run={isRunning}
      scrollOffset={64}
      showProgress
      showSkipButton
      spotlightClicks={false}
      steps={steps}
      beaconComponent={CustomBeacon}
      locale={{
        last: "Finish",
        skip: "Skip",
      }}
      styles={{
        options: {
          arrowColor: "hsl(var(--card))",
          backgroundColor: "rgb(2 6 23 / 0.8)",
          primaryColor: "#3b82f6",
          textColor: "hsl(var(--card-foreground))",
          zIndex: 1000,
        },
      }}
    />
  );
}