Files
PaperClipAI/ui/src/pages/tools/profiles/profile-model.test.ts
T
DottaandPaperclip a116713b9a feat(mcp) [split 6/8]: add Tools and Profiles UI foundation (#9561)
## Thinking Path

> - Paperclip is the open source app people use to manage AI agents for
work
> - Governed MCP access spans contracts, runtime enforcement, adapters,
UI surfaces, and operator verification
> - The parity reference PR #9534 is too large for effective automated
or human review
> - The feature therefore needs a linear stack whose individual diffs
stay below the 100-file review limit
> - This pull request is split 6/8 and focuses on UI API, shared
components, and Tools/Profile surfaces
> - The benefit is a standalone, testable review boundary while
preserving byte-for-byte parity at the top of the stack

## Linked Issues or Issue Description

- Related parity reference: #9534
- Problem: Operators need typed clients and administration surfaces that
compile independently before navigation exposes them.
- Proposed solution: Adds UI APIs, hooks, libraries, shared components,
Tools/Profiles pages, and the plugin settings consumer required by the
new company-scoped API.
- Alternatives considered: keeping #9534 as one 403-file review, or
rewriting the feature to manufacture seams; both were rejected in favor
of path extraction plus compile-driven boundary moves.
- Roadmap alignment: this advances the existing governed MCP/tool-access
work already represented by #9534; it does not introduce a separate
roadmap initiative.
- Stack position: base branch is
`pap10341-split/05-runtime-integration`.
- Merge policy: merge bottom-up, in order, only after the complete
eight-PR stack has been reviewed and the top-of-stack parity gate
remains empty.
- Requested review: UXDesigner sanity pass on Tools/Profile surfaces;
Greptile on every PR.

## What Changed

- Adds UI APIs, hooks, libraries, shared components, Tools/Profiles
pages, and the plugin settings consumer required by the new
company-scoped API.
- Keeps this PR below 100 changed files and independently typecheckable.
- Preserves the final tree from #9534 when combined with the other seven
stack levels.

## Verification

- `pnpm typecheck`
- `pnpm check:token-gates` — all gates clean
- Focused UI Vitest run with `NODE_ENV=test` — 28 files, 183 tests
passed

## Risks

- Large dead-code UI additions can drift from activation routes; PR 7
supplies the registration layer and top-level parity catches omissions.
- Stack risk: merging out of order can expose incomplete layers;
mitigate by following the documented bottom-up merge policy.
- Parity risk: later edits to an intermediate branch can drift from
#9534; mitigate by re-running the empty top-of-stack diff before merge.

> For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and
discuss it in `#dev` before opening the PR. Feature PRs that overlap
with planned core work may need to be redirected — check the roadmap
first. See `CONTRIBUTING.md`.

## Model Used

- OpenAI Codex, exact model ID `gpt-5.4`; runtime-managed context
window; medium reasoning with repository, shell, Git, GitHub CLI, and
code-execution tools enabled.

## Checklist

- [x] I have included a thinking path that traces from project context
to this change
- [x] I have specified the model used (with version and capability
details)
- [x] I have checked ROADMAP.md and confirmed this PR does not duplicate
planned core work
- [x] I have searched GitHub for duplicate or related PRs and linked
them above
- [x] I have either (a) linked existing issues with `Fixes: #` / `Closes
#` / `Refs #` OR (b) described the issue in-PR following the relevant
issue template
- [x] Internal references are omitted except the execution-plan link
explicitly required for this coordinated split stack
- [x] My branch name describes the change and contains no internal
Paperclip ticket id or instance-derived details
- [x] I have run tests locally and they pass
- [x] I have added or updated tests where applicable
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [ ] All Paperclip CI gates are green
- [ ] Greptile is 5/5 with no open P2s, recommendations, or follow-ups
- [x] I will address all Greptile and reviewer comments before
requesting merge


## Stack Coordination

- Internal execution plan:
[PAP-13874](/PAP/issues/PAP-13874#document-plan)
- Parity reference: #9534
- Stack: #9556 → #9557 → #9558 → #9559 → #9560 → #9561 → #9562 → #9563
- Merge bottom-up only after full-stack review and an empty parity diff
at #9563.


## UI Evidence

QA captured these from the live Garden MCP split stack at 1440px and
verified clean rendering:

![Profiles
index](https://raw.githubusercontent.com/paperclipai/paperclip/ac72de3ec85feb14c5ec1ed0a3d39b29baa0abff/doc/screenshots/garden-mcp-split-stack/profiles-index.png)

![Profile
wizard](https://raw.githubusercontent.com/paperclipai/paperclip/ac72de3ec85feb14c5ec1ed0a3d39b29baa0abff/doc/screenshots/garden-mcp-split-stack/profile-wizard.png)


![Policies](https://raw.githubusercontent.com/paperclipai/paperclip/ac72de3ec85feb14c5ec1ed0a3d39b29baa0abff/doc/screenshots/garden-mcp-split-stack/policies.png)

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>
2026-07-14 15:31:12 -05:00

278 lines
9.5 KiB
TypeScript

// @vitest-environment node
import { describe, expect, it } from "vitest";
import type { ToolCatalogEntry, ToolProfileEntry } from "@paperclipai/shared";
import {
appCheckState,
appSelectionLabel,
buildEntries,
countAllowedTools,
groupCatalogByApp,
parseEntries,
templateSelections,
toggleApp,
toggleTool,
type AppGroup,
} from "./profile-model";
function tool(partial: Partial<ToolCatalogEntry> & { id: string; toolName: string }): ToolCatalogEntry {
return {
companyId: "c1",
applicationId: "app-gmail",
connectionId: "conn-1",
entryKind: "tool",
title: null,
description: null,
inputSchema: null,
outputSchema: null,
annotations: null,
riskLevel: "read",
isReadOnly: true,
isWrite: false,
isDestructive: false,
status: "active",
addedAt: new Date(),
version: null,
schemaHash: null,
firstSeenAt: new Date(),
lastSeenAt: new Date(),
reviewedAt: null,
reviewedByAgentId: null,
reviewedByUserId: null,
createdAt: new Date(),
updatedAt: new Date(),
...partial,
} as ToolCatalogEntry;
}
function entry(partial: Partial<ToolProfileEntry> & Pick<ToolProfileEntry, "selectorType">): ToolProfileEntry {
return {
id: `e-${partial.selectorType}-${partial.catalogEntryId ?? partial.applicationId ?? partial.toolName ?? "x"}`,
companyId: "c1",
profileId: "p1",
effect: "include",
applicationId: null,
connectionId: null,
catalogEntryId: null,
toolName: null,
riskLevel: null,
conditions: null,
createdAt: new Date(),
updatedAt: new Date(),
...partial,
} as ToolProfileEntry;
}
const appsById = new Map([
["app-gmail", "Gmail"],
["app-slack", "Slack"],
]);
const connsById = new Map([["conn-1", "Gmail prod"]]);
// 4 Gmail tools: 2 read, 1 write, 1 destructive.
const catalog: ToolCatalogEntry[] = [
tool({ id: "g-list", toolName: "gmail.list", riskLevel: "read", isReadOnly: true }),
tool({ id: "g-read", toolName: "gmail.read", riskLevel: "read", isReadOnly: true }),
tool({ id: "g-send", toolName: "gmail.send", riskLevel: "write", isReadOnly: false, isWrite: true }),
tool({ id: "g-delete", toolName: "gmail.delete", riskLevel: "destructive", isReadOnly: false, isWrite: true, isDestructive: true }),
];
function gmail(): AppGroup {
return groupCatalogByApp(catalog, appsById, connsById)[0];
}
describe("groupCatalogByApp", () => {
it("groups by application and names from the app map", () => {
const groups = groupCatalogByApp(catalog, appsById, connsById);
expect(groups).toHaveLength(1);
expect(groups[0].name).toBe("Gmail");
expect(groups[0].tools.map((t) => t.id)).toEqual(["g-delete", "g-list", "g-read", "g-send"]);
});
});
describe("toggleApp / toggleTool", () => {
it("app checkbox flips between all and none", () => {
const g = gmail();
let sel = toggleApp(g, undefined);
expect(sel).toEqual({ kind: "all" });
expect(appCheckState(g, sel)).toBe("checked");
sel = toggleApp(g, sel);
expect(sel).toEqual({ kind: "none" });
});
it("unchecking one tool from all yields all_except with except-count math", () => {
const g = gmail();
let sel = toggleApp(g, undefined); // all
sel = toggleTool(g, sel, "g-delete");
expect(sel).toEqual({ kind: "all_except", excluded: ["g-delete"] });
expect(appSelectionLabel(g, sel)).toBe("All Gmail except 1");
expect(appCheckState(g, sel)).toBe("indeterminate");
// re-check it -> back to all
sel = toggleTool(g, sel, "g-delete");
expect(sel).toEqual({ kind: "all" });
});
it("checking tools from empty yields explicit some-selection", () => {
const g = gmail();
let sel = toggleTool(g, undefined, "g-list");
sel = toggleTool(g, sel, "g-read");
expect(sel).toEqual({ kind: "some", included: ["g-list", "g-read"] });
expect(appSelectionLabel(g, sel)).toBe("2 of 4 Gmail tools");
});
it("keeps an explicit selection when every current tool is checked", () => {
const g = gmail();
let sel: ReturnType<typeof toggleTool> | undefined;
for (const id of ["g-list", "g-read", "g-send", "g-delete"]) sel = toggleTool(g, sel, id);
expect(sel).toEqual({ kind: "some", included: ["g-delete", "g-list", "g-read", "g-send"] });
});
it("excluding every tool collapses to none", () => {
const g = gmail();
let sel: ReturnType<typeof toggleApp> = { kind: "all" };
for (const id of ["g-list", "g-read", "g-send", "g-delete"]) sel = toggleTool(g, sel, id);
expect(sel).toEqual({ kind: "none" });
});
});
describe("buildEntries", () => {
it("maps all -> application include", () => {
const g = gmail();
expect(buildEntries([g], { [g.appKey]: { kind: "all" } })).toEqual([
{ selectorType: "application", effect: "include", applicationId: "app-gmail" },
]);
});
it("maps all_except -> app include plus catalog excludes", () => {
const g = gmail();
expect(buildEntries([g], { [g.appKey]: { kind: "all_except", excluded: ["g-delete"] } })).toEqual([
{ selectorType: "application", effect: "include", applicationId: "app-gmail" },
{ selectorType: "catalog_entry", effect: "exclude", catalogEntryId: "g-delete" },
]);
});
it("maps some -> per-tool catalog includes", () => {
const g = gmail();
expect(buildEntries([g], { [g.appKey]: { kind: "some", included: ["g-list"] } })).toEqual([
{ selectorType: "catalog_entry", effect: "include", catalogEntryId: "g-list" },
]);
});
it("maps bounded allow-default selections to catalog excludes", () => {
const g = gmail();
expect(
buildEntries([g], { [g.appKey]: { kind: "some", included: ["g-list"] } }, [], "allow"),
).toEqual([
{ selectorType: "catalog_entry", effect: "exclude", catalogEntryId: "g-delete" },
{ selectorType: "catalog_entry", effect: "exclude", catalogEntryId: "g-read" },
{ selectorType: "catalog_entry", effect: "exclude", catalogEntryId: "g-send" },
]);
});
it("maps none under allow-default to exclusions for every catalog tool", () => {
const g = gmail();
expect(buildEntries([g], { [g.appKey]: { kind: "none" } }, [], "allow")).toEqual(
g.tools.map((tool) => ({
selectorType: "catalog_entry",
effect: "exclude",
catalogEntryId: tool.id,
})),
);
});
it("appends advanced rules", () => {
const g = gmail();
const out = buildEntries([g], { [g.appKey]: { kind: "none" } }, [
{ id: "r1", kind: "tool_name", value: "gmail.*", effect: "exclude" },
]);
expect(out).toEqual([{ selectorType: "tool_name", effect: "exclude", toolName: "gmail.*" }]);
});
});
describe("parseEntries round-trips buildEntries", () => {
it("round-trips all_except", () => {
const g = gmail();
const sel = { [g.appKey]: { kind: "all_except" as const, excluded: ["g-delete"] } };
const entries = buildEntries([g], sel).map((e, i) => entry({ ...e, id: `e${i}` } as never));
const parsed = parseEntries([g], entries);
expect(parsed.selections[g.appKey]).toEqual({ kind: "all_except", excluded: ["g-delete"] });
expect(parsed.advancedRules).toEqual([]);
});
it("round-trips some", () => {
const g = gmail();
const entries = buildEntries([g], { [g.appKey]: { kind: "some", included: ["g-list", "g-read"] } }).map(
(e, i) => entry({ ...e, id: `e${i}` } as never),
);
const parsed = parseEntries([g], entries);
expect(parsed.selections[g.appKey]).toEqual({ kind: "some", included: ["g-list", "g-read"] });
});
it("keeps all explicit catalog entries as a bounded selection", () => {
const g = gmail();
const entries = g.tools.map((tool, index) => entry({
id: `e${index}`,
selectorType: "catalog_entry",
catalogEntryId: tool.id,
effect: "include",
}));
const parsed = parseEntries([g], entries);
expect(parsed.selections[g.appKey]).toEqual({
kind: "some",
included: ["g-delete", "g-list", "g-read", "g-send"],
});
});
it("surfaces a wildcard rule as an advanced rule", () => {
const g = gmail();
const parsed = parseEntries([g], [entry({ selectorType: "tool_name", toolName: "gmail.*", effect: "exclude" })]);
expect(parsed.advancedRules).toEqual([
{ id: "e-tool_name-gmail.*", kind: "tool_name", value: "gmail.*", effect: "exclude" },
]);
});
});
describe("countAllowedTools", () => {
it("counts selected tools in deny mode", () => {
const g = gmail();
expect(countAllowedTools([g], { [g.appKey]: { kind: "all_except", excluded: ["g-delete"] } }, "deny", 4)).toEqual({
allowed: 3,
total: 4,
});
});
it("counts everything minus opt-outs in allow mode", () => {
const g = gmail();
expect(countAllowedTools([g], { [g.appKey]: { kind: "all_except", excluded: ["g-delete", "g-send"] } }, "allow", 4)).toEqual({
allowed: 2,
total: 4,
});
});
});
describe("templateSelections", () => {
it("read-only selects only read tools", () => {
const g = gmail();
const sel = templateSelections("read_only", [g]);
expect(sel[g.appKey]).toEqual({ kind: "some", included: ["g-list", "g-read"] });
});
it("everyday excludes destructive", () => {
const g = gmail();
const sel = templateSelections("everyday", [g]);
expect(sel[g.appKey]).toEqual({ kind: "some", included: ["g-list", "g-read", "g-send"] });
});
it("full access selects all", () => {
const g = gmail();
expect(templateSelections("full_access", [g])[g.appKey]).toEqual({ kind: "all" });
});
it("scratch selects none", () => {
const g = gmail();
expect(templateSelections("scratch", [g])[g.appKey]).toEqual({ kind: "none" });
});
});