From 3812b831c9ae95480d9d8380ba45f7b19aea8b55 Mon Sep 17 00:00:00 2001
From: Daniel Arroyo <darroylat@gmail.com>
Date: Wed, 8 Jul 2026 00:00:01 -0400
Subject: [PATCH] fix(Button): asChild slot children error

- Separate render paths: asChild uses Slot directly, normal uses button
- Fixes "Slot failed to slot onto its children" runtime error
- Slot now always receives exactly one child (the Link element)
---
 web/src/components/ui/Button.tsx | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/web/src/components/ui/Button.tsx b/web/src/components/ui/Button.tsx
index db4b6ed..ab30a16 100644
--- a/web/src/components/ui/Button.tsx
+++ b/web/src/components/ui/Button.tsx
@@ -47,17 +47,27 @@ export interface ButtonProps
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, loading, disabled, asChild = false, children, ...props }, ref) => {
-    const Comp = asChild ? Slot : 'button'
+    if (asChild) {
+      return (
+        <Slot
+          className={cn(buttonVariants({ variant, size, className }))}
+          ref={ref}
+          {...props}
+        >
+          {children}
+        </Slot>
+      )
+    }
     return (
-      <Comp
+      <button
         className={cn(buttonVariants({ variant, size, className }))}
         ref={ref}
-        disabled={asChild ? undefined : (disabled || loading)}
+        disabled={disabled || loading}
         {...props}
       >
-        {loading && !asChild && <Loader2 className="h-4 w-4 animate-spin" />}
+        {loading && <Loader2 className="h-4 w-4 animate-spin" />}
         {children}
-      </Comp>
+      </button>
     )
   }
 )