chore: directory migration - gateway→server, web→client/electron

client/electron/test/components/BudgetChip.test.tsx

@@ -0,0 +1,80 @@
+import { describe, expect, it } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import React from 'react';
+
+import { BudgetChip } from '../../src/components/WorkCard';
+
+/**
+ * 往返预算徽标。
+ *
+ * 它是「这个任务还剩几个来回」的唯一视觉提示，两件事必须对：
+ *   - 显示的是**剩余**而不是已用（人做决定看的是「还能问几次」）
+ *   - 0 = 不限时**不显示**，而不是显示「0/0」
+ */
+describe('BudgetChip 预算渲染', () => {
+  it('显示剩余数而不是已用数', () => {
+    render(React.createElement(BudgetChip, { max: 20, used: 3 }));
+
+    // 20 个上限、用了 3 个 → 剩 17。显示 3/20 会让人以为快用完了
+    expect(screen.getByText('17/20')).toBeInTheDocument();
+  });
+
+  it('max 为 0（不限）时完全不渲染', () => {
+    const { container } = render(React.createElement(BudgetChip, { max: 0, used: 0 }));
+
+    // 「0/0」或「不限」对每张卡片都成立，等于纯噪声
+    expect(container.firstChild).toBeNull();
+  });
+
+  it('max 为负数时也不渲染（脏数据兜底）', () => {
+    const { container } = render(React.createElement(BudgetChip, { max: -1, used: 0 }));
+    expect(container.firstChild).toBeNull();
+  });
+
+  it('用超时剩余按 0 显示，不出现负数', () => {
+    render(React.createElement(BudgetChip, { max: 5, used: 8 }));
+
+    // 「-3/5」看起来像 bug，而实际情形（免配额转发不计数、人手动下调过上限）是合法的
+    expect(screen.getByText('0/5')).toBeInTheDocument();
+  });
+
+  it('剩余为 0 时转红并标注「已用尽」', () => {
+    render(React.createElement(BudgetChip, { max: 5, used: 5 }));
+
+    const chip = screen.getByText('0/5').closest('span')!;
+    expect(chip.className).toContain('bg-red-100');
+    expect(chip.getAttribute('title')).toContain('已用尽');
+  });
+
+  it('剩余 1 个时转橙 —— 那是需要人介入的时刻', () => {
+    render(React.createElement(BudgetChip, { max: 20, used: 19 }));
+
+    const chip = screen.getByText('1/20').closest('span')!;
+    // 要么加预算，要么让它收尾；这一步不提示的话下一封信就被挡住了
+    expect(chip.className).toContain('bg-orange-100');
+  });
+
+  it('余量充足时用中性灰，不抢注意力', () => {
+    render(React.createElement(BudgetChip, { max: 20, used: 2 }));
+
+    const chip = screen.getByText('18/20').closest('span')!;
+    expect(chip.className).toContain('bg-gray-100');
+    expect(chip.className).not.toContain('red');
+    expect(chip.className).not.toContain('orange');
+  });
+
+  it('title 里带已用/上限，供悬停查看细节', () => {
+    render(React.createElement(BudgetChip, { max: 20, used: 7 }));
+
+    const chip = screen.getByText('13/20').closest('span')!;
+    // 徽标上只有剩余，具体用了几个放在 title 里 —— 徽标要窄
+    expect(chip.getAttribute('title')).toContain('已用 7/20');
+  });
+
+  it('剩余 2 个时还不转橙（阈值是 <= 1）', () => {
+    render(React.createElement(BudgetChip, { max: 10, used: 8 }));
+
+    const chip = screen.getByText('2/10').closest('span')!;
+    expect(chip.className).toContain('bg-gray-100');
+  });
+});