From 0b1ea7bc0d7817a324712291448e164b6cafde93 Mon Sep 17 00:00:00 2001
From: Aslam H <iupin5212@gmail.com>
Date: Tue, 10 Sep 2024 13:08:30 +0700
Subject: [PATCH] chore: register tooltip provider

---
 web/app/layout.tsx                            |  9 ++--
 .../components/ui/toolbar-button.tsx          | 50 +++++++++----------
 web/components/routes/link/bottom-bar.tsx     | 16 +++---
 .../routes/link/partials/form/url-input.tsx   | 48 +++++++++---------
 4 files changed, 60 insertions(+), 63 deletions(-)

diff --git a/web/app/layout.tsx b/web/app/layout.tsx
index 4a63cc2f..b9dd669c 100644
--- a/web/app/layout.tsx
+++ b/web/app/layout.tsx
@@ -9,6 +9,7 @@ import { ConfirmProvider } from "@/lib/providers/confirm-provider"
 import { DeepLinkProvider } from "@/lib/providers/deep-link-provider"
 import { GeistMono, GeistSans } from "./fonts"
 import { JazzAndAuth } from "@/lib/providers/jazz-provider"
+import { TooltipProvider } from "@/components/ui/tooltip"
 
 export const metadata: Metadata = {
 	title: "Learn Anything",
@@ -20,9 +21,11 @@ const Providers = ({ children }: { children: React.ReactNode }) => (
 		<ClerkProviderClient>
 			<DeepLinkProvider>
 				<JotaiProvider>
-					<ConfirmProvider>
-						<JazzAndAuth>{children}</JazzAndAuth>
-					</ConfirmProvider>
+					<TooltipProvider>
+						<ConfirmProvider>
+							<JazzAndAuth>{children}</JazzAndAuth>
+						</ConfirmProvider>
+					</TooltipProvider>
 				</JotaiProvider>
 			</DeepLinkProvider>
 		</ClerkProviderClient>
diff --git a/web/components/la-editor/components/ui/toolbar-button.tsx b/web/components/la-editor/components/ui/toolbar-button.tsx
index 8556a35c..7a4371d7 100644
--- a/web/components/la-editor/components/ui/toolbar-button.tsx
+++ b/web/components/la-editor/components/ui/toolbar-button.tsx
@@ -1,4 +1,4 @@
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
 import { Toggle } from "@/components/ui/toggle"
 
 import * as React from "react"
@@ -16,31 +16,29 @@ const ToolbarButton = React.forwardRef<HTMLButtonElement, ToolbarButtonProps>(fu
 	ref
 ) {
 	return (
-		<TooltipProvider delayDuration={0}>
-			<Tooltip>
-				<TooltipTrigger asChild>
-					<Toggle
-						size="sm"
-						ref={ref}
-						className={cn(
-							"size-7 rounded-md p-0",
-							{
-								"bg-primary/10 text-primary hover:bg-primary/10 hover:text-primary": isActive
-							},
-							className
-						)}
-						{...props}
-					>
-						{children}
-					</Toggle>
-				</TooltipTrigger>
-				{tooltip && (
-					<TooltipContent {...tooltipOptions}>
-						<div className="flex flex-col items-center text-center">{tooltip}</div>
-					</TooltipContent>
-				)}
-			</Tooltip>
-		</TooltipProvider>
+		<Tooltip>
+			<TooltipTrigger asChild>
+				<Toggle
+					size="sm"
+					ref={ref}
+					className={cn(
+						"size-7 rounded-md p-0",
+						{
+							"bg-primary/10 text-primary hover:bg-primary/10 hover:text-primary": isActive
+						},
+						className
+					)}
+					{...props}
+				>
+					{children}
+				</Toggle>
+			</TooltipTrigger>
+			{tooltip && (
+				<TooltipContent {...tooltipOptions}>
+					<div className="flex flex-col items-center text-center">{tooltip}</div>
+				</TooltipContent>
+			)}
+		</Tooltip>
 	)
 })
 
diff --git a/web/components/routes/link/bottom-bar.tsx b/web/components/routes/link/bottom-bar.tsx
index aaae2665..995c7ad0 100644
--- a/web/components/routes/link/bottom-bar.tsx
+++ b/web/components/routes/link/bottom-bar.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useRef } from "react"
 import { motion, AnimatePresence } from "framer-motion"
 import { icons } from "lucide-react"
 import { Button } from "@/components/ui/button"
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
 import { getSpecialShortcut, formatShortcut, isMacOS } from "@/lib/utils"
 import { LaIcon } from "@/components/custom/la-icon"
 import { useAtom } from "jotai"
@@ -31,14 +31,12 @@ const ToolbarButton = React.forwardRef<HTMLButtonElement, ToolbarButtonProps>(
 
 		if (tooltip) {
 			return (
-				<TooltipProvider>
-					<Tooltip delayDuration={0}>
-						<TooltipTrigger asChild>{button}</TooltipTrigger>
-						<TooltipContent>
-							<p>{tooltip}</p>
-						</TooltipContent>
-					</Tooltip>
-				</TooltipProvider>
+				<Tooltip delayDuration={0}>
+					<TooltipTrigger asChild>{button}</TooltipTrigger>
+					<TooltipContent>
+						<p>{tooltip}</p>
+					</TooltipContent>
+				</Tooltip>
 			)
 		}
 
diff --git a/web/components/routes/link/partials/form/url-input.tsx b/web/components/routes/link/partials/form/url-input.tsx
index a90c4eb6..83878fb9 100644
--- a/web/components/routes/link/partials/form/url-input.tsx
+++ b/web/components/routes/link/partials/form/url-input.tsx
@@ -4,7 +4,7 @@ import { FormField, FormItem, FormControl, FormLabel, FormMessage } from "@/comp
 import { Input } from "@/components/ui/input"
 import { cn } from "@/lib/utils"
 import { LinkFormValues } from "./schema"
-import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip"
+import { Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip"
 import { TooltipArrow } from "@radix-ui/react-tooltip"
 
 interface UrlInputProps {
@@ -38,30 +38,28 @@ export const UrlInput: React.FC<UrlInputProps> = ({ urlFetched, fetchMetadata, i
 				>
 					<FormLabel className="sr-only">Url</FormLabel>
 					<FormControl>
-						<TooltipProvider delayDuration={0}>
-							<Tooltip open={shouldShowTooltip && !isFetchingUrlMetadata}>
-								<TooltipTrigger asChild>
-									<Input
-										{...field}
-										type={urlFetched ? "hidden" : "text"}
-										autoComplete="off"
-										maxLength={100}
-										autoFocus
-										placeholder="Paste a link or write a link"
-										className="placeholder:text-muted-foreground/70 h-8 border-none p-1.5 text-[15px] font-semibold shadow-none focus-visible:ring-0"
-										onKeyDown={handleKeyDown}
-										onFocus={() => setIsFocused(true)}
-										onBlur={() => setIsFocused(false)}
-									/>
-								</TooltipTrigger>
-								<TooltipContent align="center" side="top">
-									<TooltipArrow className="text-primary fill-current" />
-									<span>
-										Press <kbd className="px-1.5">Enter</kbd> to fetch metadata
-									</span>
-								</TooltipContent>
-							</Tooltip>
-						</TooltipProvider>
+						<Tooltip open={shouldShowTooltip && !isFetchingUrlMetadata}>
+							<TooltipTrigger asChild>
+								<Input
+									{...field}
+									type={urlFetched ? "hidden" : "text"}
+									autoComplete="off"
+									maxLength={100}
+									autoFocus
+									placeholder="Paste a link or write a link"
+									className="placeholder:text-muted-foreground/70 h-8 border-none p-1.5 text-[15px] font-semibold shadow-none focus-visible:ring-0"
+									onKeyDown={handleKeyDown}
+									onFocus={() => setIsFocused(true)}
+									onBlur={() => setIsFocused(false)}
+								/>
+							</TooltipTrigger>
+							<TooltipContent align="center" side="top">
+								<TooltipArrow className="text-primary fill-current" />
+								<span>
+									Press <kbd className="px-1.5">Enter</kbd> to fetch metadata
+								</span>
+							</TooltipContent>
+						</Tooltip>
 					</FormControl>
 					<FormMessage className="px-1.5" />
 				</FormItem>