@ploykit/ui 0.0.0-stage → 0.1.1

package/dist/pages/workspace/WebhooksPage.js

@@ -0,0 +1,242 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { MoreHorizontal, Plus } from 'lucide-react';
+import { z } from 'zod';
+import { PageHeader, PageLoading, PageError, PageEmpty, } from '../../components/Page';
+import { DataTable } from '../../components/DataTable';
+import { FormField } from '../../components/FormField';
+import { SecretModal } from '../../components/SecretModal';
+import { useConfirm } from '../../components/ConfirmDialog';
+import { toast } from '../../components/toast';
+import { Button } from '../../components/ui/Button';
+import { Input } from '../../components/ui/Input';
+import { StatusBadge } from '../../components/ui/Badge';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '../../components/ui/tabs';
+import { Switch } from '../../components/ui/switch';
+import { Checkbox } from '../../components/ui/checkbox';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, } from '../../components/ui/dialog';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from '../../components/ui/menu';
+import { useApi } from '../../hooks/useApi';
+import { useWorkspace } from '../../hooks/useWorkspace';
+import { useZodForm } from '../../hooks/useZodForm';
+import { queryKeys } from '../../provider/PloykitProvider';
+import { formatDateTime } from '../../lib/utils';
+import { apiErrorMessage } from '../../lib/api-error';
+import { roleSatisfies } from '../../lib/perm';
+const createSchema = z.object({
+    url: z
+        .string()
+        .url('请输入合法的回调 URL（如 https://example.com/webhook）')
+        .refine((v) => v.startsWith('https://'), '回调地址必须使用 https（明文 http 会被服务端拒绝）'),
+    description: z.string(),
+    events: z.array(z.string()).min(1, '至少订阅一个事件类型'),
+});
+export function WebhooksPage(_props = {}) {
+    const { current } = useWorkspace();
+    const api = useApi();
+    const confirm = useConfirm();
+    const wsId = current?.id ?? '';
+    const base = `/api/workspaces/${wsId}/webhooks`;
+    const canManage = roleSatisfies(current?.role, 'admin');
+    const [createOpen, setCreateOpen] = useState(false);
+    const [secret, setSecret] = useState(null);
+    const [secretTitle, setSecretTitle] = useState(undefined);
+    const subsQ = useQuery({
+        queryKey: [...queryKeys.webhooks(wsId), 'subscriptions'],
+        queryFn: () => api.get(`${base}/subscriptions`),
+        enabled: !!wsId,
+    });
+    const deliveriesQ = useQuery({
+        queryKey: [...queryKeys.webhooks(wsId), 'deliveries'],
+        queryFn: () => api.get(`${base}/deliveries?limit=50`),
+        enabled: !!wsId,
+        refetchInterval: 15_000,
+    });
+    const eventsQ = useQuery({
+        queryKey: [...queryKeys.webhooks(wsId), 'events'],
+        queryFn: () => api.get(`${base}/events`),
+        enabled: !!wsId,
+    });
+    const qc = useQueryClient();
+    const invalidate = () => qc.invalidateQueries({ queryKey: queryKeys.webhooks(wsId) });
+    const onError = (e, fallback) => toast.error(apiErrorMessage(e, fallback));
+    const toggle = useMutation({
+        mutationFn: (s) => api.patch(`${base}/subscriptions/${s.id}`, { is_active: !s.is_active }),
+        onSuccess: async () => { toast.success('状态已更新'); await invalidate(); },
+        onError: (e) => onError(e, '操作失败'),
+    });
+    const ping = useMutation({
+        mutationFn: (id) => api.post(`${base}/subscriptions/${id}/ping`),
+        onSuccess: async () => { toast.success('Ping 已入队，结果见投递记录'); await invalidate(); },
+        onError: (e) => onError(e, 'Ping 失败'),
+    });
+    const remove = useMutation({
+        mutationFn: (id) => api.delete(`${base}/subscriptions/${id}`),
+        onSuccess: async () => { toast.success('订阅已删除'); await invalidate(); },
+        onError: (e) => onError(e, '删除失败'),
+    });
+    const redeliver = useMutation({
+        mutationFn: (id) => api.post(`${base}/deliveries/${id}/redeliver`),
+        onSuccess: async () => { toast.success('已重新入队投递'); await invalidate(); },
+        onError: (e) => onError(e, '重新投递失败'),
+    });
+    const create = useMutation({
+        mutationFn: (values) => api.post(`${base}/subscriptions`, values),
+        onSuccess: async (data) => {
+            toast.success('订阅已创建');
+            setSecretTitle(undefined);
+            setSecret(data.secret);
+            await invalidate();
+        },
+        onError: (e) => onError(e, '创建失败'),
+    });
+    const rotate = useMutation({
+        mutationFn: (id) => api.post(`${base}/subscriptions/${id}/rotate-secret`),
+        onSuccess: async (data) => {
+            toast.success('密钥已轮换');
+            setSecretTitle('Webhook 签名密钥轮换成功');
+            setSecret(data.secret);
+            await invalidate();
+        },
+        onError: (e) => onError(e, '轮换密钥失败'),
+    });
+    const latestBySub = useMemo(() => {
+        const map = new Map();
+        for (const d of deliveriesQ.data?.items ?? []) {
+            if (!map.has(d.subscription_id))
+                map.set(d.subscription_id, d);
+        }
+        return map;
+    }, [deliveriesQ.data]);
+    const subById = useMemo(() => {
+        const map = new Map();
+        for (const s of subsQ.data?.items ?? [])
+            map.set(s.id, s);
+        return map;
+    }, [subsQ.data]);
+    const form = useZodForm({
+        schema: createSchema,
+        defaultValues: { url: '', description: '', events: [] },
+    });
+    const selectedEvents = form.watch('events') ?? [];
+    const toggleEvent = (type, checked) => {
+        form.setValue('events', checked ? [...selectedEvents, type] : selectedEvents.filter((t) => t !== type), { shouldValidate: true });
+    };
+    const submitCreate = form.handleSubmit((values) => {
+        create.mutate(values, {
+            onSuccess: () => {
+                form.reset();
+                setCreateOpen(false);
+            },
+        });
+    });
+    const closeSecret = () => {
+        setSecret(null);
+        setSecretTitle(undefined);
+    };
+    const onRedeliverLatest = async (s) => {
+        const latest = latestBySub.get(s.id);
+        if (!latest) {
+            toast.info('该订阅暂无投递记录，可先发送 Ping');
+            return;
+        }
+        await redeliver.mutateAsync(latest.id).catch(() => { });
+    };
+    const onRemove = async (s) => {
+        if (!(await confirm({
+            title: '删除订阅',
+            description: `确定删除 ${s.url} 吗？该操作不可恢复。`,
+            confirmText: '删除', danger: true,
+        })))
+            return;
+        remove.mutate(s.id);
+    };
+    const onRotate = async (s) => {
+        if (!(await confirm({
+            title: '轮换签名密钥',
+            description: `确定轮换 ${s.url} 的签名密钥吗？新密钥仅显示一次；旧密钥在 24h 宽限期内继续有效（期间投递同时携带新/旧双签名），之后仅新密钥可用。`,
+            confirmText: '轮换',
+        })))
+            return;
+        rotate.mutate(s.id);
+    };
+    const subColumns = [
+        {
+            key: 'url', header: '回调地址',
+            render: (s) => (_jsxs("div", { className: "min-w-0 max-w-xs", children: [_jsx("p", { className: "truncate font-medium", children: s.url }), s.description && _jsx("p", { className: "truncate text-xs text-muted-foreground", children: s.description })] })),
+        },
+        {
+            key: 'events', header: '事件类型',
+            render: (s) => (_jsx("div", { className: "flex max-w-xs flex-wrap gap-1", children: s.event_types.map((t) => (_jsx("code", { className: "rounded bg-muted px-1.5 py-0.5 font-mono text-xs", children: t }, t))) })),
+        },
+        {
+            key: 'is_active', header: '启用',
+            render: (s) => canManage ? (_jsx(Switch, { checked: s.is_active, disabled: toggle.isPending, onCheckedChange: () => toggle.mutate(s), "aria-label": `${s.is_active ? '暂停' : '恢复'}订阅 ${s.url}` })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: s.is_active ? '已启用' : '已暂停' })),
+        },
+        {
+            key: 'latest', header: '最近投递',
+            render: (s) => {
+                const d = latestBySub.get(s.id);
+                return d ? (_jsxs("div", { className: "min-w-0", children: [_jsx(StatusBadge, { status: d.status }), _jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: formatDateTime(d.created_at) })] })) : _jsx("span", { className: "text-muted-foreground", children: "\u2014" });
+            },
+        },
+        {
+            key: 'attempts', header: '尝试',
+            render: (s) => {
+                const d = latestBySub.get(s.id);
+                return _jsx("span", { className: "tabular-nums", children: d ? d.attempts : 0 });
+            },
+        },
+        {
+            key: 'actions', header: '', className: 'w-10',
+            render: (s) => canManage ? (_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: "inline-flex size-8 items-center justify-center rounded-md hover:bg-accent", "aria-label": `订阅 ${s.url} 的操作`, children: [_jsx(MoreHorizontal, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "\u6253\u5F00\u83DC\u5355" })] }), _jsxs(DropdownMenuContent, { align: "end", className: "w-40", children: [_jsx(DropdownMenuItem, { onClick: () => ping.mutate(s.id), children: "\u53D1\u9001 Ping" }), _jsx(DropdownMenuItem, { onClick: () => onRedeliverLatest(s), children: "\u91CD\u6295\u6700\u8FD1\u4E00\u6761" }), _jsx(DropdownMenuItem, { onClick: () => onRotate(s), children: "\u8F6E\u6362\u5BC6\u94A5" }), _jsx(DropdownMenuItem, { variant: "destructive", onClick: () => onRemove(s), children: "\u5220\u9664" })] })] })) : null,
+        },
+    ];
+    const deliveryColumns = [
+        {
+            key: 'event', header: '事件',
+            render: (d) => (_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "font-medium", children: d.event_type }), _jsx("p", { className: "truncate font-mono text-xs text-muted-foreground", children: d.event_id })] })),
+        },
+        {
+            key: 'subscription', header: '归属订阅',
+            render: (d) => {
+                const sub = subById.get(d.subscription_id);
+                if (sub) {
+                    return (_jsx("span", { className: "block max-w-xs truncate font-mono text-xs", title: sub.url, children: sub.url }));
+                }
+                return subsQ.isSuccess ? (_jsx("span", { className: "inline-flex items-center whitespace-nowrap rounded-md border px-1.5 py-0.5 text-xs text-muted-foreground", children: "\u5DF2\u5220\u9664\u8BA2\u9605" })) : _jsx("span", { className: "text-muted-foreground", children: "\u2014" });
+            },
+        },
+        { key: 'status', header: '状态', render: (d) => _jsx(StatusBadge, { status: d.status }) },
+        {
+            key: 'attempts', header: '尝试',
+            render: (d) => (_jsxs("span", { className: "tabular-nums", children: [d.attempts, d.last_status_code ? _jsxs("span", { className: "ml-1 text-xs text-muted-foreground", children: ["HTTP ", d.last_status_code] }) : null] })),
+        },
+        {
+            key: 'last_error', header: '最后错误',
+            render: (d) => d.last_error ? (_jsx("span", { className: "block max-w-xs truncate text-xs text-destructive", title: d.last_error, children: d.last_error })) : _jsx("span", { className: "text-muted-foreground", children: "\u2014" }),
+        },
+        {
+            key: 'created_at', header: '时间',
+            render: (d) => _jsx("span", { className: "whitespace-nowrap text-muted-foreground", children: formatDateTime(d.created_at) }),
+        },
+        {
+            key: 'actions', header: '操作', className: 'text-right',
+            render: (d) => canManage ? (_jsx(Button, { size: "sm", variant: "outline", disabled: redeliver.isPending, onClick: () => redeliver.mutate(d.id), children: "\u91CD\u65B0\u6295\u9012" })) : null,
+        },
+    ];
+    if (!wsId) {
+        return (_jsxs("div", { children: [_jsx(PageHeader, { title: "Webhooks", description: "\u51FA\u7AD9\u4E8B\u4EF6\u8BA2\u9605\u4E0E\u6295\u9012\u7BA1\u7406" }), _jsx(PageEmpty, { label: "\u8BF7\u5148\u521B\u5EFA\u5E76\u9009\u62E9\u4E00\u4E2A\u5DE5\u4F5C\u533A" })] }));
+    }
+    return (_jsxs("div", { children: [_jsx(PageHeader, { title: "Webhooks", description: `出站事件订阅与投递管理（工作区：${current?.name ?? wsId}）`, actions: canManage ? _jsxs(Button, { onClick: () => setCreateOpen(true), children: [_jsx(Plus, {}), " \u521B\u5EFA\u8BA2\u9605"] }) : undefined }), _jsxs(Tabs, { defaultValue: "subscriptions", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "subscriptions", children: "\u8BA2\u9605" }), _jsx(TabsTrigger, { value: "deliveries", children: "\u6295\u9012\u8BB0\u5F55" })] }), _jsx(TabsContent, { value: "subscriptions", className: "mt-4 space-y-4", children: subsQ.isError ? (_jsx(PageError, { message: apiErrorMessage(subsQ.error, '订阅列表加载失败'), onRetry: () => subsQ.refetch() })) : subsQ.isPending ? (_jsx(PageLoading, { label: "\u52A0\u8F7D\u8BA2\u9605\u2026" })) : (_jsx(DataTable, { columns: subColumns, rows: subsQ.data?.items ?? [], rowKey: (s) => s.id, empty: _jsx(PageEmpty, { label: "\u6682\u65E0\u8BA2\u9605", hint: "\u70B9\u51FB\u53F3\u4E0A\u89D2\u201C\u521B\u5EFA\u8BA2\u9605\u201D\u63A5\u6536\u7B2C\u4E00\u4E2A\u4E8B\u4EF6" }) })) }), _jsx(TabsContent, { value: "deliveries", className: "mt-4", children: deliveriesQ.isError ? (_jsx(PageError, { message: apiErrorMessage(deliveriesQ.error, '投递记录加载失败'), onRetry: () => deliveriesQ.refetch() })) : deliveriesQ.isPending ? (_jsx(PageLoading, { label: "\u52A0\u8F7D\u6295\u9012\u8BB0\u5F55\u2026" })) : (_jsx(DataTable, { columns: deliveryColumns, rows: deliveriesQ.data?.items ?? [], rowKey: (d) => d.id, empty: _jsx(PageEmpty, { label: "\u6682\u65E0\u6295\u9012", hint: "\u89E6\u53D1\u4E8B\u4EF6\u6216\u53D1\u9001 Ping \u540E\uFF0C\u6295\u9012\u4F1A\u51FA\u73B0\u5728\u8FD9\u91CC" }) })) })] }), _jsx(Dialog, { open: createOpen, onOpenChange: setCreateOpen, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "\u521B\u5EFA\u8BA2\u9605" }), _jsx(DialogDescription, { children: "\u4E8B\u4EF6\u5C06\u4EE5 HMAC \u7B7E\u540D\u6295\u9012\u5230\u56DE\u8C03\u5730\u5740\uFF1B\u7B7E\u540D\u5BC6\u94A5\u5728\u521B\u5EFA\u540E\u4EC5\u5C55\u793A\u4E00\u6B21\u3002" })] }), _jsxs("form", { className: "space-y-4", onSubmit: submitCreate, children: [_jsx(FormField, { label: "\u56DE\u8C03 URL", error: form.formState.errors.url?.message, htmlFor: "whk-url", children: _jsx(Input, { id: "whk-url", placeholder: "https://example.com/webhook", ...form.register('url') }) }), _jsx(FormField, { label: "\u5907\u6CE8\uFF08\u53EF\u9009\uFF09", error: form.formState.errors.description?.message, htmlFor: "whk-desc", children: _jsx(Input, { id: "whk-desc", placeholder: "\u7528\u9014\u8BF4\u660E\uFF0C\u4FBF\u4E8E\u8BC6\u522B", ...form.register('description') }) }), _jsx(FormField, { label: "\u4E8B\u4EF6\u7C7B\u578B", error: form.formState.errors.events?.message, children: _jsxs("div", { className: "max-h-44 space-y-2 overflow-y-auto rounded-md border p-3", children: [(eventsQ.data?.items ?? []).map((ev) => {
+                                                const cbId = `whk-evt-${ev.type.replace(/[^a-zA-Z0-9-]/g, '-')}`;
+                                                const checked = selectedEvents.includes(ev.type);
+                                                return (_jsxs("label", { className: "flex items-start gap-2 text-sm", htmlFor: cbId, onClick: (e) => {
+                                                        if (e.target.closest('[data-slot="checkbox"]'))
+                                                            return;
+                                                        e.preventDefault();
+                                                        toggleEvent(ev.type, !checked);
+                                                    }, children: [_jsx(Checkbox, { id: cbId, checked: checked, onCheckedChange: (c) => toggleEvent(ev.type, c === true) }), _jsxs("span", { className: "min-w-0", children: [_jsx("code", { className: "rounded bg-muted px-1.5 py-0.5 font-mono text-xs", children: ev.type }), ev.description && _jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: ev.description })] })] }, ev.type));
+                                            }), eventsQ.isPending && _jsx("p", { className: "text-xs text-muted-foreground", children: "\u52A0\u8F7D\u4E8B\u4EF6\u76EE\u5F55\u2026" })] }) }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => setCreateOpen(false), children: "\u53D6\u6D88" }), _jsx(Button, { type: "submit", disabled: create.isPending, children: create.isPending ? '创建中…' : '创建订阅' })] })] })] }) }), _jsx(SecretModal, { open: secret !== null, onOpenChange: (o) => !o && closeSecret(), secretName: "Webhook \u7B7E\u540D\u5BC6\u94A5", secretValue: secret ?? '', title: secretTitle })] }));
+}

package/dist/pages/workspace/WorkspaceAuditPage.d.ts

@@ -0,0 +1,3 @@
+export interface WorkspaceAuditPageProps {
+}
+export declare function WorkspaceAuditPage(_props?: WorkspaceAuditPageProps): import("react").JSX.Element;

package/dist/pages/workspace/WorkspaceAuditPage.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { useSearchParams } from 'react-router';
+import { Download, Search } from 'lucide-react';
+import { PageHeader, PageLoading, PageError, PageEmpty } from '../../components/Page';
+import { DataTable } from '../../components/DataTable';
+import { Button } from '../../components/ui/Button';
+import { Input } from '../../components/ui/Input';
+import { toast } from '../../components/toast';
+import { useAudit, exportAuditCsv, } from '../../hooks/useAudit';
+import { formatDateTime } from '../../lib/utils';
+import { apiErrorMessage } from '../../lib/api-error';
+const PAGE_SIZE = 20;
+function draftFromParams(p) {
+    return {
+        action: p.get('action') ?? '',
+        actorId: p.get('actor_id') ?? '',
+        resourceType: p.get('resource_type') ?? '',
+        from: p.get('from') ?? '',
+        to: p.get('to') ?? '',
+    };
+}
+function paramsFromDraft(d, offset) {
+    const p = new URLSearchParams();
+    if (d.action.trim())
+        p.set('action', d.action.trim());
+    if (d.actorId.trim())
+        p.set('actor_id', d.actorId.trim());
+    if (d.resourceType.trim())
+        p.set('resource_type', d.resourceType.trim());
+    if (d.from)
+        p.set('from', d.from);
+    if (d.to)
+        p.set('to', d.to);
+    if (offset > 0)
+        p.set('offset', String(offset));
+    return p;
+}
+function toFilters(d) {
+    return {
+        action: d.action.trim(),
+        actorId: d.actorId.trim(),
+        resourceType: d.resourceType.trim(),
+        from: d.from ? `${d.from}T00:00:00Z` : '',
+        to: d.to ? `${d.to}T23:59:59Z` : '',
+    };
+}
+export function WorkspaceAuditPage(_props = {}) {
+    const [searchParams, setSearchParams] = useSearchParams();
+    const [draft, setDraft] = useState(() => draftFromParams(searchParams));
+    useEffect(() => {
+        setDraft(draftFromParams(searchParams));
+    }, [searchParams]);
+    const [rangeError, setRangeError] = useState(null);
+    const appliedDraft = useMemo(() => draftFromParams(searchParams), [searchParams]);
+    const applied = useMemo(() => toFilters(appliedDraft), [appliedDraft]);
+    const offset = Math.max(0, Number.parseInt(searchParams.get('offset') ?? '0', 10) || 0);
+    const { wsId, items, total, loading, error, refetch } = useAudit(applied, PAGE_SIZE, offset);
+    const apply = () => {
+        if (draft.from && draft.to && draft.from > draft.to) {
+            setRangeError('起始日期不能晚于结束日期');
+            return;
+        }
+        setRangeError(null);
+        setSearchParams(paramsFromDraft(draft, 0));
+    };
+    const onPageChange = (p) => {
+        setSearchParams(paramsFromDraft(appliedDraft, Math.max(0, (p - 1) * PAGE_SIZE)));
+    };
+    const exportCsv = async () => {
+        try {
+            await exportAuditCsv(applied);
+            toast.success('CSV 导出已开始下载');
+        }
+        catch (e) {
+            toast.error(apiErrorMessage(e, '导出失败'));
+        }
+    };
+    const columns = [
+        {
+            key: 'created_at', header: '时间', className: 'w-[16%]',
+            render: (e) => _jsx("span", { className: "whitespace-nowrap text-muted-foreground", children: formatDateTime(e.created_at) }),
+        },
+        {
+            key: 'actor', header: '操作者', className: 'w-[20%]',
+            render: (e) => {
+                const email = typeof e.actor_snapshot?.email === 'string' ? e.actor_snapshot.email : '';
+                return (_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "truncate", children: email || e.actor_id || '—' }), _jsx("p", { className: "text-xs text-muted-foreground", children: e.actor_type })] }));
+            },
+        },
+        {
+            key: 'action', header: '动作', className: 'w-[22%]',
+            render: (e) => _jsx("code", { className: "rounded bg-muted px-1.5 py-0.5 font-mono text-xs", children: e.action }),
+        },
+        {
+            key: 'resource', header: '资源', className: 'w-[42%]',
+            render: (e) => (_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "truncate", children: e.resource_type }), e.resource_id && _jsx("p", { className: "truncate font-mono text-xs text-muted-foreground", children: e.resource_id })] })),
+        },
+    ];
+    if (!wsId) {
+        return (_jsxs("div", { children: [_jsx(PageHeader, { title: "\u5BA1\u8BA1\u65E5\u5FD7", description: "\u5DE5\u4F5C\u533A\u5185\u7684\u5173\u952E\u64CD\u4F5C\u8BB0\u5F55" }), _jsx(PageEmpty, { label: "\u8BF7\u5148\u521B\u5EFA\u5E76\u9009\u62E9\u4E00\u4E2A\u5DE5\u4F5C\u533A" })] }));
+    }
+    return (_jsxs("div", { children: [_jsx(PageHeader, { title: "\u5BA1\u8BA1\u65E5\u5FD7", description: "\u5DE5\u4F5C\u533A\u5185\u7684\u5173\u952E\u64CD\u4F5C\u8BB0\u5F55\uFF08\u4FDD\u7559\u6700\u8FD1\u4E8B\u4EF6\uFF0C\u6309\u65F6\u95F4\u5012\u5E8F\uFF09" }), _jsxs("div", { className: "mb-4 flex flex-wrap items-end gap-2", children: [_jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "\u52A8\u4F5C" }), _jsx(Input, { className: "w-44", placeholder: "\u5982 workspace.rename", value: draft.action, onChange: (e) => setDraft((d) => ({ ...d, action: e.target.value })) })] }), _jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "\u64CD\u4F5C\u8005 ID" }), _jsx(Input, { className: "w-52", placeholder: "actor uuid", value: draft.actorId, onChange: (e) => setDraft((d) => ({ ...d, actorId: e.target.value })) })] }), _jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "\u8D44\u6E90\u7C7B\u578B" }), _jsx(Input, { className: "w-40", placeholder: "\u5982 workspace", value: draft.resourceType, onChange: (e) => setDraft((d) => ({ ...d, resourceType: e.target.value })) })] }), _jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "\u5F00\u59CB\u65E5\u671F" }), _jsx(Input, { className: "w-40", type: "date", value: draft.from, onChange: (e) => setDraft((d) => ({ ...d, from: e.target.value })) })] }), _jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "\u7ED3\u675F\u65E5\u671F" }), _jsx(Input, { className: "w-40", type: "date", value: draft.to, onChange: (e) => setDraft((d) => ({ ...d, to: e.target.value })) })] }), _jsxs(Button, { onClick: apply, children: [_jsx(Search, {}), " \u67E5\u8BE2"] }), _jsxs(Button, { variant: "outline", onClick: exportCsv, children: [_jsx(Download, {}), " \u5BFC\u51FA CSV"] })] }), rangeError && (_jsx("p", { role: "alert", className: "mb-4 text-sm text-destructive", children: rangeError })), loading ? (_jsx(PageLoading, { label: "\u52A0\u8F7D\u5BA1\u8BA1\u65E5\u5FD7\u2026" })) : error ? (_jsx(PageError, { message: apiErrorMessage(error, '审计日志加载失败'), onRetry: () => refetch() })) : (_jsx(_Fragment, { children: _jsx(DataTable, { columns: columns, rows: items, rowKey: (e) => e.id, empty: _jsx(PageEmpty, { label: "\u6682\u65E0\u5BA1\u8BA1\u8BB0\u5F55", hint: "\u8C03\u6574\u8FC7\u6EE4\u6761\u4EF6\u6216\u89E6\u53D1\u4E00\u4E9B\u64CD\u4F5C\u540E\u518D\u6765" }), pagination: {
+                        page: Math.floor(offset / PAGE_SIZE) + 1,
+                        pageSize: PAGE_SIZE,
+                        total,
+                        onPageChange,
+                    } }) }))] }));
+}

package/dist/pages/workspace/WorkspaceGeneralPage.d.ts

@@ -0,0 +1,4 @@
+export interface WorkspaceGeneralPageProps {
+    exitTo?: string;
+}
+export declare function WorkspaceGeneralPage({ exitTo }?: WorkspaceGeneralPageProps): import("react").JSX.Element;

package/dist/pages/workspace/WorkspaceGeneralPage.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useNavigate } from 'react-router';
+import { useQueryClient } from '@tanstack/react-query';
+import { z } from 'zod';
+import { PageHeader, PageError } from '../../components/Page';
+import { SettingsCard } from '../../components/SettingsCard';
+import { FormField } from '../../components/FormField';
+import { ImpactConfirmation } from '../../components/SecretModal';
+import { useConfirm } from '../../components/ConfirmDialog';
+import { toast } from '../../components/toast';
+import { Button } from '../../components/ui/Button';
+import { Input } from '../../components/ui/Input';
+import { useApi } from '../../hooks/useApi';
+import { useWorkspace } from '../../hooks/useWorkspace';
+import { useZodForm } from '../../hooks/useZodForm';
+import { queryKeys } from '../../provider/PloykitProvider';
+import { apiErrorMessage } from '../../lib/api-error';
+import { roleSatisfies } from '../../lib/perm';
+const renameSchema = z.object({
+    name: z.string().trim().min(1, '请输入工作区名称').max(64, '名称最多 64 字符'),
+});
+export function WorkspaceGeneralPage({ exitTo = '/app' } = {}) {
+    const { current, clear } = useWorkspace();
+    const api = useApi();
+    const confirm = useConfirm();
+    const navigate = useNavigate();
+    const qc = useQueryClient();
+    const [saving, setSaving] = useState(false);
+    const [deleteOpen, setDeleteOpen] = useState(false);
+    const ws = current;
+    const form = useZodForm({
+        schema: renameSchema,
+        defaultValues: { name: ws?.name ?? '' },
+        values: ws ? { name: ws.name } : undefined, // 工作区数据到达后同步进表单
+    });
+    if (!ws) {
+        return (_jsxs("div", { children: [_jsx(PageHeader, { title: "\u5DE5\u4F5C\u533A\u6982\u51B5" }), _jsx(PageError, { message: "\u5DE5\u4F5C\u533A\u4E0D\u5B58\u5728\u6216\u5C1A\u672A\u9009\u62E9", onRetry: () => qc.invalidateQueries({ queryKey: queryKeys.workspaceList }) })] }));
+    }
+    const canRename = roleSatisfies(ws.role, 'admin');
+    const canDelete = roleSatisfies(ws.role, 'owner');
+    const refreshList = async () => {
+        await qc.invalidateQueries({ queryKey: queryKeys.workspace });
+    };
+    const handleRename = form.handleSubmit(async (values) => {
+        setSaving(true);
+        try {
+            await api.patch(`/api/workspaces/${ws.id}`, { name: values.name });
+            await refreshList();
+            toast.success('工作区名称已更新');
+        }
+        catch (e) {
+            toast.error(apiErrorMessage(e, '重命名失败'));
+        }
+        finally {
+            setSaving(false);
+        }
+    });
+    const afterExit = async () => {
+        clear();
+        await refreshList();
+        navigate(exitTo);
+    };
+    const handleLeave = async () => {
+        if (!(await confirm({
+            title: '退出工作区',
+            description: `退出后将失去「${ws.name}」的访问权限；你创建的数据会保留在工作区内。`,
+            confirmText: '退出', danger: true,
+        })))
+            return;
+        try {
+            await api.post(`/api/workspaces/${ws.id}/leave`);
+            toast.success('已退出工作区');
+            await afterExit();
+        }
+        catch (e) {
+            toast.error(is409(e)
+                ? '最后一个所有者不能离开工作区，请先转移所有权或删除工作区'
+                : apiErrorMessage(e, '退出失败'));
+        }
+    };
+    const handleDelete = async () => {
+        try {
+            await api.delete(`/api/workspaces/${ws.id}`);
+            toast.success('工作区已删除');
+            await afterExit();
+        }
+        catch (e) {
+            toast.error(apiErrorMessage(e, '删除失败'));
+        }
+    };
+    return (_jsxs("div", { children: [_jsx(PageHeader, { title: "\u5DE5\u4F5C\u533A\u6982\u51B5", description: `工作区 ${ws.name}（${ws.slug}）的基础设置` }), _jsx(SettingsCard, { title: "\u57FA\u7840\u4FE1\u606F", description: "\u5DE5\u4F5C\u533A\u540D\u79F0\u5BF9\u6210\u5458\u53EF\u89C1\uFF1Bslug \u662F URL \u6807\u8BC6\uFF0C\u521B\u5EFA\u540E\u4E0D\u53EF\u4FEE\u6539\u3002", children: _jsxs("form", { className: "max-w-md space-y-4", onSubmit: handleRename, children: [_jsx(FormField, { label: "\u5DE5\u4F5C\u533A\u540D\u79F0", error: form.formState.errors.name?.message, htmlFor: "ws-name", children: _jsx(Input, { id: "ws-name", disabled: !canRename, ...form.register('name') }) }), _jsx(FormField, { label: "Slug\uFF08\u53EA\u8BFB\uFF09", htmlFor: "ws-slug", children: _jsx(Input, { id: "ws-slug", value: ws.slug, readOnly: true, disabled: true }) }), canRename && (_jsx(Button, { type: "submit", disabled: saving, children: saving ? '保存中…' : '保存修改' }))] }) }), _jsx(SettingsCard, { danger: true, title: "\u5371\u9669\u533A", description: "\u4EE5\u4E0B\u64CD\u4F5C\u5F71\u54CD\u5168\u90E8\u6210\u5458\uFF0C\u8BF7\u8C28\u614E\u6267\u884C\u3002", children: _jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-row items-center justify-between gap-4 rounded-lg border p-4", children: [_jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium", children: "\u9000\u51FA\u5DE5\u4F5C\u533A" }), _jsxs("p", { className: "mt-0.5 text-sm text-muted-foreground", children: ["\u9000\u51FA\u540E\u4F60\u5C06\u4E0D\u518D\u662F\u300C", ws.name, "\u300D\u7684\u6210\u5458\u3002\u6700\u540E\u4E00\u4F4D owner \u65E0\u6CD5\u9000\u51FA\u3002"] })] }), _jsx(Button, { variant: "outline", onClick: handleLeave, children: "\u9000\u51FA\u5DE5\u4F5C\u533A" })] }), canDelete && (_jsxs("div", { className: "flex flex-row items-center justify-between gap-4 rounded-lg border border-destructive/40 p-4", children: [_jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-destructive", children: "\u5220\u9664\u5DE5\u4F5C\u533A" }), _jsx("p", { className: "mt-0.5 text-sm text-muted-foreground", children: "\u786C\u5220\u9664\u5DE5\u4F5C\u533A\u53CA\u5176\u5168\u90E8\u6570\u636E\uFF0C\u64CD\u4F5C\u4E0D\u53EF\u6062\u590D\u3002" })] }), _jsx(Button, { variant: "destructive", onClick: () => setDeleteOpen(true), children: "\u5220\u9664\u5DE5\u4F5C\u533A" })] }))] }) }), _jsx(ImpactConfirmation, { open: deleteOpen, onOpenChange: setDeleteOpen, onConfirm: handleDelete, title: `删除工作区「${ws.name}」`, impacts: [
+                    '工作区全部数据将被永久删除，且不可恢复',
+                    '所有成员立即失去访问权限',
+                    '未撤销的邀请与分享链接同时失效',
+                    '历史审计记录将保留（合规要求），但不再关联可访问的工作区',
+                ], confirmText: "\u6C38\u4E45\u5220\u9664", danger: true })] }));
+}
+function is409(e) {
+    return typeof e === 'object' && e !== null && 'status' in e && e.status === 409;
+}

package/dist/provider/PloykitProvider.d.ts

@@ -0,0 +1,50 @@
+import { type ReactNode } from 'react';
+import { QueryClient } from '@tanstack/react-query';
+import type { APIUser, APIWorkspace, APISubscription, APIOrder, APIPlan } from '@ploykit/client';
+export declare const queryKeys: {
+    auth: readonly ["auth"];
+    me: readonly ["auth", "me"];
+    sessions: readonly ["auth", "sessions"];
+    tokens: readonly ["auth", "tokens"];
+    workspace: readonly ["workspace"];
+    workspaceList: readonly ["workspace", "list"];
+    members: (wsId: string) => readonly ["workspace", string, "members"];
+    invitations: (wsId: string) => readonly ["workspace", string, "invitations"];
+    shareLinks: (wsId: string) => readonly ["workspace", string, "share-links"];
+    myInvitations: readonly ["workspace", "my-invitations"];
+    audit: (wsId: string, q: object) => readonly ["audit", string, object];
+    usage: (wsId: string) => readonly ["usage", string];
+    billing: readonly ["billing"];
+    billingSubscription: (workspaceId: string) => readonly ["billing", "subscription", string];
+    billingPlans: readonly ["billing", "plans"];
+    notifications: readonly ["notifications"];
+    notificationPrefs: readonly ["notifications", "preferences"];
+    webhooks: (wsId: string) => readonly ["webhooks", string];
+    admin: readonly ["admin"];
+};
+export type PKUser = APIUser;
+export type PKWorkspace = APIWorkspace;
+export type PKSubscription = APISubscription;
+export type PKOrder = APIOrder;
+export type PKPlan = APIPlan;
+export interface AuthContextValue {
+    user: PKUser | null;
+    workspaces: PKWorkspace[];
+    loading: boolean;
+    error: unknown;
+    refresh(): Promise<void>;
+    logout(): Promise<void>;
+}
+export declare const AuthContext: import("react").Context<AuthContextValue | null>;
+export interface WorkspaceContextValue {
+    current: PKWorkspace | null;
+    switchTo(id: string): void;
+    clear(): void;
+}
+export declare const WorkspaceContext: import("react").Context<WorkspaceContextValue | null>;
+export declare function useAuthCtx(): AuthContextValue;
+export declare function useWorkspaceCtx(): WorkspaceContextValue;
+export declare function PloykitProvider({ children, queryClient }: {
+    children: ReactNode;
+    queryClient?: QueryClient;
+}): import("react").JSX.Element;