From 9ff4ece541e12274e2e608b45c32f76783a6fdf8 Mon Sep 17 00:00:00 2001
From: Ibrahim <ibrahim.mdev@gmail.com>
Date: Sun, 22 Sep 2024 20:47:33 -0400
Subject: [PATCH] updates

---
 .../contextProviders/OnboardingProvider.tsx   | 56 ++++++-------------
 1 file changed, 17 insertions(+), 39 deletions(-)

diff --git a/platform/ui-next/src/contextProviders/OnboardingProvider.tsx b/platform/ui-next/src/contextProviders/OnboardingProvider.tsx
index 0717619c3..b756151a6 100644
--- a/platform/ui-next/src/contextProviders/OnboardingProvider.tsx
+++ b/platform/ui-next/src/contextProviders/OnboardingProvider.tsx
@@ -1,5 +1,6 @@
-import React, { useState, createContext, useContext, useEffect, useCallback } from 'react';
+import React, { createContext, useContext } from 'react';
 import { ShepherdJourneyProvider, useShepherd } from 'react-shepherd';
+import { StepOptions, TourOptions } from 'shepherd.js';
 import 'shepherd.js/dist/css/shepherd.css';
 
 const OnboardingProviderContext = createContext(null);
@@ -7,53 +8,30 @@ const { Provider } = OnboardingProviderContext;
 
 export const useOnboardingProvider = () => useContext(OnboardingProviderContext);
 
-const ShepherdController = () => {
+const ShepherdController = ({
+  tours,
+}: {
+  tours: Array<{
+    tourOptions: TourOptions;
+    steps: StepOptions[];
+    route: string;
+    id: string;
+  }>;
+}) => {
   const Shepherd = useShepherd();
-  const [tour, setTour] = useState(null);
-
-  const initializeTour = useCallback(
-    (steps, tourOptions = {}) => {
-      const newTour = new Shepherd.Tour({
-        steps,
-        ...tourOptions,
-      });
-      setTour(newTour);
-    },
-    [Shepherd]
-  );
-
-  const startTour = useCallback(() => {
-    if (tour) {
-      tour.start();
-    }
-  }, [tour]);
-
-  const exitTour = useCallback(() => {
-    if (tour) {
-      tour.cancel();
-    }
-  }, [tour]);
-
-  const nextStep = useCallback(() => {
-    if (tour) {
-      tour.next();
-    }
-  }, [tour]);
-
-  const previousStep = useCallback(() => {
-    if (tour) {
-      tour.back();
-    }
-  }, [tour]);
 
   return null;
 };
 
 const OnboardingProvider = ({ children }: { children: React.ReactNode }) => {
+  const tours = window?.config?.tours;
+  if (!tours) {
+    return <>{children}</>;
+  }
   return (
     <ShepherdJourneyProvider>
       <Provider value={{}}>
-        <ShepherdController />
+        <ShepherdController tours={tours} />
         {children}
       </Provider>
     </ShepherdJourneyProvider>