plugin-ai-api 1.0.20 → 1.0.23

package/src/client-v2/pages/RolePermissionsTab.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import { AiApiRolePermissions } from '../components/AiApiRolePermissions';
+
+/**
+ * v2 ACL permission tab wrapper.
+ *
+ * The v2 `settingsUI.addPermissionsTab` loads a component via `componentLoader` and
+ * passes it `PermissionTabProps` ({ activeRole, ... }), whereas AiApiRolePermissions
+ * takes { role }. This wrapper bridges the prop shape so the shared component can be
+ * reused unchanged across both client runtimes.
+ */
+export default function RolePermissionsTab({ activeRole }: { activeRole?: { name?: string } | null }) {
+  return <AiApiRolePermissions role={activeRole} />;
+}

package/src/client-v2/pages/UserPermissionsPage.tsx

@@ -0,0 +1,322 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { Alert, Button, Card, Form, Modal, Popconfirm, Select, Space, Switch, Table, Tag, message } from 'antd';
+import type { ColumnsType } from 'antd/es/table';
+import { useFlowContext } from '@nocobase/flow-engine';
+import { useT } from '../locale';
+import { errorMessage, unwrapData } from './api';
+import type { ApiEnvelope } from './api';
+
+interface UserSummary {
+  id: string | number;
+  nickname?: string;
+  username?: string;
+  email?: string;
+}
+
+interface EnabledLlmService {
+  llmService: string;
+  llmServiceTitle?: string;
+  enabledModels?: { label: string; value: string }[];
+}
+
+interface UserPermission {
+  id: string | number;
+  userId: string | number;
+  user?: UserSummary;
+  enabled: boolean;
+  allowedLlmServices: string[];
+  allowAllModels: boolean;
+  allowedModels: string[];
+}
+
+/** The modal edits everything except the server-assigned id. */
+type UserPermissionFormValues = Omit<UserPermission, 'id' | 'user'>;
+
+const PAGE_SIZE = 20;
+
+export default function UserPermissionsPage() {
+  const ctx = useFlowContext();
+  const t = useT();
+  const [form] = Form.useForm<UserPermissionFormValues>();
+  const selectedServices = Form.useWatch('allowedLlmServices', form);
+  const allowAllModels = Form.useWatch('allowAllModels', form);
+  const [rows, setRows] = useState<UserPermission[]>([]);
+  const [total, setTotal] = useState(0);
+  const [page, setPage] = useState(1);
+  const [users, setUsers] = useState<UserSummary[]>([]);
+  const [userSearch, setUserSearch] = useState('');
+  const [services, setServices] = useState<EnabledLlmService[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [saving, setSaving] = useState(false);
+  const [editing, setEditing] = useState<UserPermission>();
+  const [open, setOpen] = useState(false);
+
+  const load = useCallback(async () => {
+    setLoading(true);
+    try {
+      const [permissionsResponse, servicesResponse] = await Promise.all([
+        ctx.api.request({
+          url: 'aiApiUserPermissions:list',
+          method: 'get',
+          params: { page, pageSize: PAGE_SIZE, appends: ['user'], sort: '-updatedAt' },
+        }),
+        ctx.api.request({ url: 'ai:listAllEnabledModels', method: 'get' }),
+      ]);
+      setRows(unwrapData<UserPermission[]>(permissionsResponse, []));
+      setTotal((permissionsResponse as ApiEnvelope<UserPermission[]>)?.data?.meta?.count ?? 0);
+      setServices(unwrapData<EnabledLlmService[]>(servicesResponse, []));
+    } catch (error) {
+      message.error(errorMessage(error));
+    } finally {
+      setLoading(false);
+    }
+  }, [ctx.api, page]);
+
+  useEffect(() => {
+    load();
+  }, [load]);
+
+  // Served by the plugin's own action rather than `users:list`, which belongs to the
+  // pm.plugin-users snippet and would make this page unusable for a role granted only
+  // pm.plugin-ai-api.user-permissions.
+  const loadUsers = useCallback(
+    async (keyword: string) => {
+      try {
+        const response = await ctx.api.request({
+          url: 'aiApiUserPermissions:listUsers',
+          method: 'get',
+          params: { keyword, pageSize: 50, excludeGranted: !editing },
+        });
+        setUsers(unwrapData<UserSummary[]>(response, []));
+      } catch (error) {
+        message.error(errorMessage(error));
+      }
+    },
+    [ctx.api, editing],
+  );
+
+  useEffect(() => {
+    if (!open) return;
+    const timer = setTimeout(() => loadUsers(userSearch), 300);
+    return () => clearTimeout(timer);
+  }, [open, userSearch, loadUsers]);
+
+  const serviceOptions = useMemo(
+    () =>
+      services.map((service) => ({ label: service.llmServiceTitle || service.llmService, value: service.llmService })),
+    [services],
+  );
+
+  // Model IDs are "serviceName/modelId", matching what the gateway enforces and what
+  // GET /v1/models returns, so admins never have to type them by hand.
+  const modelOptions = useMemo(() => {
+    const picked = new Set(selectedServices || []);
+    return services
+      .filter((service) => picked.has(service.llmService))
+      .flatMap((service) =>
+        (service.enabledModels || []).map((model) => ({
+          label: `${service.llmServiceTitle || service.llmService} / ${model.label || model.value}`,
+          value: `${service.llmService}/${model.value}`,
+        })),
+      );
+  }, [services, selectedServices]);
+
+  const showCreate = () => {
+    setEditing(undefined);
+    setUserSearch('');
+    form.setFieldsValue({
+      enabled: true,
+      allowedLlmServices: [],
+      allowAllModels: true,
+      allowedModels: [],
+    });
+    setOpen(true);
+  };
+
+  const showEdit = (record: UserPermission) => {
+    setEditing(record);
+    setUserSearch('');
+    // Seed the picker with the granted user so the label renders before any search runs.
+    setUsers(record.user ? [record.user] : []);
+    form.setFieldsValue({
+      userId: record.userId,
+      enabled: record.enabled,
+      allowAllModels: record.allowAllModels,
+      allowedLlmServices: record.allowedLlmServices || [],
+      allowedModels: record.allowedModels || [],
+    });
+    setOpen(true);
+  };
+
+  const save = async () => {
+    const values = await form.validateFields();
+    setSaving(true);
+    try {
+      await ctx.api.request({
+        url: editing ? `aiApiUserPermissions:update/${editing.id}` : 'aiApiUserPermissions:create',
+        method: 'post',
+        data: values,
+      });
+      message.success(t('Saved successfully'));
+      setOpen(false);
+      await load();
+    } catch (error) {
+      message.error(errorMessage(error));
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  const remove = async (record: UserPermission) => {
+    try {
+      await ctx.api.request({ url: `aiApiUserPermissions:destroy/${record.id}`, method: 'post' });
+      message.success(t('Deleted successfully'));
+      await load();
+    } catch (error) {
+      message.error(errorMessage(error));
+    }
+  };
+
+  const userLabel = (user?: UserSummary) => user?.nickname || user?.username || user?.email || String(user?.id ?? '');
+  const serviceLabel = (name: string) => serviceOptions.find((option) => option.value === name)?.label || name;
+
+  const columns: ColumnsType<UserPermission> = [
+    {
+      title: t('User'),
+      key: 'user',
+      width: 180,
+      render: (_, record) => userLabel(record.user) || String(record.userId),
+    },
+    {
+      title: t('Allowed LLM services'),
+      dataIndex: 'allowedLlmServices',
+      key: 'allowedLlmServices',
+      render: (values: string[]) =>
+        values?.length ? (
+          <Space size={[0, 4]} wrap>
+            {values.map((value) => (
+              <Tag key={value}>{serviceLabel(value)}</Tag>
+            ))}
+          </Space>
+        ) : (
+          <Tag color="red">{t('No service allowed')}</Tag>
+        ),
+    },
+    {
+      title: t('Allowed models'),
+      key: 'allowedModels',
+      width: 220,
+      render: (_, record) =>
+        record.allowAllModels ? (
+          <Tag color="blue">{t('All models of allowed services')}</Tag>
+        ) : (
+          <Space size={[0, 4]} wrap>
+            {(record.allowedModels || []).map((value) => (
+              <Tag key={value}>{value}</Tag>
+            ))}
+          </Space>
+        ),
+    },
+    {
+      title: t('Status'),
+      dataIndex: 'enabled',
+      key: 'enabled',
+      width: 100,
+      render: (enabled: boolean) => (
+        <Tag color={enabled ? 'green' : 'default'}>{enabled ? t('Enabled') : t('Disabled')}</Tag>
+      ),
+    },
+    {
+      title: t('Actions'),
+      key: 'actions',
+      width: 150,
+      fixed: 'right',
+      render: (_, record) => (
+        <Space size={0}>
+          <Button type="link" onClick={() => showEdit(record)}>
+            {t('Edit')}
+          </Button>
+          <Popconfirm title={t('Delete this permission?')} onConfirm={() => remove(record)}>
+            <Button type="link" danger>
+              {t('Delete')}
+            </Button>
+          </Popconfirm>
+        </Space>
+      ),
+    },
+  ];
+
+  return (
+    <Card
+      title={t('User LLM permissions')}
+      extra={
+        <Button type="primary" onClick={showCreate}>
+          {t('Add permission')}
+        </Button>
+      }
+    >
+      <Alert
+        type="info"
+        showIcon
+        style={{ marginBottom: 16 }}
+        message={t(
+          'Users listed here are limited to the services selected below. Users without a record fall back to the general configuration.',
+        )}
+      />
+      <Table
+        rowKey="id"
+        columns={columns}
+        dataSource={rows}
+        loading={loading}
+        scroll={{ x: 1000 }}
+        pagination={{
+          current: page,
+          pageSize: PAGE_SIZE,
+          total,
+          showSizeChanger: false,
+          onChange: setPage,
+        }}
+      />
+      <Modal
+        title={editing ? t('Edit permission') : t('Add permission')}
+        open={open}
+        onCancel={() => setOpen(false)}
+        onOk={save}
+        confirmLoading={saving}
+        destroyOnClose
+      >
+        <Form form={form} layout="vertical" preserve={false}>
+          <Form.Item name="userId" label={t('User')} rules={[{ required: true }]}>
+            <Select
+              disabled={Boolean(editing)}
+              showSearch
+              // Matching happens on the server, so keep every returned option visible.
+              filterOption={false}
+              onSearch={setUserSearch}
+              notFoundContent={null}
+              options={users.map((user) => ({ label: userLabel(user), value: user.id }))}
+            />
+          </Form.Item>
+          <Form.Item
+            name="allowedLlmServices"
+            label={t('Allowed LLM services')}
+            extra={t('Only services also enabled in the general configuration take effect.')}
+          >
+            <Select mode="multiple" allowClear showSearch optionFilterProp="label" options={serviceOptions} />
+          </Form.Item>
+          <Form.Item name="allowAllModels" label={t('Allow all models')} valuePropName="checked">
+            <Switch />
+          </Form.Item>
+          {allowAllModels === false && (
+            <Form.Item name="allowedModels" label={t('Allowed models')}>
+              <Select mode="multiple" allowClear showSearch optionFilterProp="label" options={modelOptions} />
+            </Form.Item>
+          )}
+          <Form.Item name="enabled" label={t('Enabled')} valuePropName="checked">
+            <Switch />
+          </Form.Item>
+        </Form>
+      </Modal>
+    </Card>
+  );
+}

package/src/client-v2/plugin.tsx

@@ -1,4 +1,19 @@
+import React from 'react';
 import { Plugin, Application } from '@nocobase/client-v2';
+import { AI_API_ACL_SNIPPET, AI_API_USER_PERMISSIONS_SNIPPET } from '../constants';
+
+interface PermissionTabOptions {
+  key: string;
+  label: string;
+  sort?: number;
+  componentLoader: () => Promise<{ default: React.ComponentType<{ activeRole?: { name?: string } | null }> }>;
+}
+
+interface AclPluginV2Compat {
+  settingsUI?: {
+    addPermissionsTab?: (options: PermissionTabOptions) => void;
+  };
+}
 
 export class PluginAiApiClient extends Plugin<Record<string, never>, Application> {
   async load() {
@@ -6,13 +21,15 @@ export class PluginAiApiClient extends Plugin<Record<string, never>, Application
       key: 'ai-api',
       title: this.t('AI API Gateway'),
       icon: 'ApiOutlined',
-      aclSnippet: 'pm.ai-api.configuration',
+      aclSnippet: AI_API_ACL_SNIPPET,
     });
 
     this.pluginSettingsManager.addPageTabItem({
       menuKey: 'ai-api',
       key: 'index',
       title: this.t('Configuration'),
+      aclSnippet: AI_API_ACL_SNIPPET,
+      sort: 1,
       componentLoader: () => import('./pages/GeneralPage'),
     });
 
@@ -20,13 +37,35 @@ export class PluginAiApiClient extends Plugin<Record<string, never>, Application
       menuKey: 'ai-api',
       key: 'model-pricing',
       title: this.t('Model pricing'),
+      aclSnippet: AI_API_ACL_SNIPPET,
+      sort: 2,
       componentLoader: () => import('./pages/ModelPricingPage'),
     });
 
+    this.pluginSettingsManager.addPageTabItem({
+      menuKey: 'ai-api',
+      key: 'model-metadata',
+      title: this.t('Model metadata'),
+      aclSnippet: AI_API_ACL_SNIPPET,
+      sort: 3,
+      componentLoader: () => import('./pages/ModelMetadataPage'),
+    });
+
+    this.pluginSettingsManager.addPageTabItem({
+      menuKey: 'ai-api',
+      key: 'user-permissions',
+      title: this.t('User LLM permissions'),
+      aclSnippet: AI_API_USER_PERMISSIONS_SNIPPET,
+      sort: 4,
+      componentLoader: () => import('./pages/UserPermissionsPage'),
+    });
+
     this.pluginSettingsManager.addPageTabItem({
       menuKey: 'ai-api',
       key: 'user-quotas',
       title: this.t('User quotas'),
+      aclSnippet: AI_API_ACL_SNIPPET,
+      sort: 5,
       componentLoader: () => import('./pages/UserQuotasPage'),
     });
 
@@ -34,8 +73,18 @@ export class PluginAiApiClient extends Plugin<Record<string, never>, Application
       menuKey: 'ai-api',
       key: 'usage',
       title: this.t('Usage'),
+      aclSnippet: AI_API_ACL_SNIPPET,
+      sort: 6,
       componentLoader: () => import('./pages/UsagePage'),
     });
+
+    const aclPlugin = this.app.pm.get('@nocobase/plugin-acl') as AclPluginV2Compat | undefined;
+    aclPlugin?.settingsUI?.addPermissionsTab?.({
+      key: 'aiApi',
+      label: this.t('AI API'),
+      sort: 25,
+      componentLoader: () => import('./pages/RolePermissionsTab'),
+    });
   }
 }
 

package/src/constants.ts

@@ -0,0 +1,28 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+/**
+ * The single admin snippet the server registers as `pm.${this.name}.configuration`.
+ *
+ * `this.name` is the plugin's package name with only `@nocobase/plugin-` or
+ * `@nocobase/preset-` stripped (see utils/plugin-package `getPluginNameFromPackageName`),
+ * so for this unscoped package it stays `plugin-ai-api` — verified against the running
+ * app, which reports `name: "plugin-ai-api"`. Spelling it `pm.ai-api.configuration` on the
+ * client names a snippet no role can ever hold.
+ *
+ * Shared by both client runtimes so a rename cannot silently desynchronise them.
+ */
+export const AI_API_ACL_SNIPPET = 'pm.plugin-ai-api.configuration';
+
+/**
+ * Child snippet for the per-user LLM permission surface, deliberately separate from
+ * AI_API_ACL_SNIPPET so granting someone the gateway settings does not also let them
+ * hand out model access. Same `plugin-ai-api` prefix constraint as above applies.
+ */
+export const AI_API_USER_PERMISSIONS_SNIPPET = 'pm.plugin-ai-api.user-permissions';

package/src/locale/en-US.json

@@ -1,11 +1,11 @@
-{
-  "AI API Gateway": "AI API Gateway",
-  "Configuration": "Configuration",
-  "Default AI Employee": "Default AI Employee",
-  "Enabled LLM Services": "Enabled LLM Services",
-  "Rate Limit": "Rate Limit",
-  "Save Configuration": "Save Configuration",
-  "Configuration saved": "Configuration saved",
+{
+  "AI API Gateway": "AI API Gateway",
+  "Configuration": "Configuration",
+  "Default AI Employee": "Default AI Employee",
+  "Enabled LLM Services": "Enabled LLM Services",
+  "Rate Limit": "Rate Limit",
+  "Save Configuration": "Save Configuration",
+  "Configuration saved": "Configuration saved",
   "Failed to save configuration": "Failed to save configuration",
   "API mode": "API mode",
   "Direct LLM": "Direct LLM",
@@ -82,5 +82,35 @@
   "Reset": "Reset",
   "Requests": "Requests",
   "Total cost": "Total cost",
-  "Usage records": "Usage records"
+  "Usage records": "Usage records",
+  "Model metadata": "Model metadata",
+  "Add override": "Add override",
+  "Edit override": "Edit override",
+  "Delete this override?": "Delete this override?",
+  "Context window": "Context window",
+  "Max completion tokens": "Max completion tokens",
+  "Owned by": "Owned by",
+  "Display name": "Display name",
+  "Description": "Description",
+  "Leave empty to not override": "Leave empty to not override",
+  "Total input + output token capacity reported to clients.": "Total input + output token capacity reported to clients.",
+  "Maximum output tokens reported to clients.": "Maximum output tokens reported to clients.",
+  "AI API": "AI API",
+  "Allow this role to use the AI API": "Allow this role to use the AI API",
+  "Allow all AI Employees": "Allow all AI Employees",
+  "Select which AI Employees this role may use:": "Select which AI Employees this role may use:",
+  "Select allowed AI Employees": "Select allowed AI Employees",
+  "Max request body size (MB)": "Max request body size (MB)",
+  "Raise this to accept inline base64 images. Base64 adds about 33% to the original file size.": "Raise this to accept inline base64 images. Base64 adds about 33% to the original file size.",
+  "User LLM permissions": "User LLM permissions",
+  "Add permission": "Add permission",
+  "Edit permission": "Edit permission",
+  "Delete this permission?": "Delete this permission?",
+  "Allowed LLM services": "Allowed LLM services",
+  "Allow all models": "Allow all models",
+  "Allowed models": "Allowed models",
+  "No service allowed": "No service allowed",
+  "All models of allowed services": "All models of allowed services",
+  "Users listed here are limited to the services selected below. Users without a record fall back to the general configuration.": "Users listed here are limited to the services selected below. Users without a record fall back to the general configuration.",
+  "Only services also enabled in the general configuration take effect.": "Only services also enabled in the general configuration take effect."
 }

package/src/locale/vi-VN.json

@@ -82,5 +82,35 @@
   "Reset": "Đặt lại",
   "Requests": "Số request",
   "Total cost": "Tổng chi phí",
-  "Usage records": "Chi tiết usage"
+  "Usage records": "Chi tiết usage",
+  "Model metadata": "Metadata model",
+  "Add override": "Thêm override",
+  "Edit override": "Sửa override",
+  "Delete this override?": "Xóa override này?",
+  "Context window": "Context window",
+  "Max completion tokens": "Max completion tokens",
+  "Owned by": "Nhà cung cấp",
+  "Display name": "Tên hiển thị",
+  "Description": "Mô tả",
+  "Leave empty to not override": "Để trống nếu không override",
+  "Total input + output token capacity reported to clients.": "Tổng dung lượng token (input + output) trả về cho client.",
+  "Maximum output tokens reported to clients.": "Số token output tối đa trả về cho client.",
+  "AI API": "AI API",
+  "Allow this role to use the AI API": "Cho phép vai trò này sử dụng AI API",
+  "Allow all AI Employees": "Cho phép tất cả AI Employee",
+  "Select which AI Employees this role may use:": "Chọn AI Employee mà vai trò này được dùng:",
+  "Select allowed AI Employees": "Chọn AI Employee được phép",
+  "Max request body size (MB)": "Giới hạn kích thước request body (MB)",
+  "Raise this to accept inline base64 images. Base64 adds about 33% to the original file size.": "Tăng giá trị này để nhận ảnh base64 gửi trực tiếp. Base64 làm tăng khoảng 33% so với kích thước tệp gốc.",
+  "User LLM permissions": "Phân quyền LLM theo người dùng",
+  "Add permission": "Thêm phân quyền",
+  "Edit permission": "Sửa phân quyền",
+  "Delete this permission?": "Xoá phân quyền này?",
+  "Allowed LLM services": "Dịch vụ LLM được phép",
+  "Allow all models": "Cho phép tất cả model",
+  "Allowed models": "Model được phép",
+  "No service allowed": "Không được phép dịch vụ nào",
+  "All models of allowed services": "Tất cả model của các dịch vụ được phép",
+  "Users listed here are limited to the services selected below. Users without a record fall back to the general configuration.": "Người dùng có trong danh sách này chỉ được dùng các dịch vụ được chọn bên dưới. Người dùng không có bản ghi sẽ dùng theo cấu hình chung.",
+  "Only services also enabled in the general configuration take effect.": "Chỉ những dịch vụ đồng thời được bật trong cấu hình chung mới có hiệu lực."
 }

package/src/locale/zh-CN.json

@@ -82,5 +82,35 @@
   "Reset": "重置",
   "Requests": "请求数",
   "Total cost": "总费用",
-  "Usage records": "用量记录"
+  "Usage records": "用量记录",
+  "Model metadata": "模型元数据",
+  "Add override": "添加覆盖",
+  "Edit override": "编辑覆盖",
+  "Delete this override?": "确认删除此覆盖？",
+  "Context window": "上下文窗口",
+  "Max completion tokens": "最大输出 token 数",
+  "Owned by": "所属方",
+  "Display name": "显示名称",
+  "Description": "描述",
+  "Leave empty to not override": "留空则不覆盖",
+  "Total input + output token capacity reported to clients.": "返回给客户端的输入+输出 token 总容量。",
+  "Maximum output tokens reported to clients.": "返回给客户端的最大输出 token 数。",
+  "AI API": "AI API",
+  "Allow this role to use the AI API": "允许此角色使用 AI API",
+  "Allow all AI Employees": "允许所有 AI 员工",
+  "Select which AI Employees this role may use:": "选择此角色可使用的 AI 员工：",
+  "Select allowed AI Employees": "选择允许的 AI 员工",
+  "Max request body size (MB)": "请求体大小上限（MB）",
+  "Raise this to accept inline base64 images. Base64 adds about 33% to the original file size.": "调高此值以接收内联 base64 图片。base64 编码会使体积增加约 33%。",
+  "User LLM permissions": "用户 LLM 权限",
+  "Add permission": "添加权限",
+  "Edit permission": "编辑权限",
+  "Delete this permission?": "确定删除此权限？",
+  "Allowed LLM services": "允许的 LLM 服务",
+  "Allow all models": "允许所有模型",
+  "Allowed models": "允许的模型",
+  "No service allowed": "未允许任何服务",
+  "All models of allowed services": "允许服务下的所有模型",
+  "Users listed here are limited to the services selected below. Users without a record fall back to the general configuration.": "此处列出的用户仅能使用下方所选的服务；没有记录的用户按通用配置处理。",
+  "Only services also enabled in the general configuration take effect.": "仅当服务同时在通用配置中启用时才会生效。"
 }