@peers-app/peers-ui 0.22.0 → 0.23.0

package/dist/components/access-level-field.d.ts

@@ -0,0 +1,10 @@
+import { type Observable } from "@peers-app/peers-sdk";
+interface AccessLevelFieldProps {
+    value: number | Observable<number | undefined>;
+    disabled?: boolean;
+}
+/**
+ * Named-preset plus custom 0–100 editor for tool and Assistant access levels.
+ */
+export declare function AccessLevelField(props: AccessLevelFieldProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/access-level-field.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccessLevelField = AccessLevelField;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const hooks_1 = require("../hooks");
+const input_1 = require("./input");
+/**
+ * Named-preset plus custom 0–100 editor for tool and Assistant access levels.
+ */
+function AccessLevelField(props) {
+    const [value, setValue] = (0, hooks_1.useObservable)(props.value);
+    const level = (0, peers_sdk_1.resolveAccessLevel)(value);
+    const presets = (0, peers_sdk_1.listAccessLevelPresets)();
+    const isNamed = presets.some((preset) => preset.value === level);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("small", { children: "Access level:" }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex gap-2 align-items-center", children: [(0, jsx_runtime_1.jsxs)("select", { className: "form-select form-select-sm", disabled: props.disabled, value: isNamed ? String(level) : "custom", onChange: (evt) => {
+                            if (evt.target.value === "custom") {
+                                setValue(level);
+                                return;
+                            }
+                            setValue(Number(evt.target.value));
+                        }, children: [presets.map((preset) => ((0, jsx_runtime_1.jsxs)("option", { value: preset.value, children: [preset.label, " (", preset.value, ")"] }, preset.value))), (0, jsx_runtime_1.jsx)("option", { value: "custom", children: "Custom" })] }), (0, jsx_runtime_1.jsx)(input_1.Input, { type: "number", min: 0, max: 100, disabled: props.disabled, className: "form-control form-control-sm", style: { maxWidth: 90 }, value: level, onChange: (evt) => {
+                            const next = Number(evt.target.value);
+                            if (Number.isInteger(next) && next >= 0 && next <= 100) {
+                                setValue(next);
+                            }
+                        } })] }), (0, jsx_runtime_1.jsxs)("div", { className: "form-text", children: [(0, peers_sdk_1.getAccessLevelLabel)(level), " (", level, "). Unclassified records default to Self (100)."] })] }));
+}

package/dist/components/access-level-field.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/access-level-field.test.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("@testing-library/react");
+const access_level_field_1 = require("./access-level-field");
+describe("AccessLevelField", () => {
+    it("shows the named preset and current label", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(access_level_field_1.AccessLevelField, { value: (0, peers_sdk_1.observable)(40) }));
+        expect(react_1.screen.getByRole("combobox")).toHaveValue("40");
+        expect(react_1.screen.getByText(/Unclassified records default to Self/)).toHaveTextContent("Writer (40)");
+    });
+    it("writes a named preset onto the observable", () => {
+        const value = (0, peers_sdk_1.observable)(40);
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(access_level_field_1.AccessLevelField, { value: value }));
+        react_1.fireEvent.change(react_1.screen.getByRole("combobox"), { target: { value: "60" } });
+        expect(value()).toBe(60);
+        expect(react_1.screen.getByText(/Unclassified records default to Self/)).toHaveTextContent("Admin (60)");
+    });
+    it("edits a custom integer between named tiers", () => {
+        const value = (0, peers_sdk_1.observable)(45);
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(access_level_field_1.AccessLevelField, { value: value }));
+        expect(react_1.screen.getByRole("combobox")).toHaveValue("custom");
+        react_1.fireEvent.change(react_1.screen.getByRole("spinbutton"), { target: { value: "47" } });
+        expect(value()).toBe(47);
+        expect(react_1.screen.getByText(/Writer\+ \(47\)/)).toBeInTheDocument();
+    });
+});

package/dist/components/message-logs/message-logs.d.ts

@@ -1,5 +1,6 @@
 interface MessageLogsProps {
     messageId: string;
 }
-export declare const MessageLogs: ({ messageId }: MessageLogsProps) => false | import("react/jsx-runtime").JSX.Element;
+/** Workflow logs and tool-access approval cards for a thread message. */
+export declare const MessageLogs: ({ messageId }: MessageLogsProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/message-logs/message-logs.js

@@ -11,6 +11,8 @@ const moment_1 = __importDefault(require("moment"));
 const react_1 = require("react");
 const hooks_1 = require("../../hooks");
 const markdown_with_mentions_1 = require("../markdown-with-mentions");
+const tool_access_approval_card_1 = require("./tool-access-approval-card");
+/** Workflow logs and tool-access approval cards for a thread message. */
 const MessageLogs = ({ messageId }) => {
     const workflowRunIds = (0, hooks_1.useObservableState)([]);
     const showLogs = (0, hooks_1.useObservableState)(false);
@@ -92,11 +94,51 @@ const MessageLogs = ({ messageId }) => {
         };
     }, [messageId, workflowRunIds]);
     if (!workflowRunIds().length) {
-        return false;
+        return (0, jsx_runtime_1.jsx)(ThreadAccessApprovals, { messageId: messageId });
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u00A0", (0, jsx_runtime_1.jsx)(ShowLogsLink, { logIds: logIds, showLogs: showLogs, runs: runs }), showLogs() && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(AllMessageLogs, { logIds: logIds, runs: runs }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u00A0", (0, jsx_runtime_1.jsx)(ShowLogsLink, { logIds: logIds, showLogs: showLogs, runs: runs }), (0, jsx_runtime_1.jsx)(ThreadAccessApprovals, { messageId: messageId }), showLogs() && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(AllMessageLogs, { logIds: logIds, runs: runs }) }))] }));
 };
 exports.MessageLogs = MessageLogs;
+const ThreadAccessApprovals = ({ messageId }) => {
+    const [approvals] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)([]));
+    (0, hooks_1.useObservable)(approvals);
+    (0, react_1.useEffect)(() => {
+        let disposed = false;
+        let unsubscribe;
+        function setRows(rows) {
+            approvals(rows.sort((a, b) => a.createdAt.getTime() - b.createdAt.getTime()));
+        }
+        async function subscribeToContext() {
+            const userContext = await (0, peers_sdk_1.getUserContext)();
+            if (disposed)
+                return;
+            const dataContext = userContext.defaultDataContext();
+            const approvalsTable = (0, peers_sdk_1.ToolAccessApprovals)(dataContext);
+            const sub = approvalsTable.dataChanged.subscribe((evt) => {
+                const row = evt.dataObject;
+                if (disposed || row.threadMessageId !== messageId)
+                    return;
+                const next = approvals().filter((item) => item.toolAccessApprovalId !== row.toolAccessApprovalId);
+                if (evt.op !== "delete")
+                    next.push(row);
+                setRows(next);
+            });
+            unsubscribe = () => sub.unsubscribe();
+            const rows = await approvalsTable.list({ threadMessageId: messageId });
+            if (!disposed)
+                setRows(rows);
+        }
+        void subscribeToContext();
+        return () => {
+            disposed = true;
+            unsubscribe?.();
+        };
+    }, [messageId, approvals]);
+    if (!approvals().length) {
+        return false;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { children: approvals().map((approval) => ((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: approval }, approval.toolAccessApprovalId))) }));
+};
 const ShowLogsLink = (props) => {
     const { showLogs, logIds, runs } = props;
     (0, hooks_1.useObservable)(logIds);

package/dist/components/message-logs/tool-access-approval-card.d.ts

@@ -0,0 +1,13 @@
+import { type IToolAccessApproval } from "@peers-app/peers-sdk";
+/** Props for {@link ToolAccessApprovalCard}. */
+export interface ToolAccessApprovalCardProps {
+    /** Approval or grant row to render. */
+    approval: IToolAccessApproval;
+}
+/**
+ * Inline thread card for a pending or decided tool-access approval.
+ *
+ * Uses Bootstrap theme tokens (`bg-body-*`, `text-body-*`) so the card follows
+ * light and dark `data-bs-theme` instead of a hardcoded `bg-light` panel.
+ */
+export declare function ToolAccessApprovalCard(props: ToolAccessApprovalCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/message-logs/tool-access-approval-card.js

@@ -0,0 +1,81 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToolAccessApprovalCard = ToolAccessApprovalCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("react");
+const hooks_1 = require("../../hooks");
+const tool_access_ipc_1 = require("../../screens/tools/tool-access-ipc");
+const GRANT_TTL_MINUTES = peers_sdk_1.TOOL_ACCESS_GRANT_TTL_MS / (60 * 1000);
+/**
+ * Inline thread card for a pending or decided tool-access approval.
+ *
+ * Uses Bootstrap theme tokens (`bg-body-*`, `text-body-*`) so the card follows
+ * light and dark `data-bs-theme` instead of a hardcoded `bg-light` panel.
+ */
+function ToolAccessApprovalCard(props) {
+    const { approval } = props;
+    const [busy, setBusy] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)();
+    const userLevel = (0, hooks_1.usePromise)(async () => {
+        const userContext = await (0, peers_sdk_1.getUserContext)();
+        return (0, peers_sdk_1.getCurrentUserAccessLevel)(userContext.getDataContext(approval.dataContextId));
+    }, (0, peers_sdk_1.recordAccessLevel)({ accessLevel: 100 }), [approval.dataContextId]);
+    const required = approval.requiredAccessLevel;
+    const current = userLevel ?? 100;
+    const pending = approval.status === peers_sdk_1.ToolAccessApprovalStatus.pending;
+    const expired = approval.expiresAt.getTime() <= Date.now();
+    const argsPreview = meaningfulArgsPreview(approval.argsPreview);
+    const statusStyle = statusAppearance(approval.status, expired);
+    async function decide(scope, reject = false) {
+        setBusy(true);
+        setError(undefined);
+        try {
+            const consumer = await (0, tool_access_ipc_1.getToolAccessControlConsumer)(approval.dataContextId);
+            if (reject) {
+                await consumer.tools.reject({
+                    approvalId: approval.toolAccessApprovalId,
+                    nonce: approval.nonce,
+                });
+            }
+            else {
+                await consumer.tools.approve({
+                    approvalId: approval.toolAccessApprovalId,
+                    nonce: approval.nonce,
+                    scope,
+                });
+            }
+        }
+        catch (err) {
+            setError(String(err));
+        }
+        finally {
+            setBusy(false);
+        }
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { className: "card my-2 bg-body-secondary border-secondary-subtle", "data-testid": "tool-access-approval-card", children: (0, jsx_runtime_1.jsx)("div", { className: "card-body py-2 px-3", children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-start gap-2", children: [(0, jsx_runtime_1.jsx)("i", { className: `bi ${statusStyle.icon} ${statusStyle.iconClass} mt-1`, "aria-hidden": "true" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-grow-1 min-w-0", children: [(0, jsx_runtime_1.jsx)("div", { className: "fw-semibold text-body", children: pending ? "Approval required" : `Access ${approval.status}` }), (0, jsx_runtime_1.jsxs)("div", { className: "small text-body", children: [(0, jsx_runtime_1.jsx)("code", { className: "text-body", children: approval.toolName }), " needs", " ", (0, peers_sdk_1.getAccessLevelLabel)(required), " (", required, "). You have ", (0, peers_sdk_1.getAccessLevelLabel)(current), " ", "(", current, ")."] }), argsPreview && ((0, jsx_runtime_1.jsx)("pre", { className: "small mb-2 mt-2 p-2 bg-body-tertiary border rounded text-body", style: { whiteSpace: "pre-wrap" }, children: argsPreview })), (0, jsx_runtime_1.jsxs)("div", { className: "text-body-secondary small mt-1", children: ["Expires ", approval.expiresAt.toLocaleTimeString(), expired ? " (expired)" : ""] }), approval.resultSummary && ((0, jsx_runtime_1.jsx)("div", { className: "small text-body mt-1", children: approval.resultSummary })), error && (0, jsx_runtime_1.jsx)("div", { className: "text-danger small mt-1", children: error }), pending && !expired && ((0, jsx_runtime_1.jsxs)("div", { className: "d-flex flex-wrap gap-1 mt-2", children: [(0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-primary", disabled: busy, onClick: () => decide("once"), children: "Allow once" }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-sm btn-outline-secondary", disabled: busy, onClick: () => decide("thread"), children: ["Allow in thread (", GRANT_TTL_MINUTES, " min)"] }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-sm btn-outline-secondary", disabled: busy, onClick: () => decide("context"), children: ["Allow in this context (", GRANT_TTL_MINUTES, " min)"] }), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-danger", disabled: busy, onClick: () => decide(undefined, true), children: "Deny" })] }))] })] }) }) }));
+}
+function meaningfulArgsPreview(preview) {
+    const trimmed = preview?.trim();
+    if (!trimmed || trimmed === "{}" || trimmed === "[]") {
+        return undefined;
+    }
+    return trimmed;
+}
+function statusAppearance(status, expired) {
+    if (status === peers_sdk_1.ToolAccessApprovalStatus.pending && expired) {
+        return { icon: "bi-shield-x", iconClass: "text-body-secondary" };
+    }
+    switch (status) {
+        case peers_sdk_1.ToolAccessApprovalStatus.pending:
+            return { icon: "bi-shield-lock", iconClass: "text-warning" };
+        case peers_sdk_1.ToolAccessApprovalStatus.approved:
+        case peers_sdk_1.ToolAccessApprovalStatus.executed:
+            return { icon: "bi-shield-check", iconClass: "text-success" };
+        case peers_sdk_1.ToolAccessApprovalStatus.rejected:
+        case peers_sdk_1.ToolAccessApprovalStatus.failed:
+            return { icon: "bi-shield-x", iconClass: "text-danger" };
+        default:
+            return { icon: "bi-shield", iconClass: "text-body-secondary" };
+    }
+}

package/dist/components/message-logs/tool-access-approval-card.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/message-logs/tool-access-approval-card.test.js

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("@testing-library/react");
+const tool_access_approval_card_1 = require("./tool-access-approval-card");
+const approve = jest.fn(async () => ({ result: { status: "executed" } }));
+const reject = jest.fn(async () => ({ result: { status: "rejected" } }));
+const getDataContext = jest.fn((dataContextId) => ({ dataContextId }));
+const getToolAccessControlConsumer = jest.fn(async (_dataContextId) => ({
+    tools: { approve, reject },
+}));
+jest.mock("../../screens/tools/tool-access-ipc", () => ({
+    getToolAccessControlConsumer: (dataContextId) => getToolAccessControlConsumer(dataContextId),
+}));
+jest.mock("@peers-app/peers-sdk", () => {
+    const actual = jest.requireActual("@peers-app/peers-sdk");
+    return {
+        ...actual,
+        getUserContext: async () => ({
+            getDataContext,
+        }),
+        getCurrentUserAccessLevel: async () => actual.AccessLevel.Self,
+    };
+});
+const pending = {
+    toolAccessApprovalId: "00testapproval0000000001",
+    userId: "00testuser000000000000001",
+    assistantId: "00testassistant000000001",
+    toolId: "00testtooladmin00000000",
+    toolName: "queryDatabase",
+    dataContextId: "00testdatacontext00000001",
+    argsHash: "hash",
+    argsPreview: '{"sql":"select 1"}',
+    frozenArgs: { sql: "select 1" },
+    requiredAccessLevel: peers_sdk_1.AccessLevel.Owner,
+    scope: peers_sdk_1.ToolAccessApprovalScope.once,
+    status: peers_sdk_1.ToolAccessApprovalStatus.pending,
+    nonce: "nonce-from-table",
+    expiresAt: new Date(Date.now() + 60_000),
+    createdAt: new Date(),
+};
+describe("ToolAccessApprovalCard", () => {
+    beforeEach(() => {
+        approve.mockClear();
+        reject.mockClear();
+        getDataContext.mockClear();
+        getToolAccessControlConsumer.mockClear();
+    });
+    it("renders a pending card with actions", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: pending }));
+        expect(react_1.screen.getByText("Approval required")).toBeInTheDocument();
+        expect(react_1.screen.getByText("queryDatabase")).toBeInTheDocument();
+        expect(react_1.screen.getByText(/Owner \(80\)/)).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: "Allow once" })).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: "Allow in thread (15 min)" })).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: "Allow in this context (15 min)" })).toBeInTheDocument();
+        expect(react_1.screen.getByRole("button", { name: "Deny" })).toBeInTheDocument();
+    });
+    it("evaluates the user role in the approval context", async () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: pending }));
+        await (0, react_1.waitFor)(() => {
+            expect(getDataContext).toHaveBeenCalledWith(pending.dataContextId);
+        });
+    });
+    it("approves once using the table nonce", async () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: pending }));
+        react_1.fireEvent.click(react_1.screen.getByRole("button", { name: "Allow once" }));
+        await (0, react_1.waitFor)(() => {
+            expect(getToolAccessControlConsumer).toHaveBeenCalledWith(pending.dataContextId);
+            expect(approve).toHaveBeenCalledWith({
+                approvalId: pending.toolAccessApprovalId,
+                nonce: "nonce-from-table",
+                scope: "once",
+            });
+        });
+    });
+    it("denies using the table nonce", async () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: pending }));
+        react_1.fireEvent.click(react_1.screen.getByRole("button", { name: "Deny" }));
+        await (0, react_1.waitFor)(() => {
+            expect(reject).toHaveBeenCalledWith({
+                approvalId: pending.toolAccessApprovalId,
+                nonce: "nonce-from-table",
+            });
+        });
+    });
+    it("hides empty argument previews", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: { ...pending, argsPreview: "{}", frozenArgs: {} } }));
+        expect(react_1.screen.queryByText("{}")).not.toBeInTheDocument();
+    });
+    it("shows a decided card without actions", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(tool_access_approval_card_1.ToolAccessApprovalCard, { approval: {
+                ...pending,
+                status: peers_sdk_1.ToolAccessApprovalStatus.rejected,
+                resultSummary: "Rejected by user",
+            } }));
+        expect(react_1.screen.getByText("Access rejected")).toBeInTheDocument();
+        expect(react_1.screen.getByText("Rejected by user")).toBeInTheDocument();
+        expect(react_1.screen.queryByRole("button", { name: "Allow once" })).not.toBeInTheDocument();
+    });
+});

package/dist/screens/assistants/assistant-info.d.ts

@@ -6,5 +6,6 @@ interface AssistantInfoProps {
     onSetPrimary: (checked: boolean) => void;
     onSetGroupPrimary: (checked: boolean) => void;
 }
+/** Info tab for an Assistant, including its access-level policy. */
 export declare const AssistantInfo: (props: AssistantInfoProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/screens/assistants/assistant-info.js

@@ -2,10 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AssistantInfo = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const access_level_field_1 = require("../../components/access-level-field");
 const input_1 = require("../../components/input");
 const editor_inline_1 = require("../../components/markdown-editor/editor-inline");
+/** Info tab for an Assistant, including its access-level policy. */
 const AssistantInfo = (props) => {
     const { assistant, isPrimaryAssistant, isGroupPrimaryAssistant, onSetPrimary, onSetGroupPrimary, } = props;
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("small", { children: "Name:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: assistant.qs.name, className: "form-control mb-3 p-0 ps-2", placeholder: "Tool name", title: "Tool name" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "isPrimary", className: "form-label small mt-2 me-2", children: "My Default Assistant:" }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", id: "isPrimary", checked: isPrimaryAssistant, onChange: (e) => onSetPrimary(e.target.checked) })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "isGroupPrimary", className: "form-label small mt-2 me-2", children: "Group Default Assistant:" }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", id: "isGroupPrimary", checked: isGroupPrimaryAssistant, onChange: (e) => onSetGroupPrimary(e.target.checked) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("small", { children: "Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: assistant.qs.description })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("small", { children: "Name:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: assistant.qs.name, className: "form-control mb-3 p-0 ps-2", placeholder: "Tool name", title: "Tool name" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "isPrimary", className: "form-label small mt-2 me-2", children: "My Default Assistant:" }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", id: "isPrimary", checked: isPrimaryAssistant, onChange: (e) => onSetPrimary(e.target.checked) })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "isGroupPrimary", className: "form-label small mt-2 me-2", children: "Group Default Assistant:" }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", id: "isGroupPrimary", checked: isGroupPrimaryAssistant, onChange: (e) => onSetGroupPrimary(e.target.checked) })] }), (0, jsx_runtime_1.jsx)(access_level_field_1.AccessLevelField, { value: assistant.qs.accessLevel }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("small", { children: "Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: assistant.qs.description })] })] }));
 };
 exports.AssistantInfo = AssistantInfo;

package/dist/screens/assistants/assistant-list.d.ts

@@ -1 +1,2 @@
+/** Searchable Assistant list with access-level visibility. */
 export declare const AssistantList: () => import("react/jsx-runtime").JSX.Element;

package/dist/screens/assistants/assistant-list.js

@@ -10,11 +10,16 @@ const loading_indicator_1 = require("../../components/loading-indicator");
 const markdown_with_mentions_1 = require("../../components/markdown-with-mentions");
 const globals_1 = require("../../globals");
 const hooks_1 = require("../../hooks");
+/** Searchable Assistant list with access-level visibility. */
 const AssistantList = () => {
     const [searchTextObs] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)(""));
     const [searchText] = (0, hooks_1.useObservable)(searchTextObs);
     const [cursorObs] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)());
     const [cursorId] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)((0, peers_sdk_1.newid)()));
+    const userLevel = (0, hooks_1.usePromise)(async () => {
+        const userContext = await (0, peers_sdk_1.getUserContext)();
+        return (0, peers_sdk_1.getCurrentUserAccessLevel)(userContext.defaultDataContext());
+    }, 100);
     async function newCursor() {
         let cursor;
         const _searchText = searchText.trim();
@@ -66,7 +71,9 @@ const AssistantList = () => {
     }
     return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid", children: [(0, jsx_runtime_1.jsx)(input_1.Input, { value: searchTextObs, className: "form-control", style: { marginBottom: "10px" }, placeholder: "Search or create new assistant", autoFocus: !!(0, globals_1.isDesktop)(), onKeyUp: (evt) => searchSubmit(evt) }), (0, jsx_runtime_1.jsx)("div", { className: "peers-list-container", children: (0, jsx_runtime_1.jsx)(lazy_list_1.LazyList, { loadMore: loadMore, scrollThreshold: 0.6, renderItems: (assistants) => {
                         return assistants.map((assistant) => {
-                            return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid pb-4", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-fill-gear" }), "\u00A0", (0, jsx_runtime_1.jsx)("a", { href: `#assistants/${assistant.assistantId}`, children: assistant.name }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: "20px" }, children: (0, jsx_runtime_1.jsx)(markdown_with_mentions_1.MarkdownWithMentions, { content: assistant.description ?? "" }) })] }, assistant.assistantId));
+                            const required = (0, peers_sdk_1.recordAccessLevel)(assistant);
+                            const allowed = (0, peers_sdk_1.canInvokeAssistant)(userLevel ?? 100, required);
+                            return ((0, jsx_runtime_1.jsxs)("div", { className: "container-fluid pb-4", style: allowed ? undefined : { opacity: 0.65 }, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-fill-gear" }), "\u00A0", (0, jsx_runtime_1.jsx)("a", { href: `#assistants/${assistant.assistantId}`, children: assistant.name }), !allowed && ((0, jsx_runtime_1.jsxs)("span", { className: "badge text-bg-secondary ms-2", children: ["Requires ", (0, peers_sdk_1.getAccessLevelLabel)(required), " (", required, ")"] })), (0, jsx_runtime_1.jsxs)("div", { style: { paddingLeft: "20px" }, children: [(0, jsx_runtime_1.jsx)(markdown_with_mentions_1.MarkdownWithMentions, { content: assistant.description ?? "" }), !allowed && ((0, jsx_runtime_1.jsxs)("div", { className: "small text-muted", children: ["You cannot invoke this Assistant with your current access (", (0, peers_sdk_1.getAccessLevelLabel)(userLevel ?? 100), ")."] }))] })] }, assistant.assistantId));
                         });
                     }, loadingIndicator: (0, jsx_runtime_1.jsx)("div", { className: "d-flex justify-content-center", style: { height: 200 }, children: (0, jsx_runtime_1.jsx)(loading_indicator_1.LoadingIndicator, {}) }), endOfList: (0, jsx_runtime_1.jsx)("div", { className: "d-flex justify-content-center", style: { height: 200 } }) }, cursorId()) })] }));
 };

package/dist/screens/tools/tool-access-ipc.d.ts

@@ -0,0 +1,5 @@
+import { type IToolAccessControlConsumer } from "@peers-app/peers-sdk";
+/**
+ * Return a typed local-host consumer for Tool Access Control in `dataContextId`.
+ */
+export declare function getToolAccessControlConsumer(dataContextId: string): Promise<IToolAccessControlConsumer>;

package/dist/screens/tools/tool-access-ipc.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getToolAccessControlConsumer = getToolAccessControlConsumer;
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const HOST_TRANSPORT_TIMEOUT_MS = 10_000;
+const cachedByContext = new Map();
+const pendingByContext = new Map();
+function disposeCachedConsumers() {
+    for (const cached of cachedByContext.values()) {
+        cached.consumer.dispose();
+    }
+    cachedByContext.clear();
+}
+(0, peers_sdk_1.subscribeHostContractTransport)((transport) => {
+    if ([...cachedByContext.values()].some((cached) => cached.transport !== transport)) {
+        disposeCachedConsumers();
+        pendingByContext.clear();
+    }
+}, { emitCurrent: false });
+async function loadConsumer(transport, dataContextId) {
+    cachedByContext.get(dataContextId)?.consumer.dispose();
+    cachedByContext.delete(dataContextId);
+    const consumer = (0, peers_sdk_1.createContractConsumer)((0, peers_sdk_1.getToolAccessControlContractDefinition)(), transport, {
+        dataContextId,
+    });
+    try {
+        await consumer.loadingPromise;
+        if ((0, peers_sdk_1.getHostContractTransport)() !== transport) {
+            consumer.dispose();
+            pendingByContext.delete(dataContextId);
+            return getToolAccessControlConsumer(dataContextId);
+        }
+        cachedByContext.set(dataContextId, { transport, consumer });
+        return consumer;
+    }
+    catch (error) {
+        consumer.dispose();
+        throw error;
+    }
+}
+/**
+ * Return a typed local-host consumer for Tool Access Control in `dataContextId`.
+ */
+async function getToolAccessControlConsumer(dataContextId) {
+    const transport = (0, peers_sdk_1.getHostContractTransport)() ??
+        (await (0, peers_sdk_1.waitForHostContractTransport)({ timeoutMs: HOST_TRANSPORT_TIMEOUT_MS }));
+    const cached = cachedByContext.get(dataContextId);
+    if (cached?.transport === transport) {
+        return cached.consumer;
+    }
+    const pending = pendingByContext.get(dataContextId);
+    if (pending) {
+        return pending;
+    }
+    const loadPromise = loadConsumer(transport, dataContextId);
+    pendingByContext.set(dataContextId, loadPromise);
+    try {
+        return await loadPromise;
+    }
+    finally {
+        if (pendingByContext.get(dataContextId) === loadPromise) {
+            pendingByContext.delete(dataContextId);
+        }
+    }
+}

package/dist/screens/tools/tool-access-ipc.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/screens/tools/tool-access-ipc.test.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const tool_access_ipc_1 = require("./tool-access-ipc");
+function setupHost() {
+    const calls = [];
+    const [consumerTransport, providerTransport] = (0, peers_sdk_1.inProcessTransportPair)();
+    providerTransport.on(peers_sdk_1.CONTRACT_REQUEST_CHANNEL, (call) => {
+        calls.push(call);
+        if (call.member === "tool" && call.name === "approve") {
+            return { result: { status: "executed" } };
+        }
+        return undefined;
+    });
+    return {
+        calls,
+        dispose: (0, peers_sdk_1.registerHostContractTransport)(consumerTransport),
+    };
+}
+describe("Tool Access Control host consumers", () => {
+    it("caches per context and scopes calls to the requested context", async () => {
+        const host = setupHost();
+        const groupContextId = (0, peers_sdk_1.newid)();
+        const personalContextId = (0, peers_sdk_1.newid)();
+        const groupConsumer = await (0, tool_access_ipc_1.getToolAccessControlConsumer)(groupContextId);
+        expect(await (0, tool_access_ipc_1.getToolAccessControlConsumer)(groupContextId)).toBe(groupConsumer);
+        expect(await (0, tool_access_ipc_1.getToolAccessControlConsumer)(personalContextId)).not.toBe(groupConsumer);
+        await groupConsumer.tools.approve({
+            approvalId: (0, peers_sdk_1.newid)(),
+            nonce: (0, peers_sdk_1.newid)(),
+            scope: "once",
+        });
+        expect(host.calls).toContainEqual(expect.objectContaining({
+            dataContextId: groupContextId,
+            member: "tool",
+            name: "approve",
+        }));
+        host.dispose();
+    });
+});

package/dist/screens/tools/tool-info.d.ts

@@ -1,4 +1,5 @@
 import { type IDoc, type ITool } from "@peers-app/peers-sdk";
+/** Info tab for a tool, including its required access level. */
 export declare const ToolInfo: (props: {
     tool: IDoc<ITool>;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/screens/tools/tool-info.js

@@ -4,9 +4,11 @@ exports.ToolInfo = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 const react_1 = require("react");
+const access_level_field_1 = require("../../components/access-level-field");
 const checkbox_1 = require("../../components/checkbox");
 const input_1 = require("../../components/input");
 const editor_inline_1 = require("../../components/markdown-editor/editor-inline");
+/** Info tab for a tool, including its required access level. */
 const ToolInfo = (props) => {
     const { tool } = props;
     const [markdownUsageObs] = (0, react_1.useState)(() => (0, peers_sdk_1.observable)(tool.usageDescription));
@@ -30,6 +32,6 @@ const ToolInfo = (props) => {
             sub3.dispose();
         };
     }, [tool, markdownDetailedObs, markdownUsageObs]);
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("small", { children: "Name:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: tool.qs.name, className: "form-control mb-3 p-0 ps-2", placeholder: "Tool name", title: "Tool name" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small mt-2 me-2", children: "Is Assistant Runner:" }), (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: "form-check-input mt-2", checked: tool.qs.isAssistantRunner })] }), (0, jsx_runtime_1.jsx)("small", { children: "Usage Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: markdownUsageObs }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("small", { children: "Detailed Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: markdownDetailedObs })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("small", { children: "Name:" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: tool.qs.name, className: "form-control mb-3 p-0 ps-2", placeholder: "Tool name", title: "Tool name" }), (0, jsx_runtime_1.jsx)(access_level_field_1.AccessLevelField, { value: tool.qs.accessLevel }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "form-label small mt-2 me-2", children: "Is Assistant Runner:" }), (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: "form-check-input mt-2", checked: tool.qs.isAssistantRunner })] }), (0, jsx_runtime_1.jsx)("small", { children: "Usage Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: markdownUsageObs }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("small", { children: "Detailed Description:" }), (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: markdownDetailedObs })] }));
 };
 exports.ToolInfo = ToolInfo;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@peers-app/peers-ui",
-  "version": "0.22.0",
+  "version": "0.23.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/peers-app/peers-ui.git"
@@ -28,7 +28,7 @@
     "lint:fix": "biome check --write ."
   },
   "peerDependencies": {
-    "@peers-app/peers-sdk": "^0.22.0",
+    "@peers-app/peers-sdk": "^0.23.0",
     "bootstrap": "^5.3.3",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
@@ -39,7 +39,7 @@
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.27.1",
     "@biomejs/biome": "2.3.11",
-    "@peers-app/peers-sdk": "0.22.0",
+    "@peers-app/peers-sdk": "0.23.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",

package/src/components/access-level-field.test.tsx

@@ -0,0 +1,32 @@
+import { observable } from "@peers-app/peers-sdk";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { AccessLevelField } from "./access-level-field";
+
+describe("AccessLevelField", () => {
+  it("shows the named preset and current label", () => {
+    render(<AccessLevelField value={observable(40)} />);
+    expect(screen.getByRole("combobox")).toHaveValue("40");
+    expect(screen.getByText(/Unclassified records default to Self/)).toHaveTextContent(
+      "Writer (40)",
+    );
+  });
+
+  it("writes a named preset onto the observable", () => {
+    const value = observable(40);
+    render(<AccessLevelField value={value} />);
+    fireEvent.change(screen.getByRole("combobox"), { target: { value: "60" } });
+    expect(value()).toBe(60);
+    expect(screen.getByText(/Unclassified records default to Self/)).toHaveTextContent(
+      "Admin (60)",
+    );
+  });
+
+  it("edits a custom integer between named tiers", () => {
+    const value = observable(45);
+    render(<AccessLevelField value={value} />);
+    expect(screen.getByRole("combobox")).toHaveValue("custom");
+    fireEvent.change(screen.getByRole("spinbutton"), { target: { value: "47" } });
+    expect(value()).toBe(47);
+    expect(screen.getByText(/Writer\+ \(47\)/)).toBeInTheDocument();
+  });
+});