fix(nav): trim sidebar items, fix collapsed sidebar overflow, add add-tool buttons on home/browse

artifacts/toolrate/src/components/layout.tsx

@@ -1,5 +1,5 @@
 import { Link, useLocation } from "wouter";
-import { LayoutDashboard, Wrench, PlusCircle, BarChart3, LogIn, LogOut, ShieldCheck, AlertTriangle, Trash2, Bookmark, Search } from "lucide-react";
+import { LayoutDashboard, Wrench, BarChart3, LogIn, LogOut, ShieldCheck, AlertTriangle, Bookmark, Search } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { useAuth } from "@/hooks/use-auth";
 import { useGetVersion, getGetVersionQueryKey } from "@workspace/api-client-react";
@@ -38,10 +38,8 @@ export function Layout({ children }: { children: React.ReactNode }) {
   const mainLinks = [
     { href: "/", label: t("nav.home"), icon: LayoutDashboard },
     { href: "/tools", label: t("nav.browseTools"), icon: Wrench },
-    { href: "/tools/new", label: t("nav.addTool"), icon: PlusCircle },
     { href: "/analytics", label: t("nav.analytics"), icon: BarChart3 },
     ...(hasFeature("watchlist") ? [{ href: "/watchlist", label: t("nav.watchlist"), icon: Bookmark }] : []),
-    ...(hasFeature("trash") ? [{ href: "/trash", label: t("nav.trash"), icon: Trash2 }] : []),
   ];
 
   const adminLinks = [

artifacts/toolrate/src/components/user-menu.tsx

@@ -39,9 +39,9 @@ export function UserMenu() {
 
   if (isLoading) {
     return (
-      <div className="flex items-center gap-3 px-3 py-2">
+      <div className="flex items-center gap-3 px-3 py-2 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:px-0 group-data-[collapsible=icon]:gap-0">
         <Skeleton className="h-8 w-8 rounded-full" />
-        <Skeleton className="h-4 w-24" />
+        <Skeleton className="h-4 w-24 group-data-[collapsible=icon]:hidden" />
       </div>
     );
   }
@@ -51,12 +51,12 @@ export function UserMenu() {
       <Button
         variant="outline"
         size="sm"
-        className="w-full gap-2"
+        className="w-full gap-2 group-data-[collapsible=icon]:w-auto group-data-[collapsible=icon]:gap-0 group-data-[collapsible=icon]:justify-center"
         onClick={() => login(location)}
         data-testid="button-login"
       >
         <LogIn className="w-4 h-4" />
-        {t("auth.signIn")}
+        <span className="group-data-[collapsible=icon]:hidden">{t("auth.signIn")}</span>
       </Button>
     );
   }
@@ -72,7 +72,7 @@ export function UserMenu() {
         <Button
           variant="ghost"
           size="sm"
-          className="w-full justify-start gap-3 px-3 py-2 h-auto"
+          className="w-full justify-start gap-3 px-3 py-2 h-auto group-data-[collapsible=icon]:w-auto group-data-[collapsible=icon]:gap-0 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:px-1"
           data-testid="button-user-menu"
         >
           <Avatar className="h-8 w-8">
@@ -80,7 +80,7 @@ export function UserMenu() {
               {initials(displayName)}
             </AvatarFallback>
           </Avatar>
-          <span className="min-w-0 flex-1 text-left">
+          <span className="min-w-0 flex-1 text-left group-data-[collapsible=icon]:hidden">
             <span className="block text-sm font-medium truncate">{displayName}</span>
             <span className="block text-[11px] text-muted-foreground truncate">
               {user.email ?? tier}

artifacts/toolrate/src/pages/home.tsx

@@ -8,7 +8,7 @@ import { Card, CardHeader, CardTitle, CardDescription, CardContent } from "@/com
 import { Skeleton } from "@/components/ui/skeleton";
 import { Layout } from "@/components/layout";
 import { ToolCard } from "@/components/tool-card";
-import { Star, Wrench, MessageSquare, ArrowRight } from "lucide-react";
+import { Star, Wrench, MessageSquare, ArrowRight, Plus } from "lucide-react";
 import { Link } from "wouter";
 import { Button } from "@/components/ui/button";
 import { useTranslation } from "react-i18next";
@@ -22,10 +22,18 @@ export default function Home() {
   return (
     <Layout>
       <div className="space-y-8 pb-8">
+        <div className="flex flex-col sm:flex-row justify-between items-start sm:items-end gap-4">
           <div>
             <h1 className="text-3xl font-bold tracking-tight mb-2">{t("home.welcome")}</h1>
             <p className="text-muted-foreground">{t("home.tagline")}</p>
           </div>
+          <Button asChild>
+            <Link href="/tools/new">
+              <Plus className="w-4 h-4 mr-1" />
+              {t("browse.addTool")}
+            </Link>
+          </Button>
+        </div>
 
         {/* Stats Banner */}
         <div className="grid grid-cols-1 md:grid-cols-3 gap-4">

artifacts/toolrate/src/pages/tools-browse.tsx

@@ -25,7 +25,7 @@ import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Skeleton } from "@/components/ui/skeleton";
-import { Search, Wrench, X, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal } from "lucide-react";
+import { Search, Wrench, X, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, Plus } from "lucide-react";
 import { Link, useLocation, useSearch } from "wouter";
 import { cn } from "@/lib/utils";
 
@@ -234,7 +234,10 @@ export default function ToolsBrowse() {
             <p className="text-muted-foreground">{t("browse.subtitle")}</p>
           </div>
           <Button asChild>
-            <Link href="/tools/new">{t("browse.addTool")}</Link>
+            <Link href="/tools/new">
+              <Plus className="w-4 h-4 mr-1" />
+              {t("browse.addTool")}
+            </Link>
           </Button>
         </div>