fix: address code review - use SidebarMenuAction, remove inline IIFE

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Author: Copilot

apps/console/src/components/AppSidebar.tsx

@@ -21,6 +21,7 @@ import {
   SidebarMenu,
   SidebarMenuItem,
   SidebarMenuButton,
+  SidebarMenuAction,
   DropdownMenu,
   DropdownMenuTrigger,
   DropdownMenuContent,
@@ -183,13 +184,13 @@ export function AppSidebar({ activeAppName, onAppChange }: { activeAppName: stri
                          <span className="truncate">{item.label}</span>
                        </Link>
                      </SidebarMenuButton>
-                     <button
+                     <SidebarMenuAction
+                       showOnHover
                        onClick={(e) => { e.stopPropagation(); removeFavorite(item.id); }}
-                       className="absolute right-1 top-1/2 -translate-y-1/2 opacity-0 group-hover/menu-item:opacity-100 p-1 rounded hover:bg-accent"
                        aria-label={`Remove ${item.label} from favorites`}
                      >
-                       <StarOff className="h-3 w-3 text-muted-foreground" />
-                     </button>
+                       <StarOff className="h-3 w-3" />
+                     </SidebarMenuAction>
                    </SidebarMenuItem>
                  ))}
                </SidebarMenu>

apps/console/src/components/SearchResultsPage.tsx

@@ -173,12 +173,14 @@ export function SearchResultsPage() {
                   </Badge>
                 </h2>
                 <div className="grid gap-2">
-                  {items.map(item => (
+                  {items.map(item => {
+                    const ItemIcon = TYPE_ICONS[item.type] || Database;
+                    return (
                     <Link key={item.id} to={item.href}>
                       <Card className="hover:bg-accent/50 transition-colors cursor-pointer">
                         <CardContent className="flex items-center gap-3 p-3">
                           <div className={`flex h-8 w-8 items-center justify-center rounded ${TYPE_COLORS[item.type] || ''}`}>
-                            {(() => { const I = TYPE_ICONS[item.type] || Database; return <I className="h-4 w-4" />; })()}
+                            <ItemIcon className="h-4 w-4" />
                           </div>
                           <div className="flex-1 min-w-0">
                             <p className="text-sm font-medium truncate">{item.label}</p>
@@ -192,7 +194,8 @@ export function SearchResultsPage() {
                         </CardContent>
                       </Card>
                     </Link>
-                  ))}
+                    );
+                  })}
                 </div>
               </div>
             );