Files
multica/packages/views/layout/dashboard-layout.tsx
Jiayuan 4561b2aef8 feat(views): replace toast with stacked progress indicators above Chat FAB
Replace the sonner toast-based Quick Capture progress with circular
indicators that stack above the Chat FAB button:

- Each pending quick-create shows the agent avatar in a circle with
  a spinning border ring
- Hover expands the pill to show "Agent is creating…"
- On success: green check overlay, identifier shown on hover, click
  to navigate to the new issue. Auto-fades after 3s.
- On failure: red X overlay, error message on hover. Auto-fades after 5s.
- Multiple concurrent tasks stack vertically above the FAB

Architecture:
- New QuickCreateStack component in packages/views/chat/
- Listens to inbox:new WS events to detect completion/failure
- Added agentId to QuickCreatePendingTask for avatar rendering
- Removed QuickCreateToasts and toast.loading() calls
- Mounted alongside ChatFab in both web and desktop layouts
2026-04-29 18:51:28 +02:00

46 lines
1.3 KiB
TypeScript

"use client";
import type { ReactNode } from "react";
import { SidebarProvider, SidebarInset } from "@multica/ui/components/ui/sidebar";
import { ModalRegistry } from "../modals/registry";
import { AppSidebar } from "./app-sidebar";
import { DashboardGuard } from "./dashboard-guard";
import { WorkspacePresencePrefetch } from "./workspace-presence-prefetch";
interface DashboardLayoutProps {
children: ReactNode;
/** Rendered inside SidebarInset (e.g. ChatWindow, ChatFab — absolute-positioned overlays) */
extra?: ReactNode;
/** Rendered inside sidebar header as a search trigger */
searchSlot?: ReactNode;
/** Loading indicator */
loadingIndicator?: ReactNode;
}
export function DashboardLayout({
children,
extra,
searchSlot,
loadingIndicator,
}: DashboardLayoutProps) {
return (
<DashboardGuard
loadingFallback={
<div className="flex h-svh items-center justify-center">
{loadingIndicator}
</div>
}
>
<SidebarProvider className="h-svh">
<WorkspacePresencePrefetch />
<AppSidebar searchSlot={searchSlot} />
<SidebarInset className="relative overflow-hidden">
{children}
<ModalRegistry />
{extra}
</SidebarInset>
</SidebarProvider>
</DashboardGuard>
);
}