| 1 | import { Outlet, data, type ShouldRevalidateFunctionArgs, useMatch, useRouteLoaderData } from "react-router"; |
| 2 | |
| 3 | import { type WorkspaceAgent, hasCodeAccess } from "@g1t/contracts"; |
| 4 | |
| 5 | import { AgentsSidebar } from "../../../components/agents-mode"; |
| 6 | |
| 7 | import type { Route } from "./+types/layout"; |
| 8 | import { type AgentTeamRef, teamsByAgent } from "../../../lib/people"; |
| 9 | import { identity, workspaceAgents } from "../../../lib/services.server"; |
| 10 | import { requireUser, roleIn } from "../../../lib/session.server"; |
| 11 | |
| 12 | /** |
| 13 | * Agents mode: the workspace's agents, for its sidebar, and how many live |
| 14 | * sessions each has (by agent id); null when the agents service does not answer. |
| 15 | */ |
| 16 | export type AgentsLayoutData = { |
| 17 | slug: string; |
| 18 | agents: WorkspaceAgent[] | null; |
| 19 | live: Record<string, number>; |
| 20 | /** The viewer's id, to tell their own personal agents from members' (which owners see). */ |
| 21 | viewer_id: string; |
| 22 | /** Whether the viewer may create an agent: owners always, members unless owners turned personal agents off. */ |
| 23 | may_create: boolean; |
| 24 | /** The visible teams each agent is on, by agent id (team memberships); null when they couldn't be read. */ |
| 25 | teams: Record<string, AgentTeamRef[]> | null; |
| 26 | }; |
| 27 | |
| 28 | export async function loader({ params, context, request }: Route.LoaderArgs): Promise<AgentsLayoutData> { |
| 29 | // Signed out, sign in first (as Chat and Docs do), rather than a 404. |
| 30 | const viewer = requireUser(context, request); |
| 31 | if (!roleIn(viewer, params.owner)) throw data(null, { status: 404 }); |
| 32 | const slug = params.owner.toLowerCase(); |
| 33 | const owner = roleIn(viewer, slug) === "owner"; |
| 34 | const [listed, live, policy, index] = await Promise.all([ |
| 35 | // Personal agents too: the viewer's own, and every member's for an owner. |
| 36 | workspaceAgents.list(slug, viewer!, { personal: "all" }).catch(() => null), |
| 37 | // Every live session counts, private ones too: a count says nothing about what it is. |
| 38 | workspaceAgents.sessions(slug, viewer!, { status: "live", limit: 200 }).catch(() => null), |
| 39 | owner ? Promise.resolve(null) : workspaceAgents.policy(slug, viewer!).catch(() => null), |
| 40 | identity.teamAgentIndex(slug).catch(() => null), |
| 41 | ]); |
| 42 | const counts: Record<string, number> = {}; |
| 43 | for (const session of live?.ok ? live.value : []) counts[session.agent_id] = (counts[session.agent_id] ?? 0) + 1; |
| 44 | return { |
| 45 | slug, |
| 46 | viewer_id: viewer.id, |
| 47 | may_create: owner || (policy?.ok ? policy.value.members_create_agents : true), |
| 48 | live: counts, |
| 49 | teams: index ? teamsByAgent(index) : null, |
| 50 | agents: listed?.ok ? listed.value.filter((agent) => !agent.archived_at).sort((a, b) => a.display_name.localeCompare(b.display_name)) : null, |
| 51 | }; |
| 52 | } |
| 53 | |
| 54 | /** The list changes when an agent is made or changed, or work is stopped or started; not when moving between them. */ |
| 55 | export function shouldRevalidate({ currentParams, nextParams, formMethod, defaultShouldRevalidate }: ShouldRevalidateFunctionArgs) { |
| 56 | if (formMethod && formMethod !== "GET") return defaultShouldRevalidate; |
| 57 | return currentParams.owner !== nextParams.owner; |
| 58 | } |
| 59 | |
| 60 | export default function AgentsLayout({ loaderData }: Route.ComponentProps) { |
| 61 | const root = useRouteLoaderData("root") as { user?: { workspaces?: { slug: string; role: string; code_access?: boolean }[] } | null } | undefined; |
| 62 | const membership = root?.user?.workspaces?.find((m) => m.slug === loaderData.slug) ?? null; |
| 63 | // A phone: the agents first, as a list; the fleet's numbers under it. |
| 64 | const index = useMatch("/:owner/-/agents"); |
| 65 | return ( |
| 66 | <> |
| 67 | {index && ( |
| 68 | <div className="-mx-4 -mt-6 mb-8 md:hidden"> |
| 69 | <AgentsSidebar slug={loaderData.slug} shellAgents={null} code={hasCodeAccess(membership)} owner={membership?.role === "owner"} phone /> |
| 70 | </div> |
| 71 | )} |
| 72 | <Outlet /> |
| 73 | </> |
| 74 | ); |
| 75 | } |