no idea how this works
This commit is contained in:
@@ -1,17 +1,26 @@
|
||||
import { usePluginData } from "@paperclipai/plugin-sdk/ui";
|
||||
import type { PluginSidebarProps } from "@paperclipai/plugin-sdk/ui";
|
||||
import { SIDEBAR_PREVIEW_LIMIT, type PermissionKey } from "../constants";
|
||||
|
||||
interface AgentPermissionsSummary {
|
||||
agentId: string;
|
||||
agentName: string;
|
||||
permissions: Record<string, boolean>;
|
||||
permissions: Record<PermissionKey, boolean>;
|
||||
}
|
||||
|
||||
export function PermissionsNav({ context }: PluginSidebarProps) {
|
||||
export function PermissionsNav(_props: PluginSidebarProps) {
|
||||
const { data: agentsData, loading, error } = usePluginData<AgentPermissionsSummary[]>("all-agents-permissions");
|
||||
|
||||
if (loading) return <div style={{ padding: "1rem" }}>Loading...</div>;
|
||||
if (error) return <div style={{ padding: "1rem", color: "#c00" }}>Error: {error.message}</div>;
|
||||
if (loading) return (
|
||||
<div role="status" style={{ padding: "1rem" }}>
|
||||
Loading permissions...
|
||||
</div>
|
||||
);
|
||||
if (error) return (
|
||||
<div role="alert" style={{ padding: "1rem", color: "#c00" }}>
|
||||
<strong>Error:</strong> {error.message}
|
||||
</div>
|
||||
);
|
||||
if (!agentsData || agentsData.length === 0) {
|
||||
return (
|
||||
<div style={{ padding: "1rem" }}>
|
||||
@@ -27,28 +36,31 @@ export function PermissionsNav({ context }: PluginSidebarProps) {
|
||||
|
||||
return (
|
||||
<div style={{ padding: "1rem" }}>
|
||||
<h3 style={{ fontSize: "1rem", fontWeight: 600, marginBottom: "0.75rem" }}>Permissions</h3>
|
||||
<p style={{ color: "#666", fontSize: "0.75rem", marginBottom: "1rem" }}>
|
||||
<h3 id="permissions-nav-heading" style={{ fontSize: "1rem", fontWeight: 600, marginBottom: "0.75rem" }}>Permissions</h3>
|
||||
<p aria-labelledby="permissions-nav-heading" style={{ color: "#666", fontSize: "0.75rem", marginBottom: "1rem" }}>
|
||||
{agentsWithPermissions.length} agent(s) with custom permissions
|
||||
</p>
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: "0.5rem" }}>
|
||||
{agentsData.slice(0, 5).map(agent => {
|
||||
<ul style={{ display: "flex", flexDirection: "column", gap: "0.5rem", padding: 0, margin: 0, listStyle: "none" }}>
|
||||
{agentsData.slice(0, SIDEBAR_PREVIEW_LIMIT).map(agent => {
|
||||
const permCount = Object.values(agent.permissions).filter(Boolean).length;
|
||||
return (
|
||||
<div key={agent.agentId} style={{
|
||||
fontSize: "0.875rem",
|
||||
padding: "0.5rem",
|
||||
backgroundColor: "#f9f9f9",
|
||||
borderRadius: "4px"
|
||||
}}>
|
||||
<li
|
||||
key={agent.agentId}
|
||||
style={{
|
||||
fontSize: "0.875rem",
|
||||
padding: "0.5rem",
|
||||
backgroundColor: "#f9f9f9",
|
||||
borderRadius: "4px"
|
||||
}}
|
||||
>
|
||||
<div style={{ fontWeight: 500 }}>{agent.agentName}</div>
|
||||
<div style={{ color: "#888", fontSize: "0.75rem" }}>
|
||||
{permCount} permission(s) granted
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user