fix(web): disable quota-reached create actions (#2389)

* fix(web): disable quota-reached create actions * fix(web): close quota review gaps --------- Co-authored-by: dadachann <185672915+dadachann@users.noreply.github.com>
2026-08-09 04:40:57 +00:00 · 2026-08-03 19:08:47 +08:00
parent 3101c9be6a
commit f0b2c103c1
21 changed files with 1037 additions and 293 deletions
@@ -0,0 +1,148 @@
+import { expect, test } from '@playwright/test';
+import { installLangBotApiMocks } from './fixtures/langbot-api';
+
+function wrapped(data: unknown) {
+  return JSON.stringify({
+    code: 0,
+    message: 'ok',
+    data,
+    timestamp: Date.now(),
+  });
+}
+
+async function fulfill(
+  route: Parameters<Parameters<import('@playwright/test').Page['route']>[1]>[0],
+  data: unknown,
+) {
+  await route.fulfill({
+    status: 200,
+    contentType: 'application/json',
+    body: wrapped(data),
+  });
+}
+
+test('quota-reached create actions are disabled and explain the current limit', async ({
+  page,
+}) => {
+  await installLangBotApiMocks(page, { authenticated: true });
+
+  await page.route('**/api/v1/system/info', (route) =>
+    fulfill(route, {
+      debug: false,
+      version: 'quota-e2e',
+      edition: 'community',
+      cloud_service_url: 'https://space.langbot.app',
+      enable_marketplace: true,
+      allow_modify_login_info: true,
+      disable_models_service: false,
+      limitation: {
+        max_bots: 2,
+        max_pipelines: 3,
+        max_extensions: 3,
+        max_knowledge_bases: 2,
+      },
+      outbound_ips: [],
+      wizard_status: 'completed',
+      wizard_progress: null,
+    }),
+  );
+  await page.route('**/api/v1/platform/bots**', (route) =>
+    fulfill(route, {
+      bots: Array.from({ length: 2 }, (_, index) => ({
+        uuid: `bot-${index}`,
+        name: `Bot ${index + 1}`,
+        description: '',
+        adapter: 'aiocqhttp',
+        enable: true,
+        updated_at: new Date().toISOString(),
+      })),
+    }),
+  );
+  await page.route('**/api/v1/pipelines**', (route) =>
+    fulfill(route, {
+      pipelines: Array.from({ length: 3 }, (_, index) => ({
+        uuid: `pipeline-${index}`,
+        name: `Pipeline ${index + 1}`,
+        description: '',
+        emoji: '⚙️',
+        updated_at: new Date().toISOString(),
+      })),
+    }),
+  );
+  await page.route('**/api/v1/knowledge/bases**', (route) =>
+    fulfill(route, {
+      bases: Array.from({ length: 2 }, (_, index) => ({
+        uuid: `kb-${index}`,
+        name: `Knowledge ${index + 1}`,
+        description: '',
+        emoji: '📚',
+        updated_at: new Date().toISOString(),
+      })),
+    }),
+  );
+  await page.route('**/api/v1/plugins**', (route) =>
+    fulfill(route, { plugins: [] }),
+  );
+  await page.route('**/api/v1/mcp/servers**', (route) =>
+    fulfill(route, {
+      servers: Array.from({ length: 3 }, (_, index) => ({
+        name: `mcp-${index}`,
+        mode: 'http',
+        enable: true,
+        runtime_info: { status: 'connected' },
+      })),
+    }),
+  );
+  await page.route('**/api/v1/skills**', (route) =>
+    fulfill(route, { skills: [] }),
+  );
+
+  await page.goto('/home/bots');
+
+  const botCreate = page.getByRole('button', {
+    name: 'Create Bots',
+    exact: true,
+  });
+  const pipelineCreate = page.getByRole('button', {
+    name: 'Create Pipelines',
+    exact: true,
+  });
+  const knowledgeCreate = page.getByRole('button', {
+    name: 'Create Knowledge',
+    exact: true,
+  });
+  const addExtension = page.getByRole('button', {
+    name: 'Add Extension',
+    exact: true,
+  });
+
+  await expect(botCreate).toBeDisabled();
+  await expect(pipelineCreate).toBeDisabled();
+  await expect(knowledgeCreate).toBeDisabled();
+  await expect(addExtension).toBeDisabled();
+
+  const botQuotaTrigger = botCreate.locator('..');
+  await botQuotaTrigger.hover();
+  await expect(
+    page.getByText(
+      'The Bots limit (2) for this workspace has been reached. Delete one existing item before creating another.',
+    ),
+  ).toBeVisible();
+  await botQuotaTrigger.focus();
+  await expect(botQuotaTrigger).toBeFocused();
+  await expect(
+    page.getByText(
+      'The Bots limit (2) for this workspace has been reached. Delete one existing item before creating another.',
+    ),
+  ).toBeVisible();
+
+  await page.goto('/home/add-extension');
+  const manualAdd = page.getByRole('button', { name: 'Manual Add' });
+  await expect(manualAdd).toBeDisabled();
+  await manualAdd.locator('..').hover();
+  await expect(
+    page.getByText(
+      'The Extensions limit (3) for this workspace has been reached. Delete one existing item before creating another.',
+    ),
+  ).toBeVisible();
+});
@@ -0,0 +1,111 @@
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import test from 'node:test';
+
+const root = process.cwd();
+const quotaPath = path.join(
+  root,
+  'src/app/home/components/workspace-quota/useWorkspaceQuotaStatus.ts',
+);
+const sidebarPath = path.join(
+  root,
+  'src/app/home/components/home-sidebar/HomeSidebar.tsx',
+);
+const tooltipPath = path.join(
+  root,
+  'src/app/home/components/workspace-quota/WorkspaceQuotaTooltip.tsx',
+);
+const addExtensionPath = path.join(root, 'src/app/home/add-extension/page.tsx');
+const marketPath = path.join(
+  root,
+  'src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx',
+);
+const marketCardPath = path.join(
+  root,
+  'src/app/home/plugins/components/plugin-market/plugin-market-card/PluginMarketCardComponent.tsx',
+);
+const recommendationPath = path.join(
+  root,
+  'src/app/home/plugins/components/plugin-market/RecommendationLists.tsx',
+);
+const zhPath = path.join(root, 'src/i18n/locales/zh-Hans.ts');
+
+test('workspace quota hook exposes reached states for every creatable resource', () => {
+  assert.equal(
+    fs.existsSync(quotaPath),
+    true,
+    'workspace quota hook is missing',
+  );
+  const source = fs.readFileSync(quotaPath, 'utf8');
+  for (const token of [
+    'botsReached',
+    'pipelinesReached',
+    'knowledgeBasesReached',
+    'extensionsReached',
+    'max_bots',
+    'max_pipelines',
+    'max_knowledge_bases',
+    'max_extensions',
+  ]) {
+    assert.match(source, new RegExp(token));
+  }
+});
+
+test('sidebar quota-disables create controls and renders a tooltip', () => {
+  const source = fs.readFileSync(sidebarPath, 'utf8');
+  const tooltip = fs.readFileSync(tooltipPath, 'utf8');
+  assert.match(source, /useWorkspaceQuotaStatus/);
+  assert.match(source, /quota\.disabled/);
+  assert.match(source, /disabled=\{quota\.disabled\}/);
+  assert.match(source, /WorkspaceQuotaTooltip/);
+  assert.match(tooltip, /TooltipContent/);
+  assert.match(tooltip, /limitation\.createDisabledTooltip/);
+  assert.match(tooltip, /limitation\.quotaLoadingTooltip/);
+  assert.match(tooltip, /tabIndex=\{0\}/);
+  assert.match(source, /config\.id === 'add-extension'/);
+});
+
+test('add-extension page disables all install entry points at the quota', () => {
+  const page = fs.readFileSync(addExtensionPath, 'utf8');
+  const market = fs.readFileSync(marketPath, 'utf8');
+  const card = fs.readFileSync(marketCardPath, 'utf8');
+  const recommendations = fs.readFileSync(recommendationPath, 'utf8');
+
+  assert.match(page, /extensionsReached/);
+  assert.match(page, /installDisabled=\{extensionsReached\}/);
+  assert.match(page, /disabled=\{extensionsReached/);
+  assert.match(page, /limitation\.createDisabledTooltip/);
+  assert.match(market, /installDisabled/);
+  assert.match(card, /installDisabled/);
+  assert.match(card, /disabled=\{installDisabled\}/);
+  assert.match(card, /TooltipContent/);
+  assert.match(recommendations, /installDisabled=\{installDisabled\}/);
+  assert.match(
+    recommendations,
+    /installDisabledTooltip=\{installDisabledTooltip\}/,
+  );
+  assert.match(page, /quota=\{extensionQuota\}/);
+});
+
+test('extension confirmation checks fail closed and enter an in-flight state first', () => {
+  const page = fs.readFileSync(addExtensionPath, 'utf8');
+
+  assert.match(page, /limitation\.quotaCheckFailed/);
+  assert.doesNotMatch(page, /If we can't check, let backend handle it/);
+  assert.match(
+    page,
+    /setGithubInstallStatus\(GithubInstallStatus\.INSTALLING\);\s+if \(!\(await checkExtensionsLimit\(\)\)\)/,
+  );
+  assert.match(
+    page,
+    /setGithubInstallStatus\(GithubInstallStatus\.SKILL_INSTALLING\);\s+if \(!\(await checkExtensionsLimit\(\)\)\)/,
+  );
+});
+
+test('quota tooltip copy is localized in Simplified Chinese', () => {
+  const source = fs.readFileSync(zhPath, 'utf8');
+  assert.match(source, /createDisabledTooltip/);
+  assert.match(source, /已达到.*上限/);
+  assert.match(source, /删除.*后再/);
+});