Initial commit for project Spoon!

2026-06-21 17:52:02 -05:00
commit cf7ff2ee4e
268 changed files with 32981 additions and 0 deletions
@@ -0,0 +1,51 @@
+'use client';
+
+import type { ReactNode } from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import { Bot, GitBranch, LayoutDashboard, RefreshCw, User } from 'lucide-react';
+
+import { cn } from '@spoon/ui';
+
+const navItems = [
+  { href: '/dashboard', label: 'Dashboard', icon: LayoutDashboard },
+  { href: '/spoons', label: 'My Spoons', icon: GitBranch },
+  { href: '/updates', label: 'Updates', icon: RefreshCw },
+  { href: '/agents', label: 'Agents', icon: Bot },
+  { href: '/profile', label: 'Profile', icon: User },
+];
+
+export const AppShell = ({ children }: { children: ReactNode }) => {
+  const pathname = usePathname();
+  return (
+    <div className='bg-muted/20 flex-1 border-t'>
+      <div className='container mx-auto grid gap-6 px-4 py-6 lg:grid-cols-[14rem_1fr]'>
+        <aside className='lg:sticky lg:top-20 lg:self-start'>
+          <nav className='border-border bg-card flex gap-1 overflow-x-auto border p-2 lg:flex-col'>
+            {navItems.map(({ href, label, icon: Icon }) => {
+              const active =
+                pathname === href ||
+                (href !== '/dashboard' && pathname.startsWith(href));
+              return (
+                <Link
+                  key={href}
+                  href={href}
+                  className={cn(
+                    'hover:bg-muted flex min-w-fit items-center gap-2 rounded-md px-3 py-2 text-sm font-medium transition-colors',
+                    active
+                      ? 'bg-primary/10 text-primary'
+                      : 'text-muted-foreground hover:text-foreground',
+                  )}
+                >
+                  <Icon className='size-4' />
+                  {label}
+                </Link>
+              );
+            })}
+          </nav>
+        </aside>
+        <div className='min-w-0'>{children}</div>
+      </div>
+    </div>
+  );
+};