Added Tooltip Wrapper inside context wrappers to show tooltip on top of every node

src/frontend/src/components/ShadTooltipComponent/index.tsx

@@ -1,10 +1,5 @@
 import { ShadToolTipType } from "../../types/components";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from "../ui/tooltip";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
 
 export default function ShadTooltip({
   content,
@@ -15,19 +10,17 @@ export default function ShadTooltip({
   delayDuration = 500,
 }: ShadToolTipType) {
   return (
-    <TooltipProvider>
-      <Tooltip delayDuration={delayDuration}>
-        <TooltipTrigger asChild={asChild}>{children}</TooltipTrigger>
+    <Tooltip delayDuration={delayDuration}>
+      <TooltipTrigger asChild={asChild}>{children}</TooltipTrigger>
 
-        <TooltipContent
-          className={style}
-          side={side}
-          avoidCollisions={false}
-          sticky="always"
-        >
-          {content}
-        </TooltipContent>
-      </Tooltip>
-    </TooltipProvider>
+      <TooltipContent
+        className={style}
+        side={side}
+        avoidCollisions={false}
+        sticky="always"
+      >
+        {content}
+      </TooltipContent>
+    </Tooltip>
   );
 }

src/frontend/src/contexts/index.tsx

@@ -1,5 +1,6 @@
 import { ReactNode } from "react";
 import { ReactFlowProvider } from "reactflow";
+import { TooltipProvider } from "../components/ui/tooltip";
 import { SSEProvider } from "./SSEContext";
 import { AlertProvider } from "./alertContext";
 import { DarkProvider } from "./darkContext";
@@ -13,23 +14,25 @@ export default function ContextWrapper({ children }: { children: ReactNode }) {
   //element to wrap all context
   return (
     <>
-      <ReactFlowProvider>
-        <DarkProvider>
-          <TypesProvider>
-            <LocationProvider>
-              <AlertProvider>
-                <SSEProvider>
-                  <TabsProvider>
-                    <UndoRedoProvider>
-                      <PopUpProvider>{children}</PopUpProvider>
-                    </UndoRedoProvider>
-                  </TabsProvider>
-                </SSEProvider>
-              </AlertProvider>
-            </LocationProvider>
-          </TypesProvider>
-        </DarkProvider>
-      </ReactFlowProvider>
+      <TooltipProvider>
+        <ReactFlowProvider>
+          <DarkProvider>
+            <TypesProvider>
+              <LocationProvider>
+                <AlertProvider>
+                  <SSEProvider>
+                    <TabsProvider>
+                      <UndoRedoProvider>
+                        <PopUpProvider>{children}</PopUpProvider>
+                      </UndoRedoProvider>
+                    </TabsProvider>
+                  </SSEProvider>
+                </AlertProvider>
+              </LocationProvider>
+            </TypesProvider>
+          </DarkProvider>
+        </ReactFlowProvider>
+      </TooltipProvider>
     </>
   );
 }

src/frontend/src/modals/formModal/chatMessage/index.tsx

@@ -54,7 +54,7 @@ export default function ChatMessage({
             {hidden && chat.thought && chat.thought !== "" && (
               <div
                 onClick={() => setHidden((prev) => !prev)}
-                className="absolute -left-8 -top-3 cursor-pointer"
+                className="absolute -left-6 -top-3 cursor-pointer"
               >
                 <THOUGHTS_ICON className="h-4 w-4 animate-bounce dark:text-white" />
               </div>