feat(desktop): aghub side panel revamp

crates/desktop/src/App.tsx

@@ -14,21 +14,22 @@ import { DeepLinkImportModal } from "./components/deep-link-import-modal";
 import { OnboardingController } from "./components/onboarding-controller";
 import { Redirect } from "./components/redirect";
 import { ErrorBoundary } from "./components/ui/error-boundary";
-import { useSidebarNavigation } from "./hooks/use-sidebar-navigation";
 import { MainLayout } from "./layouts/main-layout";
 import type { DeepLinkImportIntent } from "./lib/deep-link";
 import { parseDeepLink } from "./lib/deep-link";
 import { setupAppMenu } from "./lib/menu";
 import { initStore } from "./lib/store";
+import HomePage from "./pages/home";
 import InferenceProvidersPage from "./pages/inference-providers";
+import MarketPage from "./pages/market";
 import PluginsPage from "./pages/plugins";
 import ProjectDetailPage from "./pages/project/detail";
+import SearchResultsPage from "./pages/search";
 import SettingsPage from "./pages/settings";
 import CustomAgentsPage from "./pages/settings/custom-agents";
 import MCPServersPage from "./pages/settings/mcp-servers";
 import SkillsPage from "./pages/settings/skills";
 import SubAgentsPage from "./pages/settings/sub-agents";
-import SkillsShPage from "./pages/skills-sh";
 import SkillsSearchPage from "./pages/skills-sh/search";
 import { AgentAvailabilityProvider } from "./providers/agent-availability";
 import { ServerProvider } from "./providers/server";
@@ -44,31 +45,14 @@ const queryClient = new QueryClient({
 	},
 });
 
-function SkillsPageSkeleton() {
+function PageSkeleton() {
 	return (
-		<div className="flex h-full">
-			<div
-				className="
-      flex w-80 shrink-0 items-center justify-center border-r border-border
-    "
-			>
-				<Spinner />
-			</div>
-			<div className="flex-1" />
+		<div className="flex h-full items-center justify-center">
+			<Spinner />
 		</div>
 	);
 }
 
-function DefaultSidebarRoute() {
-	const { defaultHref, isLoading } = useSidebarNavigation();
-
-	if (isLoading) {
-		return null;
-	}
-
-	return <Redirect to={defaultHref} />;
-}
-
 function App() {
 	const [isStoreReady, setIsStoreReady] = useState(false);
 	const [pendingIntents, setPendingIntents] = useState<
@@ -178,110 +162,152 @@ function App() {
 								<OnboardingController />
 								<Switch>
 									<Route path="/">
-										<DefaultSidebarRoute />
-									</Route>
-									<Route path="/skills">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
-													<SkillsPage />
+													<HomePage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/mcp">
+
+									<Route path="/search">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
-													<MCPServersPage />
+													<SearchResultsPage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/inference-providers">
+
+									<Route path="/agents/:agentId/:rest*">
+										{(params) => (
+											<Redirect
+												to={`/skills?agent=${encodeURIComponent(params.agentId)}`}
+											/>
+										)}
+									</Route>
+
+									<Route path="/agents/:agentId">
+										{(params) => (
+											<Redirect
+												to={`/skills?agent=${encodeURIComponent(params.agentId)}`}
+											/>
+										)}
+									</Route>
+
+									<Route path="/market">
 										<MainLayout>
 											<ErrorBoundary>
-												<InferenceProvidersPage />
+												<Suspense
+													fallback={<PageSkeleton />}
+												>
+													<MarketPage />
+												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/skills-sh/search">
+
+									<Route path="/market/search">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
 													<SkillsSearchPage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/skills-sh">
+
+									<Route path="/library">
+										<Redirect to="/market" />
+									</Route>
+									<Route path="/library/search">
+										<Redirect to="/market/search" />
+									</Route>
+
+									<Route path="/skills">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
-													<SkillsShPage />
+													<SkillsPage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/cc-plugins">
+									<Route path="/mcp">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
-													<PluginsPage />
+													<MCPServersPage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/settings">
+									<Route path="/sub-agents">
 										<MainLayout>
-											<SettingsPage />
+											<ErrorBoundary>
+												<Suspense
+													fallback={<PageSkeleton />}
+												>
+													<SubAgentsPage />
+												</Suspense>
+											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/settings/custom-agents">
+									<Route path="/inference-providers">
 										<MainLayout>
-											<CustomAgentsPage />
+											<ErrorBoundary>
+												<InferenceProvidersPage />
+											</ErrorBoundary>
 										</MainLayout>
 									</Route>
-									<Route path="/sub-agents">
+									<Route path="/skills-sh">
+										<Redirect to="/market" />
+									</Route>
+									<Route path="/skills-sh/search">
+										<Redirect to="/market/search" />
+									</Route>
+
+									<Route path="/cc-plugins">
 										<MainLayout>
 											<ErrorBoundary>
 												<Suspense
-													fallback={
-														<SkillsPageSkeleton />
-													}
+													fallback={<PageSkeleton />}
 												>
-													<SubAgentsPage />
+													<PluginsPage />
 												</Suspense>
 											</ErrorBoundary>
 										</MainLayout>
 									</Route>
+
+									<Route path="/settings">
+										<MainLayout>
+											<SettingsPage />
+										</MainLayout>
+									</Route>
+									<Route path="/settings/custom-agents">
+										<MainLayout>
+											<CustomAgentsPage />
+										</MainLayout>
+									</Route>
 									<Route path="/projects/:id">
 										<MainLayout>
 											<ProjectDetailPage />
 										</MainLayout>
 									</Route>
 									<Route>
-										<DefaultSidebarRoute />
+										<Redirect to="/" />
 									</Route>
 								</Switch>
 								<DeepLinkImportModal