GKaszewski/movies-diary
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: hoist TooltipProvider to app root, remove per-component instances

Browse Source
This commit is contained in:
Gabriel Kaszewski
2026-07-10 00:25:04 +02:00
parent 5d4622e046
commit 306f4489fd
4 changed files with 47 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
spa/src/components/watch-medium-picker.tsx
View File

@@ -1,11 +1,6 @@
import { useTranslation } from "react-i18next"
import { Button } from "@/components/ui/button"
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip"
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
import { cn } from "@/lib/utils"
import { WATCH_MEDIUMS } from "@/lib/watch-mediums"
@@ -22,34 +17,32 @@ export function WatchMediumPicker({ value, onChange }: WatchMediumPickerProps) {
<p className="mb-2 text-xs uppercase tracking-wide text-muted-foreground">
{t("watchMedium.label")}
</p>
<TooltipProvider>
<div className="flex flex-wrap gap-1.5">
{WATCH_MEDIUMS.map(({ value: val, icon: Icon, labelKey }) => {
const selected = value === val
return (
<Tooltip key={val}>
<TooltipTrigger asChild>
<Button
type="button"
variant="outline"
size="icon"
className={cn(
"size-8",
selected && "border-[var(--aero-primary)] bg-[var(--aero-primary)] text-white shadow-[0_0_8px_var(--aero-primary-glow)]",
)}
aria-label={t(labelKey)}
aria-pressed={selected}
onClick={() => onChange(selected ? undefined : val)}
>
<Icon className="size-4" />
</Button>
</TooltipTrigger>
<TooltipContent sideOffset={4}>{t(labelKey)}</TooltipContent>
</Tooltip>
)
})}
</div>
</TooltipProvider>
<div className="flex flex-wrap gap-1.5">
{WATCH_MEDIUMS.map(({ value: val, icon: Icon, labelKey }) => {
const selected = value === val
return (
<Tooltip key={val}>
<TooltipTrigger asChild>
<Button
type="button"
variant="outline"
size="icon"
className={cn(
"size-8",
selected && "border-[var(--aero-primary)] bg-[var(--aero-primary)] text-white shadow-[0_0_8px_var(--aero-primary-glow)]",
)}
aria-label={t(labelKey)}
aria-pressed={selected}
onClick={() => onChange(selected ? undefined : val)}
>
<Icon className="size-4" />
</Button>
</TooltipTrigger>
<TooltipContent sideOffset={4}>{t(labelKey)}</TooltipContent>
</Tooltip>
)
})}
</div>
</div>
)
}