Shell (main-chat-shell-spec): rail rebuilt around a 48px squircle claw avatar stack with a 2px coral active ring + name beneath + online dot, dashed 'New claw' tile, lucide-icon nav pills with the live credits balance shown inline (coral when negative, aria-hidden so the nav link name stays 'Credits'); 80px transparent chat header with 36px round sessions/new-session icon buttons and the 42px coral-glow Computer launcher; 768px centered content rail. RosterList computes the active claw from the pathname so AgentRosterItem stays presentational. Chat (chat-message-components): asymmetric layout — user pill #1A1A1A radius 24/24/4 with inset white ring + dual shadow, capped 75%, vs the bubble-less assistant message (50px squircle avatar, 15px gap, plain 14px/1.7 text); messageSlideIn entrance; 126px welcome avatar with the 24px/600/-0.6px heading (claw name in coral) and lucide-led suggestion chips; floating 24px-radius neutral-800 composer card with the cream Send pill; StepTrace rows restyled to the system. Brand marks (Chrome, Slack) vendored to public/services from the bundle. 83 unit tests, full 29-journey functional E2E green. Co-Authored-By: Claude Fable 5 <[email protected]>
39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import { redirect } from "next/navigation";
|
|
|
|
import { LeftRail } from "@/components/shell/LeftRail";
|
|
import { ApiAuthError } from "@/lib/api/http";
|
|
import { fetchClaws, fetchCredits, fetchMe } from "@/lib/api/team";
|
|
import type { Agent, Credits, User } from "@/lib/api/schemas";
|
|
|
|
// Every workspace page shares the persistent rail (§4). This layout reads
|
|
// only path-level data — search params stay client-side (see panel-params).
|
|
export default async function WorkspaceLayout({
|
|
children,
|
|
}: Readonly<{ children: React.ReactNode }>) {
|
|
let user: User;
|
|
let roster: Agent[];
|
|
let credits: Credits;
|
|
try {
|
|
[user, roster, credits] = await Promise.all([
|
|
fetchMe(),
|
|
fetchClaws(),
|
|
fetchCredits(),
|
|
]);
|
|
} catch (error) {
|
|
if (error instanceof ApiAuthError) {
|
|
redirect("/login");
|
|
}
|
|
throw error;
|
|
}
|
|
return (
|
|
<div className="flex min-h-dvh">
|
|
<LeftRail
|
|
user={user}
|
|
roster={roster}
|
|
creditsBalance={credits.available}
|
|
/>
|
|
<main className="min-w-0 flex-1">{children}</main>
|
|
</div>
|
|
);
|
|
}
|