From 1fa5442f211fb06548bc51ea3192b5e0b4ffe614 Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Wed, 15 Apr 2026 01:00:05 +0200 Subject: [PATCH] chore: remove debugging throughout codebase --- apps/web/src/components/ui/context-menu.tsx | 605 +++++++++--------- apps/web/src/components/ui/dialog.tsx | 293 ++++----- apps/web/src/components/ui/dropdown-menu.tsx | 13 +- apps/web/src/components/ui/popover.tsx | 103 ++- apps/web/src/components/ui/select.tsx | 445 ++++++------- apps/web/src/components/ui/sheet.tsx | 317 ++++----- .../components/ui/use-overlay-open-change.ts | 133 ++-- apps/web/src/core/managers/project-manager.ts | 2 - apps/web/src/hooks/use-keybindings.ts | 95 --- apps/web/src/lib/actions/registry.ts | 23 - .../renderer/compositor/wasm-compositor.ts | 15 - .../web/src/services/renderer/gpu-renderer.ts | 9 +- 12 files changed, 947 insertions(+), 1106 deletions(-) diff --git a/apps/web/src/components/ui/context-menu.tsx b/apps/web/src/components/ui/context-menu.tsx index bdf1a30a..c54910fb 100644 --- a/apps/web/src/components/ui/context-menu.tsx +++ b/apps/web/src/components/ui/context-menu.tsx @@ -1,303 +1,302 @@ -"use client"; - -import * as React from "react"; -import { ContextMenu as ContextMenuPrimitive } from "radix-ui"; -import { cva, type VariantProps } from "class-variance-authority"; -import { cn } from "@/utils/ui"; -import { HugeiconsIcon } from "@hugeicons/react"; -import { - Tick02Icon, - ArrowRightIcon, - CircleIcon, -} from "@hugeicons/core-free-icons"; -import { useOverlayOpenChange } from "./use-overlay-open-change"; - -function ContextMenu({ - onOpenChange, - ...props -}: React.ComponentProps) { - const handleOpenChange = useOverlayOpenChange({ - source: "context-menu", - onOpenChange, - }); - return ( - - ); -} - -const ContextMenuTrigger = ContextMenuPrimitive.Trigger; - -const ContextMenuGroup = ContextMenuPrimitive.Group; - -const ContextMenuPortal = ContextMenuPrimitive.Portal; - -const ContextMenuSub = ContextMenuPrimitive.Sub; - -const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup; - -const contextMenuItemVariants = cva( - "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-1.5 text-sm text-foreground/85 outline-hidden data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:size-3.5 [&_svg]:shrink-0", - { - variants: { - variant: { - default: - "focus:bg-accent focus:text-accent-foreground [&_svg]:text-muted-foreground", - destructive: - "text-destructive focus:bg-destructive/10 focus:text-destructive [&_svg]:text-destructive", - }, - }, - defaultVariants: { - variant: "default", - }, - }, -); - -const ContextMenuSubTrigger = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - inset?: boolean; - variant?: VariantProps["variant"]; - icon?: React.ReactNode; - } ->( - ( - { className, inset, children, variant = "default", icon, ...props }, - ref, - ) => ( - - {icon && ( - {icon} - )} - {children} - - - ), -); -ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName; - -const ContextMenuSubContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName; - -const ContextMenuContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - container?: HTMLElement | null; - } ->(({ className, container, ...props }, ref) => ( - - - -)); -ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName; - -const ContextMenuItem = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - inset?: boolean; - variant?: VariantProps["variant"]; - icon?: React.ReactNode; - textRight?: string; - } ->( - ( - { - className, - inset, - variant = "default", - icon, - children, - textRight, - ...props - }, - ref, - ) => { - const shouldInsetContent = inset || Boolean(icon); - - return ( - - {icon && ( - - {icon} - - )} - {children} - {textRight && ( - - {textRight} - - )} - - ); - }, -); -ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName; - -const ContextMenuCheckboxItem = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - variant?: VariantProps["variant"]; - icon?: React.ReactNode; - } ->( - ( - { className, children, checked, variant = "default", icon, ...props }, - ref, - ) => ( - - - - - - - {icon && ( - {icon} - )} - {children} - - ), -); -ContextMenuCheckboxItem.displayName = - ContextMenuPrimitive.CheckboxItem.displayName; - -const ContextMenuRadioItem = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - variant?: VariantProps["variant"]; - icon?: React.ReactNode; - } ->(({ className, children, variant = "default", icon, ...props }, ref) => ( - - - - - - - {icon && ( - {icon} - )} - {children} - -)); -ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName; - -const ContextMenuLabel = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - inset?: boolean; - icon?: React.ReactNode; - } ->(({ className, inset, icon, children, ...props }, ref) => ( - - {icon && ( - {icon} - )} - {children} - -)); -ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName; - -const ContextMenuSeparator = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName; - -const ContextMenuShortcut = ({ - className, - ...props -}: React.HTMLAttributes) => { - return ( - - ); -}; -ContextMenuShortcut.displayName = "ContextMenuShortcut"; - -export { - ContextMenu, - ContextMenuTrigger, - ContextMenuContent, - ContextMenuItem, - ContextMenuCheckboxItem, - ContextMenuRadioItem, - ContextMenuLabel, - ContextMenuSeparator, - ContextMenuShortcut, - ContextMenuGroup, - ContextMenuPortal, - ContextMenuSub, - ContextMenuSubContent, - ContextMenuSubTrigger, - ContextMenuRadioGroup, -}; +"use client"; + +import * as React from "react"; +import { ContextMenu as ContextMenuPrimitive } from "radix-ui"; +import { cva, type VariantProps } from "class-variance-authority"; +import { cn } from "@/utils/ui"; +import { HugeiconsIcon } from "@hugeicons/react"; +import { + Tick02Icon, + ArrowRightIcon, + CircleIcon, +} from "@hugeicons/core-free-icons"; +import { useOverlayOpenChange } from "./use-overlay-open-change"; + +function ContextMenu({ + onOpenChange, + ...props +}: React.ComponentProps) { + const handleOpenChange = useOverlayOpenChange({ + onOpenChange, + }); + return ( + + ); +} + +const ContextMenuTrigger = ContextMenuPrimitive.Trigger; + +const ContextMenuGroup = ContextMenuPrimitive.Group; + +const ContextMenuPortal = ContextMenuPrimitive.Portal; + +const ContextMenuSub = ContextMenuPrimitive.Sub; + +const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup; + +const contextMenuItemVariants = cva( + "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-1.5 text-sm text-foreground/85 outline-hidden data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:size-3.5 [&_svg]:shrink-0", + { + variants: { + variant: { + default: + "focus:bg-accent focus:text-accent-foreground [&_svg]:text-muted-foreground", + destructive: + "text-destructive focus:bg-destructive/10 focus:text-destructive [&_svg]:text-destructive", + }, + }, + defaultVariants: { + variant: "default", + }, + }, +); + +const ContextMenuSubTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + variant?: VariantProps["variant"]; + icon?: React.ReactNode; + } +>( + ( + { className, inset, children, variant = "default", icon, ...props }, + ref, + ) => ( + + {icon && ( + {icon} + )} + {children} + + + ), +); +ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName; + +const ContextMenuSubContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName; + +const ContextMenuContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + container?: HTMLElement | null; + } +>(({ className, container, ...props }, ref) => ( + + + +)); +ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName; + +const ContextMenuItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + variant?: VariantProps["variant"]; + icon?: React.ReactNode; + textRight?: string; + } +>( + ( + { + className, + inset, + variant = "default", + icon, + children, + textRight, + ...props + }, + ref, + ) => { + const shouldInsetContent = inset || Boolean(icon); + + return ( + + {icon && ( + + {icon} + + )} + {children} + {textRight && ( + + {textRight} + + )} + + ); + }, +); +ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName; + +const ContextMenuCheckboxItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + variant?: VariantProps["variant"]; + icon?: React.ReactNode; + } +>( + ( + { className, children, checked, variant = "default", icon, ...props }, + ref, + ) => ( + + + + + + + {icon && ( + {icon} + )} + {children} + + ), +); +ContextMenuCheckboxItem.displayName = + ContextMenuPrimitive.CheckboxItem.displayName; + +const ContextMenuRadioItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + variant?: VariantProps["variant"]; + icon?: React.ReactNode; + } +>(({ className, children, variant = "default", icon, ...props }, ref) => ( + + + + + + + {icon && ( + {icon} + )} + {children} + +)); +ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName; + +const ContextMenuLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + inset?: boolean; + icon?: React.ReactNode; + } +>(({ className, inset, icon, children, ...props }, ref) => ( + + {icon && ( + {icon} + )} + {children} + +)); +ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName; + +const ContextMenuSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName; + +const ContextMenuShortcut = ({ + className, + ...props +}: React.HTMLAttributes) => { + return ( + + ); +}; +ContextMenuShortcut.displayName = "ContextMenuShortcut"; + +export { + ContextMenu, + ContextMenuTrigger, + ContextMenuContent, + ContextMenuItem, + ContextMenuCheckboxItem, + ContextMenuRadioItem, + ContextMenuLabel, + ContextMenuSeparator, + ContextMenuShortcut, + ContextMenuGroup, + ContextMenuPortal, + ContextMenuSub, + ContextMenuSubContent, + ContextMenuSubTrigger, + ContextMenuRadioGroup, +}; diff --git a/apps/web/src/components/ui/dialog.tsx b/apps/web/src/components/ui/dialog.tsx index 60ea46c1..6a604a0c 100644 --- a/apps/web/src/components/ui/dialog.tsx +++ b/apps/web/src/components/ui/dialog.tsx @@ -1,145 +1,148 @@ -"use client"; - -import * as React from "react"; -import { Dialog as DialogPrimitive } from "radix-ui"; -import { X } from "lucide-react"; -import { cn } from "@/utils/ui"; -import { useOverlayOpenChange } from "./use-overlay-open-change"; - -function Dialog({ - open, - onOpenChange, - ...props -}: React.ComponentProps) { - const handleOpenChange = useOverlayOpenChange({ - source: "dialog", - open, - onOpenChange, - }); - return ( - - ); -} - -const DialogTrigger = DialogPrimitive.Trigger; - -const DialogPortal = DialogPrimitive.Portal; - -const DialogClose = DialogPrimitive.Close; - -const DialogOverlay = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -DialogOverlay.displayName = DialogPrimitive.Overlay.displayName; - -const DialogContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, children, ...props }, ref) => ( - - - { - e.stopPropagation(); - e.preventDefault(); - }} - {...props} - > - {children} - - - Close - - - -)); -DialogContent.displayName = DialogPrimitive.Content.displayName; - -const DialogHeader = ({ - className, - ...props -}: React.HTMLAttributes) => ( -
-); -DialogHeader.displayName = "DialogHeader"; - -const DialogBody = ({ - className, - ...props -}: React.HTMLAttributes) => ( -
-); -DialogBody.displayName = "DialogBody"; - -const DialogFooter = ({ - className, - ...props -}: React.HTMLAttributes) => ( -
-); -DialogFooter.displayName = "DialogFooter"; - -const DialogTitle = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -DialogTitle.displayName = DialogPrimitive.Title.displayName; - -const DialogDescription = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -DialogDescription.displayName = DialogPrimitive.Description.displayName; - -export { - Dialog, - DialogPortal, - DialogOverlay, - DialogTrigger, - DialogClose, - DialogContent, - DialogHeader, - DialogBody, - DialogFooter, - DialogTitle, - DialogDescription, -}; +"use client"; + +import * as React from "react"; +import { Dialog as DialogPrimitive } from "radix-ui"; +import { X } from "lucide-react"; +import { cn } from "@/utils/ui"; +import { useOverlayOpenChange } from "./use-overlay-open-change"; + +function Dialog({ + open, + onOpenChange, + ...props +}: React.ComponentProps) { + const handleOpenChange = useOverlayOpenChange({ + open, + onOpenChange, + }); + return ( + + ); +} + +const DialogTrigger = DialogPrimitive.Trigger; + +const DialogPortal = DialogPrimitive.Portal; + +const DialogClose = DialogPrimitive.Close; + +const DialogOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +DialogOverlay.displayName = DialogPrimitive.Overlay.displayName; + +const DialogContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + { + e.stopPropagation(); + e.preventDefault(); + }} + {...props} + > + {children} + + + Close + + + +)); +DialogContent.displayName = DialogPrimitive.Content.displayName; + +const DialogHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +DialogHeader.displayName = "DialogHeader"; + +const DialogBody = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +DialogBody.displayName = "DialogBody"; + +const DialogFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +DialogFooter.displayName = "DialogFooter"; + +const DialogTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +DialogTitle.displayName = DialogPrimitive.Title.displayName; + +const DialogDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +DialogDescription.displayName = DialogPrimitive.Description.displayName; + +export { + Dialog, + DialogPortal, + DialogOverlay, + DialogTrigger, + DialogClose, + DialogContent, + DialogHeader, + DialogBody, + DialogFooter, + DialogTitle, + DialogDescription, +}; diff --git a/apps/web/src/components/ui/dropdown-menu.tsx b/apps/web/src/components/ui/dropdown-menu.tsx index 4cc27132..c116b83b 100644 --- a/apps/web/src/components/ui/dropdown-menu.tsx +++ b/apps/web/src/components/ui/dropdown-menu.tsx @@ -13,7 +13,6 @@ function DropdownMenu({ ...props }: React.ComponentProps) { const handleOpenChange = useOverlayOpenChange({ - source: "dropdown-menu", open, onOpenChange, }); @@ -105,12 +104,12 @@ const DropdownMenuContent = React.forwardRef< e.preventDefault(); }} className={cn( - "group/menu bg-popover text-popover-foreground z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-lg", - className, - )} - {...props} - /> - + "group/menu bg-popover text-popover-foreground z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-lg", + className, + )} + {...props} + /> + )); DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName; diff --git a/apps/web/src/components/ui/popover.tsx b/apps/web/src/components/ui/popover.tsx index 5a0495fc..1d8fa6b5 100644 --- a/apps/web/src/components/ui/popover.tsx +++ b/apps/web/src/components/ui/popover.tsx @@ -1,52 +1,51 @@ -"use client"; - -import * as React from "react"; -import { Popover as PopoverPrimitive } from "radix-ui"; -import { cn } from "@/utils/ui"; -import { useOverlayOpenChange } from "./use-overlay-open-change"; - -function Popover({ - open, - onOpenChange, - ...props -}: React.ComponentProps) { - const handleOpenChange = useOverlayOpenChange({ - source: "popover", - open, - onOpenChange, - }); - return ( - - ); -} - -const PopoverTrigger = PopoverPrimitive.Trigger; - -const PopoverAnchor = PopoverPrimitive.Anchor; - -const PopoverClose = PopoverPrimitive.Close; - -const PopoverContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( - - - -)); -PopoverContent.displayName = PopoverPrimitive.Content.displayName; - -export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose }; +"use client"; + +import * as React from "react"; +import { Popover as PopoverPrimitive } from "radix-ui"; +import { cn } from "@/utils/ui"; +import { useOverlayOpenChange } from "./use-overlay-open-change"; + +function Popover({ + open, + onOpenChange, + ...props +}: React.ComponentProps) { + const handleOpenChange = useOverlayOpenChange({ + open, + onOpenChange, + }); + return ( + + ); +} + +const PopoverTrigger = PopoverPrimitive.Trigger; + +const PopoverAnchor = PopoverPrimitive.Anchor; + +const PopoverClose = PopoverPrimitive.Close; + +const PopoverContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( + + + +)); +PopoverContent.displayName = PopoverPrimitive.Content.displayName; + +export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose }; diff --git a/apps/web/src/components/ui/select.tsx b/apps/web/src/components/ui/select.tsx index b53dada1..eb7f5855 100644 --- a/apps/web/src/components/ui/select.tsx +++ b/apps/web/src/components/ui/select.tsx @@ -1,221 +1,224 @@ -"use client"; - -import * as React from "react"; -import { Select as SelectPrimitive } from "radix-ui"; -import { Check } from "lucide-react"; -import { ArrowUpIcon, ArrowDownIcon } from "@hugeicons/core-free-icons"; -import { cva, type VariantProps } from "class-variance-authority"; -import { cn } from "@/utils/ui"; -import { HugeiconsIcon } from "@hugeicons/react"; -import { useOverlayOpenChange } from "./use-overlay-open-change"; - -function Select({ - open, - onOpenChange, - ...props -}: React.ComponentProps) { - const handleOpenChange = useOverlayOpenChange({ - source: "select", - open, - onOpenChange, - }); - return ( - - ); -} - -const SelectGroup = SelectPrimitive.Group; - -const SelectValue = SelectPrimitive.Value; - -const selectItemVariants = cva( - "relative flex cursor-pointer select-none items-center gap-1.5 rounded-sm px-2 py-1 text-sm text-foreground/85 outline-hidden data-[highlighted]:bg-popover-hover data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0", - { - variants: { - variant: { - default: "", - destructive: - "text-destructive data-[highlighted]:bg-destructive/5 data-[highlighted]:text-destructive", - }, - }, - defaultVariants: { - variant: "default", - }, - }, -); - -const selectTriggerVariants = cva( - "border-border ring-offset-background placeholder:text-muted-foreground flex h-7 w-auto cursor-pointer items-center justify-between gap-1 rounded-md border px-2.5 text-sm whitespace-nowrap transition-none focus:border-primary focus:ring-0 focus:ring-primary/10 focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1", - { - variants: { - variant: { - default: "bg-accent", - outline: "bg-background hover:bg-accent/50", - }, - size: { - default: "", - sm: "rounded-sm", - }, - }, - defaultVariants: { - variant: "default", - size: "default", - }, - }, -); - -const SelectTrigger = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & - VariantProps & { - icon?: React.ReactNode; - } ->(({ className, children, icon, variant, size, ...props }, ref) => ( - -
- {icon && ( - - {icon} - - )} - {children} -
- - - - -)); -SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; - -const SelectScrollUpButton = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - - - -)); -SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; - -const SelectScrollDownButton = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - - - -)); -SelectScrollDownButton.displayName = - SelectPrimitive.ScrollDownButton.displayName; - -const SelectContent = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, children, position = "popper", ...props }, ref) => ( - - { - e.preventDefault(); - e.stopPropagation(); - }} - {...props} - > - - - {children} - - - - -)); -SelectContent.displayName = SelectPrimitive.Content.displayName; - -const SelectLabel = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -SelectLabel.displayName = SelectPrimitive.Label.displayName; - -const SelectItem = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef & { - variant?: VariantProps["variant"]; - } ->(({ className, children, variant = "default", ...props }, ref) => ( - - - - - - - {children} - -)); -SelectItem.displayName = SelectPrimitive.Item.displayName; - -const SelectSeparator = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -SelectSeparator.displayName = SelectPrimitive.Separator.displayName; - -export { - Select, - SelectGroup, - SelectValue, - SelectTrigger, - SelectContent, - SelectLabel, - SelectItem, - SelectSeparator, - SelectScrollUpButton, - SelectScrollDownButton, -}; +"use client"; + +import * as React from "react"; +import { Select as SelectPrimitive } from "radix-ui"; +import { Check } from "lucide-react"; +import { ArrowUpIcon, ArrowDownIcon } from "@hugeicons/core-free-icons"; +import { cva, type VariantProps } from "class-variance-authority"; +import { cn } from "@/utils/ui"; +import { HugeiconsIcon } from "@hugeicons/react"; +import { useOverlayOpenChange } from "./use-overlay-open-change"; + +function Select({ + open, + onOpenChange, + ...props +}: React.ComponentProps) { + const handleOpenChange = useOverlayOpenChange({ + open, + onOpenChange, + }); + return ( + + ); +} + +const SelectGroup = SelectPrimitive.Group; + +const SelectValue = SelectPrimitive.Value; + +const selectItemVariants = cva( + "relative flex cursor-pointer select-none items-center gap-1.5 rounded-sm px-2 py-1 text-sm text-foreground/85 outline-hidden data-[highlighted]:bg-popover-hover data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0", + { + variants: { + variant: { + default: "", + destructive: + "text-destructive data-[highlighted]:bg-destructive/5 data-[highlighted]:text-destructive", + }, + }, + defaultVariants: { + variant: "default", + }, + }, +); + +const selectTriggerVariants = cva( + "border-border ring-offset-background placeholder:text-muted-foreground flex h-7 w-auto cursor-pointer items-center justify-between gap-1 rounded-md border px-2.5 text-sm whitespace-nowrap transition-none focus:border-primary focus:ring-0 focus:ring-primary/10 focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1", + { + variants: { + variant: { + default: "bg-accent", + outline: "bg-background hover:bg-accent/50", + }, + size: { + default: "", + sm: "rounded-sm", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + }, +); + +const SelectTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps & { + icon?: React.ReactNode; + } +>(({ className, children, icon, variant, size, ...props }, ref) => ( + +
+ {icon && ( + + {icon} + + )} + {children} +
+ + + + +)); +SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; + +const SelectScrollUpButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; + +const SelectScrollDownButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollDownButton.displayName = + SelectPrimitive.ScrollDownButton.displayName; + +const SelectContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, position = "popper", ...props }, ref) => ( + + { + e.preventDefault(); + e.stopPropagation(); + }} + {...props} + > + + + {children} + + + + +)); +SelectContent.displayName = SelectPrimitive.Content.displayName; + +const SelectLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectLabel.displayName = SelectPrimitive.Label.displayName; + +const SelectItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & { + variant?: VariantProps["variant"]; + } +>(({ className, children, variant = "default", ...props }, ref) => ( + + + + + + + {children} + +)); +SelectItem.displayName = SelectPrimitive.Item.displayName; + +const SelectSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectSeparator.displayName = SelectPrimitive.Separator.displayName; + +export { + Select, + SelectGroup, + SelectValue, + SelectTrigger, + SelectContent, + SelectLabel, + SelectItem, + SelectSeparator, + SelectScrollUpButton, + SelectScrollDownButton, +}; diff --git a/apps/web/src/components/ui/sheet.tsx b/apps/web/src/components/ui/sheet.tsx index 675e6b96..4b930ff6 100644 --- a/apps/web/src/components/ui/sheet.tsx +++ b/apps/web/src/components/ui/sheet.tsx @@ -1,157 +1,160 @@ -"use client"; - -import * as React from "react"; -import { Dialog as SheetPrimitive } from "radix-ui"; -import { cva, type VariantProps } from "class-variance-authority"; -import { X } from "lucide-react"; -import { cn } from "@/utils/ui"; -import { useOverlayOpenChange } from "./use-overlay-open-change"; - -function Sheet({ - open, - onOpenChange, - ...props -}: React.ComponentProps) { - const handleOpenChange = useOverlayOpenChange({ - source: "sheet", - open, - onOpenChange, - }); - return ( - - ); -} - -const SheetTrigger = SheetPrimitive.Trigger; - -const SheetClose = SheetPrimitive.Close; - -const SheetPortal = SheetPrimitive.Portal; - -const SheetOverlay = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -SheetOverlay.displayName = SheetPrimitive.Overlay.displayName; - -const sheetVariants = cva( - "fixed z-250 gap-4 bg-background p-6 shadow-lg transition ease data-[state=closed]:duration-250 data-[state=open]:duration-250 data-[state=open]:animate-in data-[state=closed]:animate-out", - { - variants: { - side: { - top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", - bottom: - "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", - left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", - right: - "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", - }, - }, - defaultVariants: { - side: "right", - }, - }, -); - -interface SheetContentProps - extends React.ComponentPropsWithoutRef, - VariantProps {} - -const SheetContent = React.forwardRef< - React.ElementRef, - SheetContentProps ->(({ side = "right", className, children, ...props }, ref) => ( - - - { - e.preventDefault(); - e.stopPropagation(); - }} - {...props} - > - - - Close - - {children} - - -)); -SheetContent.displayName = SheetPrimitive.Content.displayName; - -const SheetHeader = ({ - className, - ...props -}: React.HTMLAttributes) => ( -
-); -SheetHeader.displayName = "SheetHeader"; - -const SheetFooter = ({ - className, - ...props -}: React.HTMLAttributes) => ( -
-); -SheetFooter.displayName = "SheetFooter"; - -const SheetTitle = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -SheetTitle.displayName = SheetPrimitive.Title.displayName; - -const SheetDescription = React.forwardRef< - React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, ...props }, ref) => ( - -)); -SheetDescription.displayName = SheetPrimitive.Description.displayName; - -export { - Sheet, - SheetPortal, - SheetOverlay, - SheetTrigger, - SheetClose, - SheetContent, - SheetHeader, - SheetFooter, - SheetTitle, - SheetDescription, -}; +"use client"; + +import * as React from "react"; +import { Dialog as SheetPrimitive } from "radix-ui"; +import { cva, type VariantProps } from "class-variance-authority"; +import { X } from "lucide-react"; +import { cn } from "@/utils/ui"; +import { useOverlayOpenChange } from "./use-overlay-open-change"; + +function Sheet({ + open, + onOpenChange, + ...props +}: React.ComponentProps) { + const handleOpenChange = useOverlayOpenChange({ + open, + onOpenChange, + }); + return ( + + ); +} + +const SheetTrigger = SheetPrimitive.Trigger; + +const SheetClose = SheetPrimitive.Close; + +const SheetPortal = SheetPrimitive.Portal; + +const SheetOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetOverlay.displayName = SheetPrimitive.Overlay.displayName; + +const sheetVariants = cva( + "fixed z-250 gap-4 bg-background p-6 shadow-lg transition ease data-[state=closed]:duration-250 data-[state=open]:duration-250 data-[state=open]:animate-in data-[state=closed]:animate-out", + { + variants: { + side: { + top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", + bottom: + "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", + left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", + right: + "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", + }, + }, + defaultVariants: { + side: "right", + }, + }, +); + +interface SheetContentProps + extends React.ComponentPropsWithoutRef, + VariantProps {} + +const SheetContent = React.forwardRef< + React.ElementRef, + SheetContentProps +>(({ side = "right", className, children, ...props }, ref) => ( + + + { + e.preventDefault(); + e.stopPropagation(); + }} + {...props} + > + + + Close + + {children} + + +)); +SheetContent.displayName = SheetPrimitive.Content.displayName; + +const SheetHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +SheetHeader.displayName = "SheetHeader"; + +const SheetFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +SheetFooter.displayName = "SheetFooter"; + +const SheetTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetTitle.displayName = SheetPrimitive.Title.displayName; + +const SheetDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetDescription.displayName = SheetPrimitive.Description.displayName; + +export { + Sheet, + SheetPortal, + SheetOverlay, + SheetTrigger, + SheetClose, + SheetContent, + SheetHeader, + SheetFooter, + SheetTitle, + SheetDescription, +}; diff --git a/apps/web/src/components/ui/use-overlay-open-change.ts b/apps/web/src/components/ui/use-overlay-open-change.ts index c5ef5331..dbc46cfc 100644 --- a/apps/web/src/components/ui/use-overlay-open-change.ts +++ b/apps/web/src/components/ui/use-overlay-open-change.ts @@ -1,78 +1,55 @@ -import { useCallback, useEffect, useId, useRef } from "react"; -import { useKeybindingsStore } from "@/stores/keybindings-store"; - -export function useOverlayOpenChange({ - source, - open, - onOpenChange, -}: { - source: string; - open?: boolean; - onOpenChange?: (open: boolean) => void; -}) { - const { openOverlay, closeOverlay } = useKeybindingsStore(); - const isTrackedRef = useRef(false); - const isControlled = typeof open === "boolean"; - const overlayId = useId(); - - useEffect(() => { - if (!isControlled) return; - - if (open && !isTrackedRef.current) { - openOverlay(overlayId, source); - isTrackedRef.current = true; - return; - } - - if (!open && isTrackedRef.current) { - closeOverlay(overlayId, source); - isTrackedRef.current = false; - } - }, [closeOverlay, isControlled, open, openOverlay, overlayId, source]); - - useEffect(() => { - return () => { - if (!isTrackedRef.current) return; - // #region agent log - fetch( - "http://127.0.0.1:7245/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7", - { - method: "POST", - headers: { - "Content-Type": "application/json", - "X-Debug-Session-Id": "3997d9", - }, - body: JSON.stringify({ - sessionId: "3997d9", - runId: "post-fix", - hypothesisId: "H2", - location: "use-overlay-open-change.ts:cleanup", - message: "Overlay closed during unmount cleanup", - data: { source, overlayId }, - timestamp: Date.now(), - }), - }, - ).catch(() => {}); - // #endregion - closeOverlay(overlayId, source); - isTrackedRef.current = false; - }; - }, [closeOverlay, overlayId, source]); - - return useCallback( - (nextOpen: boolean) => { - if (!isControlled) { - if (nextOpen && !isTrackedRef.current) { - openOverlay(overlayId, source); - isTrackedRef.current = true; - } else if (!nextOpen && isTrackedRef.current) { - closeOverlay(overlayId, source); - isTrackedRef.current = false; - } - } - - onOpenChange?.(nextOpen); - }, - [closeOverlay, isControlled, onOpenChange, openOverlay, overlayId, source], - ); -} +import { useCallback, useEffect, useId, useRef } from "react"; +import { useKeybindingsStore } from "@/stores/keybindings-store"; + +export function useOverlayOpenChange({ + open, + onOpenChange, +}: { + open?: boolean; + onOpenChange?: (open: boolean) => void; +}) { + const { openOverlay, closeOverlay } = useKeybindingsStore(); + const isTrackedRef = useRef(false); + const isControlled = typeof open === "boolean"; + const overlayId = useId(); + + useEffect(() => { + if (!isControlled) return; + + if (open && !isTrackedRef.current) { + openOverlay(overlayId); + isTrackedRef.current = true; + return; + } + + if (!open && isTrackedRef.current) { + closeOverlay(overlayId); + isTrackedRef.current = false; + } + }, [closeOverlay, isControlled, open, openOverlay, overlayId]); + + useEffect(() => { + return () => { + if (!isTrackedRef.current) return; + closeOverlay(overlayId); + isTrackedRef.current = false; + }; + }, [closeOverlay, overlayId]); + + return useCallback( + (nextOpen: boolean) => { + if (!isControlled) { + if (nextOpen && !isTrackedRef.current) { + openOverlay(overlayId); + isTrackedRef.current = true; + } else if (!nextOpen && isTrackedRef.current) { + closeOverlay(overlayId); + isTrackedRef.current = false; + } + } + + onOpenChange?.(nextOpen); + }, + [closeOverlay, isControlled, onOpenChange, openOverlay, overlayId], + ); +} diff --git a/apps/web/src/core/managers/project-manager.ts b/apps/web/src/core/managers/project-manager.ts index 48ea270c..81b237da 100644 --- a/apps/web/src/core/managers/project-manager.ts +++ b/apps/web/src/core/managers/project-manager.ts @@ -528,12 +528,10 @@ export class ProjectManager { } async prepareExit(): Promise { - console.log("prepareExit", this.active); if (!this.active) return; try { const didUpdateThumbnail = await this.updateThumbnailFromTimeline(); - console.log("didUpdateThumbnail", didUpdateThumbnail); if (didUpdateThumbnail) { await this.editor.save.flush(); } diff --git a/apps/web/src/hooks/use-keybindings.ts b/apps/web/src/hooks/use-keybindings.ts index 3f96c340..0c524214 100644 --- a/apps/web/src/hooks/use-keybindings.ts +++ b/apps/web/src/hooks/use-keybindings.ts @@ -21,68 +21,10 @@ export function useKeybindingsListener() { useEffect(() => { const eventOptions: AddEventListenerOptions = { capture: true }; - // #region agent log - fetch("http://127.0.0.1:7245/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7", { - method: "POST", - headers: { - "Content-Type": "application/json", - "X-Debug-Session-Id": "3997d9", - }, - body: JSON.stringify({ - sessionId: "3997d9", - runId: "initial", - hypothesisId: "H1", - location: "use-keybindings.ts:effect", - message: "Keybindings listener mounted", - data: { - overlayDepth, - isLoadingProject, - isRecording, - keybindingCount: Object.keys(keybindings).length, - }, - timestamp: Date.now(), - }), - }).catch(() => {}); - // #endregion const handleKeyDown = (ev: KeyboardEvent) => { const normalizedKey = (ev.key ?? "").toLowerCase(); - const shouldLogKey = - ev.code === "Space" || - ev.code.startsWith("Key") || - ["escape", "delete", "backspace", "enter"].includes(normalizedKey); if (overlayDepth > 0 || isLoadingProject || isRecording) { - if (shouldLogKey) { - // #region agent log - fetch( - "http://127.0.0.1:7245/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7", - { - method: "POST", - headers: { - "Content-Type": "application/json", - "X-Debug-Session-Id": "3997d9", - }, - body: JSON.stringify({ - sessionId: "3997d9", - runId: "initial", - hypothesisId: "H2", - location: "use-keybindings.ts:blocked", - message: "Shortcut blocked by runtime gate", - data: { - key: ev.key, - code: ev.code, - overlayDepth, - isLoadingProject, - isRecording, - targetTag: - ev.target instanceof HTMLElement ? ev.target.tagName : null, - }, - timestamp: Date.now(), - }), - }, - ).catch(() => {}); - // #endregion - } return; } @@ -93,43 +35,6 @@ export function useKeybindingsListener() { isTypableDOMElement({ element: activeElement }); const boundAction = binding ? keybindings[binding] : undefined; - if (shouldLogKey || binding || boundAction) { - // #region agent log - fetch( - "http://127.0.0.1:7245/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7", - { - method: "POST", - headers: { - "Content-Type": "application/json", - "X-Debug-Session-Id": "3997d9", - }, - body: JSON.stringify({ - sessionId: "3997d9", - runId: "initial", - hypothesisId: !binding ? "H3" : isTextInput ? "H5" : "H4", - location: "use-keybindings.ts:keydown", - message: "Shortcut keydown observed", - data: { - key: ev.key, - code: ev.code, - binding, - boundAction: boundAction ?? null, - isTextInput, - keybindingCount: Object.keys(keybindings).length, - activeTag: - activeElement instanceof HTMLElement - ? activeElement.tagName - : null, - targetTag: - ev.target instanceof HTMLElement ? ev.target.tagName : null, - }, - timestamp: Date.now(), - }), - }, - ).catch(() => {}); - // #endregion - } - if (normalizedKey === "escape" && isTextInput) { activeElement.blur(); return; diff --git a/apps/web/src/lib/actions/registry.ts b/apps/web/src/lib/actions/registry.ts index c825a5e4..e69b3b9f 100644 --- a/apps/web/src/lib/actions/registry.ts +++ b/apps/web/src/lib/actions/registry.ts @@ -57,29 +57,6 @@ export const invokeAction: InvokeActionFunc = ( args?: TArgOfAction, trigger?: TInvocationTrigger, ) => { - if (trigger === "keypress") { - // #region agent log - fetch("http://127.0.0.1:7245/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7", { - method: "POST", - headers: { - "Content-Type": "application/json", - "X-Debug-Session-Id": "3997d9", - }, - body: JSON.stringify({ - sessionId: "3997d9", - runId: "initial", - hypothesisId: "H4", - location: "actions/registry.ts:invokeAction", - message: "Action invoked from keypress", - data: { - action, - handlerCount: boundActions[action]?.length ?? 0, - }, - timestamp: Date.now(), - }), - }).catch(() => {}); - // #endregion - } boundActions[action]?.forEach((handler) => { handler(args, trigger); }); diff --git a/apps/web/src/services/renderer/compositor/wasm-compositor.ts b/apps/web/src/services/renderer/compositor/wasm-compositor.ts index 1faecc32..16b03853 100644 --- a/apps/web/src/services/renderer/compositor/wasm-compositor.ts +++ b/apps/web/src/services/renderer/compositor/wasm-compositor.ts @@ -52,7 +52,6 @@ class WasmCompositor { string, { source: CanvasImageSource; width: number; height: number } >(); - private _debugLogged = false; ensureInitialized({ width, height }: { width: number; height: number }) { if (!this.canvas) { @@ -121,20 +120,6 @@ class WasmCompositor { } render(frame: FrameDescriptor) { - if (!this._debugLogged) { - this._debugLogged = true; - const firstLayer = frame.items.find((item) => item.type === "layer"); - console.log( - "[compositor] first frame — canvas size:", - JSON.stringify({ width: frame.width, height: frame.height }), - "| first layer transform:", - firstLayer && firstLayer.type === "layer" - ? JSON.stringify(firstLayer.transform) - : "none", - "| webgpu available:", - typeof navigator !== "undefined" && "gpu" in navigator, - ); - } renderFrame(frame); } } diff --git a/apps/web/src/services/renderer/gpu-renderer.ts b/apps/web/src/services/renderer/gpu-renderer.ts index b11aa8e2..c11c3015 100644 --- a/apps/web/src/services/renderer/gpu-renderer.ts +++ b/apps/web/src/services/renderer/gpu-renderer.ts @@ -13,18 +13,11 @@ export function initializeGpuRenderer(): Promise { initPromise = initializeGpu() .then(() => { gpuAvailable = true; - // #region agent log - fetch('http://127.0.0.1:7408/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7',{method:'POST',headers:{'Content-Type':'application/json','X-Debug-Session-Id':'b140a6'},body:JSON.stringify({sessionId:'b140a6',location:'gpu-renderer.ts',message:'GPU init SUCCESS',data:{userAgent:navigator.userAgent},timestamp:Date.now()})}).catch(()=>{}); - // #endregion }) .catch((error: unknown) => { gpuAvailable = false; - const message = - error instanceof Error ? error.message : String(error); + const message = error instanceof Error ? error.message : String(error); console.warn(`GPU renderer unavailable: ${message}`); - // #region agent log - fetch('http://127.0.0.1:7408/ingest/669b22f8-172b-4e65-aa3f-1c702ede83f7',{method:'POST',headers:{'Content-Type':'application/json','X-Debug-Session-Id':'b140a6'},body:JSON.stringify({sessionId:'b140a6',location:'gpu-renderer.ts',message:'GPU init FAILED',data:{error:message,userAgent:navigator.userAgent,hasGpu:!!navigator.gpu},timestamp:Date.now()})}).catch(()=>{}); - // #endregion }); } return initPromise;