@ploykit/ui 0.7.4 → 0.8.0

package/src/pages/admin/__tests__/AdminSettingsPage.test.tsx

@@ -34,6 +34,7 @@ vi.mock('@ploykit/client', () => ({
 vi.mock('../../../components/toast', () => ({ toast: toastMocks }));
 
 const ENVELOPE = {
+  mail_mode: 'smtp',
   items: { banner_text: '今晚例行维护', banner_kind: 'warn' },
   effective: {
     banner_text: '今晚例行维护',
@@ -74,13 +75,20 @@ beforeEach(() => {
 });
 
 describe('AdminSettingsPage', () => {
-  it('渲染四卡并按 effective 回填表单（公告预览同步）', async () => {
+  it('渲染各卡并按 effective 回填表单（公告预览同步）', async () => {
     renderPage();
     
     expect(await screen.findByText('顶部公告横条')).toBeInTheDocument();
     expect(screen.getByText('全站"维护中"提示条')).toBeInTheDocument();
     expect(screen.getByText('注册开关与域名白名单')).toBeInTheDocument();
+    expect(
+      screen.getByText('每用户 / 每 IP 限流与豁免名单'),
+    ).toBeInTheDocument();
+    expect(screen.getByText('SMTP 发信配置')).toBeInTheDocument();
+    expect(screen.getByText('搜索引擎站点验证')).toBeInTheDocument();
     expect(screen.getByText('发送测试邮件')).toBeInTheDocument();
+    // 基座信封无 oauth 字段 → 登录方式卡不渲染
+    expect(screen.queryByText('OAuth 第三方登录')).not.toBeInTheDocument();
     
     expect(screen.getByLabelText('公告文本')).toHaveValue('今晚例行维护');
     expect(screen.getByRole('status')).toHaveTextContent('今晚例行维护');
@@ -257,4 +265,215 @@ describe('AdminSettingsPage', () => {
     expect(msg).toContain('成功 2/3');
     expect(msg).toContain('每 IP 限流');
   });
+
+  describe('SMTP 卡（UP-1）', () => {
+    const SMTP_EFFECTIVE = {
+      smtp_host: 'smtp.example.com',
+      smtp_port: '465',
+      smtp_user: 'api',
+      smtp_pass: '******',
+      smtp_from: 'no-reply@example.com',
+    };
+    function renderWithSmtp() {
+      mockedGet.mockResolvedValueOnce({
+        ...ENVELOPE,
+        effective: { ...ENVELOPE.effective, ...SMTP_EFFECTIVE },
+      });
+      return renderPage();
+    }
+
+    it('掩码回显不回填：smtp_pass 回显 "******"，密码框保持空且 placeholder 为掩码', async () => {
+      renderWithSmtp();
+      expect(await screen.findByText('SMTP 发信配置')).toBeInTheDocument();
+      expect(screen.getByLabelText('SMTP 服务器')).toHaveValue(
+        'smtp.example.com',
+      );
+      expect(screen.getByLabelText('端口（留空 = 缺省 587）')).toHaveValue(
+        '465',
+      );
+      expect(screen.getByLabelText('SMTP 用户名')).toHaveValue('api');
+      expect(screen.getByLabelText('发件人地址')).toHaveValue(
+        'no-reply@example.com',
+      );
+      const pass = screen.getByLabelText('SMTP 密码（留空 = 不修改）');
+      expect(pass).toHaveValue('');
+      expect(pass).toHaveAttribute('placeholder', '******');
+      expect(pass).toHaveAttribute('type', 'password');
+      // 卡头 Badge 显示 mail_mode
+      expect(screen.getByText('SMTP 直发')).toBeInTheDocument();
+    });
+
+    it('保存 → PUT 5 键（密码原文只在用户主动输入时提交）', async () => {
+      renderWithSmtp();
+      await screen.findByText('SMTP 发信配置');
+
+      fireEvent.change(screen.getByLabelText('SMTP 服务器'), {
+        target: { value: 'smtp2.example.com' },
+      });
+      fireEvent.change(screen.getByLabelText('端口（留空 = 缺省 587）'), {
+        target: { value: '587' },
+      });
+      fireEvent.change(screen.getByLabelText('SMTP 用户名'), {
+        target: { value: 'api2' },
+      });
+      fireEvent.change(screen.getByLabelText('SMTP 密码（留空 = 不修改）'), {
+        target: { value: 's3cret' },
+      });
+      fireEvent.change(screen.getByLabelText('发件人地址'), {
+        target: { value: 'noreply@example.com' },
+      });
+      fireEvent.click(screen.getByRole('button', { name: '保存 SMTP 配置' }));
+
+      await waitFor(() => expect(mockedPut).toHaveBeenCalledTimes(5));
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_host', {
+        value: 'smtp2.example.com',
+      });
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_port', {
+        value: '587',
+      });
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_user', {
+        value: 'api2',
+      });
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_pass', {
+        value: 's3cret',
+      });
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_from', {
+        value: 'noreply@example.com',
+      });
+    });
+
+    it('空 pass 跳过提交：密码留空保存 → 只 PUT 其余 4 键，绝不提交空/掩码密码', async () => {
+      renderWithSmtp();
+      await screen.findByText('SMTP 发信配置');
+
+      // 不动密码框（state 恒空），直接保存其余四键
+      fireEvent.click(screen.getByRole('button', { name: '保存 SMTP 配置' }));
+
+      await waitFor(() => expect(mockedPut).toHaveBeenCalledTimes(4));
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_host', {
+        value: 'smtp.example.com',
+      });
+      expect(mockedPut).toHaveBeenCalledWith('/api/admin/settings/smtp_from', {
+        value: 'no-reply@example.com',
+      });
+      expect(mockedPut).not.toHaveBeenCalledWith(
+        '/api/admin/settings/smtp_pass',
+        expect.anything(),
+      );
+    });
+  });
+
+  describe('站长验证卡（UP-2）', () => {
+    it('空值显示未配置徽章；粘贴完整 meta 标签保存 → PUT site_verification_meta 原文', async () => {
+      mockedGet.mockResolvedValueOnce({
+        ...ENVELOPE,
+        effective: {
+          ...ENVELOPE.effective,
+          site_verification_meta: '',
+        },
+      });
+      renderPage();
+      expect(
+        await screen.findByText('搜索引擎站点验证'),
+      ).toBeInTheDocument();
+      expect(screen.getByText('未配置')).toBeInTheDocument();
+
+      fireEvent.change(screen.getByLabelText(/验证标记/), {
+        target: {
+          value:
+            '<meta name="google-site-verification" content="abc123XYZ" />',
+        },
+      });
+      // 有非空值即点亮"已注入"（同公告卡"展示中"的即时徽章逻辑）
+      expect(screen.getByText('已注入')).toBeInTheDocument();
+
+      fireEvent.click(
+        screen.getByRole('button', { name: '保存验证配置' }),
+      );
+      await waitFor(() => expect(mockedPut).toHaveBeenCalledTimes(1));
+      expect(mockedPut).toHaveBeenCalledWith(
+        '/api/admin/settings/site_verification_meta',
+        {
+          value: '<meta name="google-site-verification" content="abc123XYZ" />',
+        },
+      );
+    });
+  });
+
+  describe('OAuth 只读卡（UP-6）', () => {
+    const OAUTH = [
+      {
+        name: 'google',
+        callback_url: 'https://example.com/auth/oauth/google/callback',
+      },
+      {
+        name: 'github',
+        callback_url: 'https://example.com/auth/oauth/github/callback',
+      },
+    ];
+
+    it('有 providers → 渲染名称徽章 + mono 回调地址 + 复制按钮 + 反代转发提示', async () => {
+      mockedGet.mockResolvedValueOnce({ ...ENVELOPE, oauth: OAUTH });
+      renderPage();
+      expect(
+        await screen.findByText('OAuth 第三方登录'),
+      ).toBeInTheDocument();
+      expect(screen.getByText('google')).toBeInTheDocument();
+      expect(screen.getByText('github')).toBeInTheDocument();
+      expect(
+        screen.getByText('https://example.com/auth/oauth/google/callback'),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole('button', { name: '复制 google 回调地址' }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByText(/按站点 base URL 推算的期望值/),
+      ).toBeInTheDocument();
+      expect(screen.getByText(/X-Forwarded-Proto/)).toBeInTheDocument();
+    });
+
+    it('复制按钮 → clipboard.writeText + toast 反馈', async () => {
+      const writeText = vi.fn().mockResolvedValue(undefined);
+      vi.stubGlobal('navigator', { clipboard: { writeText } });
+      mockedGet.mockResolvedValueOnce({
+        ...ENVELOPE,
+        oauth: [OAUTH[0]],
+      });
+      renderPage();
+      await screen.findByText('OAuth 第三方登录');
+      fireEvent.click(
+        screen.getByRole('button', { name: '复制 google 回调地址' }),
+      );
+      await waitFor(() =>
+        expect(writeText).toHaveBeenCalledWith(
+          'https://example.com/auth/oauth/google/callback',
+        ),
+      );
+      await waitFor(() =>
+        expect(toastMocks.success).toHaveBeenCalledWith(
+          'google 回调地址已复制',
+        ),
+      );
+      vi.unstubAllGlobals();
+    });
+
+    it('空数组 → 渲染空态提示（用 GOOGLE/GITHUB_CLIENT_ID/SECRET 环境变量启用）', async () => {
+      mockedGet.mockResolvedValueOnce({ ...ENVELOPE, oauth: [] });
+      renderPage();
+      await screen.findByText('OAuth 第三方登录');
+      expect(screen.getByText('未启用')).toBeInTheDocument();
+      expect(screen.getByText(/GOOGLE_CLIENT_ID/)).toBeInTheDocument();
+      expect(screen.getByText(/GITHUB_CLIENT_ID/)).toBeInTheDocument();
+    });
+
+    it('信封无 oauth 字段 → 整卡不渲染（后端未接线时静默降级）', async () => {
+      renderPage();
+      await screen.findByText('顶部公告横条');
+      expect(screen.queryByText('OAuth 第三方登录')).not.toBeInTheDocument();
+      expect(screen.queryByText('登录方式')).not.toBeInTheDocument();
+      expect(
+        screen.queryByRole('button', { name: /复制.*回调地址/ }),
+      ).not.toBeInTheDocument();
+    });
+  });
 });

package/src/pages/admin/__tests__/PlansPage.test.tsx

@@ -0,0 +1,214 @@
+
+import '@testing-library/jest-dom/vitest';
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+
+const mockedGet = vi.hoisted(() => vi.fn());
+const mockedPatch = vi.hoisted(() => vi.fn());
+vi.mock('@ploykit/client', () => ({
+  api: {
+    get: mockedGet,
+    put: vi.fn(),
+    post: vi.fn(),
+    patch: mockedPatch,
+    delete: vi.fn(),
+  },
+  ApiError: class ApiError extends Error {
+    status: number;
+    code: string;
+    details?: unknown;
+    constructor(
+      status: number,
+      code: string,
+      message: string,
+      details?: unknown,
+    ) {
+      super(message);
+      this.status = status;
+      this.code = code;
+      this.details = details;
+    }
+  },
+}));
+
+import { ApiError } from '@ploykit/client';
+import { PlansPage } from '../PlansPage';
+
+const PLANS = {
+  items: ['free', 'pro'],
+  plans: [
+    {
+      code: 'free',
+      name: 'Free',
+      currency: 'CNY',
+      trial_days: 0,
+      sort_no: 1,
+      limits: { workspaces: 1, tasks_monthly: 100 },
+    },
+    {
+      code: 'pro',
+      name: 'Pro',
+      currency: 'USD',
+      trial_days: 14,
+      sort_no: 2,
+      limits: { workspaces: -1, price_monthly_cents: 990 },
+    },
+  ],
+};
+
+function renderPage() {
+  const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } });
+  return render(
+    <QueryClientProvider client={qc}>
+      <PlansPage />
+    </QueryClientProvider>,
+  );
+}
+
+function expandPro() {
+  fireEvent.click(screen.getByRole('button', { name: '编辑套餐 pro' }));
+}
+
+beforeEach(() => {
+  mockedGet.mockReset().mockImplementation(async (path: string) => {
+    if (path.startsWith('/api/admin/plans')) return PLANS;
+    throw new Error('unexpected GET ' + path);
+  });
+  mockedPatch.mockReset().mockResolvedValue(PLANS.plans[1]);
+});
+
+describe('PlansPage（UP-5 套餐编辑）', () => {
+  it('渲染套餐列表：free/pro 两卡折叠态（名称/代码/币种/排序可见，表单未挂载）', async () => {
+    renderPage();
+    expect(await screen.findByText('Free')).toBeInTheDocument();
+    expect(screen.getByText('Pro')).toBeInTheDocument();
+    expect(screen.getByText('free')).toBeInTheDocument();
+    expect(screen.getByText('pro')).toBeInTheDocument();
+    expect(screen.getByText('CNY')).toBeInTheDocument();
+    expect(screen.getByText('USD')).toBeInTheDocument();
+    // 折叠态：编辑表单不存在
+    expect(screen.queryByLabelText('名称')).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole('button', { name: '保存' }),
+    ).not.toBeInTheDocument();
+  });
+
+  it('展开 pro 编辑保存 → PATCH /api/admin/plans/pro 全量 body；-1 显示 Unlimited 提示', async () => {
+    renderPage();
+    await screen.findByText('Pro');
+    expandPro();
+
+    // workspaces: -1 → Unlimited（无限）提示；price_monthly_cents → 价格（单位：分）
+    expect(await screen.findByText('Unlimited（无限）')).toBeInTheDocument();
+    expect(screen.getByText('价格（单位：分）')).toBeInTheDocument();
+    // workspaces 是 billing 未登记键 → 高级键弱提示
+    expect(screen.getAllByText('高级键')).toHaveLength(1);
+
+    fireEvent.change(screen.getByLabelText('名称'), {
+      target: { value: '专业版' },
+    });
+    fireEvent.click(screen.getByRole('button', { name: '保存' }));
+
+    await waitFor(() =>
+      expect(mockedPatch).toHaveBeenCalledWith('/api/admin/plans/pro', {
+        name: '专业版',
+        currency: 'USD',
+        sort_no: 2,
+        limits: { workspaces: -1, price_monthly_cents: 990 },
+      }),
+    );
+  });
+
+  it('保存 404（plan 不存在）→ 就地展示后端消息', async () => {
+    mockedPatch.mockRejectedValueOnce(
+      new ApiError(404, 'not_found', 'plan not found'),
+    );
+    renderPage();
+    await screen.findByText('Pro');
+    expandPro();
+    fireEvent.click(await screen.findByRole('button', { name: '保存' }));
+
+    expect(await screen.findByRole('alert')).toHaveTextContent(
+      '不存在或无权访问',
+    );
+  });
+
+  it('保存 400（校验失败）→ 就地展示后端校验消息', async () => {
+    mockedPatch.mockRejectedValueOnce(
+      new ApiError(
+        400,
+        'E_VALIDATION',
+        'validation failed',
+        'currency: must be 3 uppercase letters',
+      ),
+    );
+    renderPage();
+    await screen.findByText('Pro');
+    expandPro();
+    fireEvent.click(await screen.findByRole('button', { name: '保存' }));
+
+    expect(await screen.findByRole('alert')).toHaveTextContent(
+      'currency: must be 3 uppercase letters',
+    );
+  });
+
+  it('limits 加行：添加 credits=100 并保存 → body 含新键；未知键给高级键提示', async () => {
+    renderPage();
+    await screen.findByText('Pro');
+    expandPro();
+
+    const keys = () => screen.getAllByLabelText('限制键名');
+    expect(await screen.findAllByLabelText('限制键名')).toHaveLength(2);
+
+    fireEvent.click(screen.getByRole('button', { name: '添加限制键' }));
+    expect(keys()).toHaveLength(3);
+
+    fireEvent.change(keys()[2], { target: { value: 'credits' } });
+    fireEvent.change(screen.getAllByLabelText('限制值')[2], {
+      target: { value: '100' },
+    });
+    // workspaces + credits 两个未登记键 → 两个高级键提示
+    expect(screen.getAllByText('高级键')).toHaveLength(2);
+
+    fireEvent.click(screen.getByRole('button', { name: '保存' }));
+    await waitFor(() =>
+      expect(mockedPatch).toHaveBeenCalledWith('/api/admin/plans/pro', {
+        name: 'Pro',
+        currency: 'USD',
+        sort_no: 2,
+        limits: { workspaces: -1, price_monthly_cents: 990, credits: 100 },
+      }),
+    );
+  });
+
+  it('limits 减行：删除空行与 workspaces 行后保存 → body 不再含该键', async () => {
+    renderPage();
+    await screen.findByText('Pro');
+    expandPro();
+
+    const keys = () => screen.getAllByLabelText('限制键名');
+    expect(await screen.findAllByLabelText('限制键名')).toHaveLength(2);
+
+    // 误触加行再删行：整行留空不阻塞保存，也不进 body
+    fireEvent.click(screen.getByRole('button', { name: '添加限制键' }));
+    expect(keys()).toHaveLength(3);
+    fireEvent.click(screen.getByRole('button', { name: '删除限制 3' }));
+    expect(keys()).toHaveLength(2);
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '删除限制 workspaces' }),
+    );
+    expect(keys()).toHaveLength(1);
+
+    fireEvent.click(screen.getByRole('button', { name: '保存' }));
+    await waitFor(() =>
+      expect(mockedPatch).toHaveBeenCalledWith('/api/admin/plans/pro', {
+        name: 'Pro',
+        currency: 'USD',
+        sort_no: 2,
+        limits: { price_monthly_cents: 990 },
+      }),
+    );
+  });
+});

package/src/pages/workspace/BillingPage.tsx

@@ -123,7 +123,10 @@ export function BillingPage({ channel = 'stripe' }: BillingPageProps = {}) {
       : null
   const orders: PKOrder[] = subscription?.orders ?? []
   const currentPlanCode = subscription?.plan_code ?? null
-  const sortedPlans = [...plans].sort((a, b) => a.sort_no - b.sort_no)
+  // UP-8/D4 (docs/plan-upstream-shuijing-admin-billing.md): filter by price-key capability, not code-prefix — a plan with neither price_monthly_cents nor price_yearly_cents (one_time pack) must not render as a ¥0 subscription card.
+  const sortedPlans = [...plans]
+    .filter((p) => p.limits.price_monthly_cents !== undefined || p.limits.price_yearly_cents !== undefined)
+    .sort((a, b) => a.sort_no - b.sort_no)
 
   
   
@@ -286,6 +289,10 @@ export function BillingPage({ channel = 'stripe' }: BillingPageProps = {}) {
           </p>
         )}
 
+        {sortedPlans.length === 0 && (
+          <PageEmpty label="暂无可订阅套餐" hint="站点尚未配置按月或按年订阅的套餐。" />
+        )}
+
         <div className="grid gap-4 lg:grid-cols-3">
           {sortedPlans.map((plan) => {
             const isCurrent = plan.code === currentPlanCode

package/src/pages/workspace/__tests__/BillingPage.test.tsx

@@ -66,10 +66,10 @@ function SearchProbe() {
   return <span data-testid="search-params">{sp.toString()}</span>
 }
 
-function renderPage(initialUrl = '/billing') {
+function renderPage(initialUrl = '/billing', plansOverride?: typeof plans) {
   billingMocks.useBilling.mockReturnValue({
     subscription: { plan_code: 'free', orders },
-    plans,
+    plans: plansOverride ?? plans,
     loading: false,
     refresh: vi.fn(),
   })
@@ -228,6 +228,36 @@ describe('BillingPage', () => {
   })
 })
 
+describe('BillingPage UP-8：one_time 套餐过滤（D4 price-key capability，非 code 前缀）', () => {
+  const packOnly = { code: 'pack_100', name: '积分包 100', limits: { tasks_monthly: 100, price_one_time_cents: 990 }, sort_no: 2 }
+
+  it('仅含 price_one_time_cents 的 plan 不渲染进订阅网格（capability 判据，不看 code 前缀）', () => {
+    renderPage('/billing', [
+      { code: 'free', name: 'Free', limits: { tasks_monthly: 100, price_monthly_cents: 0, price_yearly_cents: 0 }, sort_no: 1 },
+      { code: 'bundle_200', name: 'Bundle 200', limits: { tasks_monthly: 200, price_one_time_cents: 1990 }, sort_no: 3 },
+      packOnly,
+    ])
+    expect(screen.getByText('Free')).toBeInTheDocument()
+    expect(screen.queryByText('积分包 100')).not.toBeInTheDocument()
+    expect(screen.queryByText('Bundle 200')).not.toBeInTheDocument()
+  })
+
+  it('monthly + one_time 双价 plan 照常渲染月付卡（价格取订阅键）', () => {
+    renderPage('/billing', [
+      { code: 'pro', name: 'Pro', limits: { tasks_monthly: 10000, price_monthly_cents: 990, price_yearly_cents: 9900, price_one_time_cents: 499 }, sort_no: 1 },
+    ])
+    expect(screen.getByText('Pro')).toBeInTheDocument()
+    expect(screen.getByText('¥9.90')).toBeInTheDocument()
+    expect(screen.getByRole('button', { name: '升级' })).toBeEnabled()
+  })
+
+  it('全部 plan 被过滤（仅 one_time 包）→ 空态成立', () => {
+    renderPage('/billing', [packOnly])
+    expect(screen.getByText('暂无可订阅套餐')).toBeInTheDocument()
+    expect(screen.queryByText('积分包 100')).not.toBeInTheDocument()
+  })
+})
+
 describe('BillingPage B1/G4：manual 渠道接线（渠道表动态生成）', () => {
   it('/config 只注册 manual → 渠道表仅含 manual，未注册渠道不出现；升级可用且 POST channel=manual', async () => {
     clientGet.mockResolvedValue({ billing_channels: ['manual'] })