mirror of
https://github.com/CopilotKit/CopilotKit.git
synced 2026-09-14 16:26:20 +08:00
01f5dbd1ee
Northstar AI CRM — a full-featured agentic sales CRM for an enterprise hardware seller, built with CopilotKit, the AG-UI protocol, and a TypeScript Strands agent (@strands-agents/sdk + @ag-ui/aws-strands). The first TypeScript Strands example under examples/. Highlights: - Agentic canvas: tool calls render on the workspace — quote approval opens a quote page; analyze_team and generate_weekly_report open dedicated report pages; frontend tools navigate the workspace. - Generative UI cards, human-in-the-loop follow-up approval, and a live STATE_SNAPSHOT that syncs a SQLite CRM store with the board, dashboard, and report pages. - Dashboard, pipeline (Kanban), products, team, and reports surfaces. Self-contained under examples/showcases/strands-crm with an agent/ + frontend/ split and a concurrently dev script; listed in examples/README.md.
30 lines
975 B
TypeScript
30 lines
975 B
TypeScript
"use client";
|
|
import { Card } from "@/components/ui/card";
|
|
import { BarList } from "@/components/charts";
|
|
import { teamLeaderboard, formatCurrency } from "@/lib/crm";
|
|
import type { CrmState } from "@/lib/crm";
|
|
|
|
/**
|
|
* Ranked team leaderboard: a BarList of every rep's all-time bookings
|
|
* (Closed-Won $), with their quota attainment shown as the secondary caption.
|
|
*/
|
|
export function TeamLeaderboard({ crm }: { crm: CrmState }) {
|
|
const rows = teamLeaderboard(crm).map((r) => ({
|
|
label: r.name,
|
|
value: r.bookings,
|
|
secondary: r.quota > 0 ? `${Math.round(r.attainment * 100)}%` : "—",
|
|
}));
|
|
|
|
return (
|
|
<Card className="gap-3 p-4">
|
|
<div className="flex items-baseline justify-between">
|
|
<div className="text-sm font-semibold">Leaderboard</div>
|
|
<div className="text-xs text-muted-foreground">
|
|
Bookings · attainment
|
|
</div>
|
|
</div>
|
|
<BarList data={rows} format={(v) => formatCurrency(v)} />
|
|
</Card>
|
|
);
|
|
}
|