Display-only generative UI must use useComponent (not useFrontendTool): its
render is unconditional so the card persists after the tool call completes.
Also pass [transactions, cards] as deps so the renderer re-registers when the
data loads -- otherwise the closure captures the initial empty transactions
and the list renders empty.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The migration mounted the low-level CopilotKitProvider, which omits the
ThreadsProvider that holds the rendered message thread, so the agent ran but
the transcript stayed empty. Use the full CopilotKit provider, and set
useSingleEndpoint={false} to match the multi-endpoint Hono route (the default
single-endpoint transport 404s against it).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- cards PUT handler: stop console.info'ing the request body, which
included the plaintext PIN on every PIN-change request.
- wrapper.tsx: drop the duplicate ./globals.css import (already
imported in app/layout.tsx, which is the canonical place).
- copilot-context.tsx: replace window.location.pathname read during
render with usePathname() from next/navigation, matching how
components/layout.tsx already derives the current route.
- next.config.mjs: remove the eslint.ignoreDuringBuilds block — Next 16
no longer runs ESLint at build, and the key now produces an
"Unrecognized key(s): 'eslint'" warning. Confirmed warning is gone.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
package.json was pinning next@14 / react@18, but the root pnpm.overrides
were already forcing next@16 / react@19 at install time and the code uses
Next 16 async params. Bump the declared ranges to ^16.0.10 / ^19 (and
@types/react{,-dom} to ^19) so the manifest matches reality and matches
the v2 reference demos (mcp-apps, generative-ui-playground).
Also drop examples/showcases/banking/pnpm-lock.yaml: the demo is a
workspace package (listed in root pnpm-workspace.yaml and resolved in the
root pnpm-lock.yaml), so the per-demo lockfile was vestigial v1 cruft
that contradicted the v2 migration.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace v1-era hooks/data references with the actual v2 surface:
useAgentContext / useFrontendTool / useHumanInTheLoop from
@copilotkit/react-core/v2, the Hono runtime route, the seed.json + store
data layer, and the Northwind identity. Drop mentions of removed
SQL/MSA/ServiceNow/RAG features.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Remove the /Hydration/i pattern from the ignored-console-errors filter so
Next.js hydration mismatches surface as real failures, and add a
page.on("pageerror", ...) listener that records uncaught exceptions and
asserts none occurred. pageerrors are not filtered — any uncaught
exception fails the smoke test.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Adds a CI-safe Playwright smoke test that verifies the banking showcase
boots and the CopilotKit v2 popup opens with its configured suggestion
pills, without invoking the agent (so it runs in CI without secrets).
Covers:
- Document title shows the Northwind Finance brand
- Credit-cards dashboard renders ("Credit Cards" heading)
- CopilotPopup launcher opens the dialog (Northwind Copilot)
- Three suggestion pills render: View transactions, Add a card,
Assign a policy
The dev server gets a dummy OPENAI_API_KEY so the runtime route boots,
but the test never sends a chat message or clicks a suggestion.
.gitignore: ignore test-results/, playwright-report/, and
tsconfig.tsbuildinfo so they don't become clutter.
Banking was on Tailwind v3, which made the pre-compiled v2 stylesheet
(`@copilotkit/react-core/v2/styles.css`, built as Tailwind v4 output)
incompatible with the PostCSS pipeline. A temporary inline-CSS hack in
`layout.tsx` worked around this. Migrate to Tailwind v4 to match the
canonical v2 demos and remove the hack.
- package.json: tailwindcss ^4, add @tailwindcss/postcss ^4, replace
tailwindcss-animate with tw-animate-css (v4 drop-in)
- postcss.config.mjs: switch plugin to @tailwindcss/postcss
- globals.css: use @import "tailwindcss" + @import "tw-animate-css";
add @custom-variant dark for the existing .dark/.light class toggle;
move shadcn color/radius mapping into @theme inline (preserves
bg-background/text-foreground/rounded-{lg,md,sm} semantics)
- tailwind.config.ts: deleted; theme now lives in CSS
- components.json: clear stale tailwind.config reference
- layout.tsx: drop the readFileSync/dangerouslySetInnerHTML inline-CSS
workaround; import "@copilotkit/react-core/v2/styles.css" the normal
way alongside ./globals.css
Verified: tsc clean, next build clean, Playwright-rendered all four
pages (/, /dashboard, /cards, /team) with computed-style checks
(sidebar bg-gray-900 dark, rounded-lg=8px, .border=1px) and opened
the copilot popup which renders fully styled with the v2 stylesheet.
The banking showcase was migrated to CopilotKit v2 but `src/app/layout.tsx`
still imported the removed `@copilotkit/react-ui/styles.css`, causing every
route to 500 with "Module not found". Drop the dead import.
Banking is still on Tailwind v3, while the v2 stylesheet
(`@copilotkit/react-core/v2/styles.css`) is pre-compiled Tailwind v4 output
containing bare `@layer base { ... }` rules. Tailwind v3's PostCSS plugin
rejects `@layer base` without a matching `@tailwind base` directive, so any
CSS import routed through the JS/TSX pipeline fails the build. Move the v2
stylesheet load to a server-side `fs.readFileSync` + inline `<style>` tag in
the root layout so the CSS reaches the browser without passing through
PostCSS / Tailwind v3. This avoids a full Tailwind v4 migration of the app.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Replace toy team names and @example.com emails with credible
professional names and @northwind.example addresses (preserve ids,
roles, team assignments). Default Admin is Alex Morgan.
- Set <title> metadata to IDENTITY.brand (Northwind Finance).
- Add formatCurrency helper in lib/utils.ts and route all money
rendering (transactions list, credit-card details, dashboard +
cards summary tiles) through it so amounts always render as
$10,000.00 / -$1,000.00.
- Instruct the Northwind Copilot prompt to treat the rendered
showTransactions list as the single source of truth so prose no
longer restates counts/totals and contradicts the rendered list.
- Remove stray console.log and tighten == to === in components/layout.tsx.
Replace the in-memory `data` literal in `api/v1/data.ts` with a
file-seeded, module-singleton store:
- `src/data/seed.json` holds the seed (cards, team, policies,
transactions) with refreshed dates (within ~60 days of 2026-06-02)
and valid future card expiries.
- `src/lib/store.ts` deep-clones the seed at module init and exposes
typed read accessors (cards/team/policies/transactions, findCard,
findPolicy, findTransaction) plus the exact mutator set the routes
use (addCard, updateCardPin, assignPolicyToCard, addPolicy,
updateTransaction, addMember, updateMember, removeMember).
- All `src/app/api/v1/**/route.ts` files now read/write through the
store. `data.ts` retains the shared interfaces/enums/CARD_COLORS/
generateUniqueId and drops the literal `data` constant.
- Mutations persist for the running server process and reset to seed
on restart (intentional demo behavior; no disk write-back).
- Domain-data only — conversation threads/memory live in a separate
ticket (FOR-137).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Switch imports from @copilotkit/react-core to /v2 in layout.tsx and actions.ts
- Replace useCopilotReadable with useAgentContext
- Stringify the credit cards/policies/transactions context value to satisfy
the JsonSerializable type
- Switch imports from @copilotkit/react-core to /v2
- Replace useCopilotReadable with useAgentContext (stringify object value)
- Convert navigateToPageAndPerform parameters array to a Zod object schema
Replace eslint and prettier with oxlint and oxfmt for faster linting
and formatting across the monorepo. Remove all eslint and prettier
configs, dependencies, and related packages. Add .oxlintrc.json and
.oxfmtrc.json for the new tooling. Update CI workflows and lefthook
hooks accordingly. Reformat codebase with oxfmt.
https://claude.ai/code/session_01GMkSf29p78HuMR1mbXn8He
Run prettier on ~1,865 files across examples/ to match the monorepo's
formatting standards. These files were imported as-is from standalone
repos that used different prettier configs.