p-sw/CodexDash
1
0
Fork 0
Code Issues Releases Wiki Activity

[verified] refactor: remove dashboard payload panels

Browse Source
This commit is contained in:
Shinwoo PARK
2026-05-09 16:32:30 +09:00
parent 89983fd84b
commit c763926b32
5 changed files with 107 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
apps/web/src/App.tsx
View File

@@ -53,7 +53,6 @@ import {
import { Progress } from '@/components/ui/progress';
import { Separator } from '@/components/ui/separator';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { JsonViewer } from '@/components/json-viewer';
const registerSchema = z.object({
name: z.string().min(2),
@@ -706,8 +705,7 @@ function Dashboard() {
</div>
</div>
<div className="mt-6 grid gap-6 xl:grid-cols-[1.15fr_0.85fr]">
<Card className="min-w-0">
<Card className="mt-6 min-w-0">
<CardHeader>
<CardTitle>Usage metrics</CardTitle>
</CardHeader>
@@ -736,13 +734,6 @@ function Dashboard() {
</CardContent>
</Card>
<JsonViewer
title="Merged payload"
description="Combined raw JSON."
value={summary.aggregatedUsage ?? { message: 'No data yet' }}
/>
</div>
<Card className="mt-6">
<CardHeader>
<CardTitle>Connected OpenAI accounts</CardTitle>
@@ -768,7 +759,6 @@ function Dashboard() {
</TabsList>
{summary.accounts.map((account) => (
<TabsContent key={account.id} value={account.id}>
<div className="grid gap-4 lg:grid-cols-[0.9fr_1.1fr]">
<div className="space-y-4 rounded-3xl border border-white/10 bg-white/4 p-5">
<div className="flex items-start justify-between gap-4">
<div>
@@ -832,16 +822,6 @@ function Dashboard() {
</Button>
</div>
</div>
<JsonViewer
title="Account payload"
description="Raw JSON for this account."
value={
account.usage ?? {
message: account.lastError || 'No usage fetched yet',
}
}
/>
</div>
</TabsContent>
))}
</Tabs>

19
apps/web/src/components/json-viewer.tsx
View File

@@ -1,19 +0,0 @@
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
export function JsonViewer({ title, description, value }: { title: string; description: string; value: unknown }) {
return (
<Card className="min-w-0 border-white/8 bg-slate-900/80">
<CardHeader>
<CardTitle>{title}</CardTitle>
<CardDescription>{description}</CardDescription>
</CardHeader>
<CardContent className="min-w-0">
<div className="min-w-0 max-h-80 overflow-x-auto overflow-y-auto rounded-2xl bg-black/30">
<pre className="min-w-0 whitespace-pre-wrap break-all p-4 text-xs leading-6 text-slate-300">
{JSON.stringify(value, null, 2)}
</pre>
</div>
</CardContent>
</Card>
);
}

3
apps/web/test/dashboard-card-copy.test.js
View File

@@ -9,7 +9,6 @@ describe('dashboard card copy', () => {
expect(appSource).toContain('<CardTitle>Unified capacity</CardTitle>');
expect(appSource).toContain('<CardTitle>Usage metrics</CardTitle>');
expect(appSource).toContain('<CardTitle>Connected OpenAI accounts</CardTitle>');
expect(appSource).toContain('description="Combined raw JSON."');
expect(appSource).toContain(">Merged by default. Inspect each account below.<");
expect(appSource).not.toContain(
'Fast glance card for the first two numeric metrics extracted from the merged usage payload.',
@@ -20,8 +19,10 @@ describe('dashboard card copy', () => {
expect(appSource).not.toContain(
'Raw aggregated JSON merged from every attached OpenAI Codex account.',
);
expect(appSource).not.toContain('Combined raw JSON.');
expect(appSource).not.toContain(
'By default, these accounts are merged into one Codex usage view. Switch tabs to inspect individual account payloads and timestamps.',
);
expect(appSource).not.toContain('Raw JSON for this account.');
});
});

17
apps/web/test/dashboard-payload-panels.test.js Normal file
View File

@@ -0,0 +1,17 @@
import { describe, expect, test } from 'bun:test';
import { readFileSync } from 'node:fs';
import { join } from 'node:path';
const appSource = readFileSync(join(import.meta.dir, '../src/App.tsx'), 'utf8');
describe('dashboard payload panels', () => {
test('removes merged payload and account payload panels from the dashboard', () => {
expect(appSource).not.toContain('title="Merged payload"');
expect(appSource).not.toContain('title="Account payload"');
expect(appSource).not.toContain('description="Combined raw JSON."');
expect(appSource).not.toContain('description="Raw JSON for this account."');
expect(appSource).not.toContain("summary.aggregatedUsage ?? { message: 'No data yet' }");
expect(appSource).not.toContain("account.usage ?? {");
expect(appSource).not.toContain("import { JsonViewer } from '@/components/json-viewer';");
});
});

13
apps/web/test/mobile-overflow-guards.test.js
View File

@@ -3,22 +3,17 @@ import { readFileSync } from 'node:fs';
import { join } from 'node:path';
const appSource = readFileSync(join(import.meta.dir, '../src/App.tsx'), 'utf8');
const jsonViewerSource = readFileSync(
join(import.meta.dir, '../src/components/json-viewer.tsx'),
'utf8',
);
describe('mobile overflow guards', () => {
test('usage metrics cards allow long metric labels to wrap on mobile', () => {
expect(appSource).toContain('className="mt-6 min-w-0"');
expect(appSource).toContain('className="grid gap-3 sm:grid-cols-2"');
expect(appSource).toContain('className="min-w-0 rounded-2xl border border-white/10 bg-white/4 p-4"');
expect(appSource).toContain('className="text-sm text-slate-400 break-words"');
});
test('merged payload viewer constrains JSON horizontally inside the card', () => {
expect(jsonViewerSource).toContain('className="min-w-0"');
expect(jsonViewerSource).toContain('overflow-x-auto');
expect(jsonViewerSource).toContain('whitespace-pre-wrap');
expect(jsonViewerSource).toContain('break-all');
test('connected account tabs no longer render a side-by-side payload column', () => {
expect(appSource).not.toContain('lg:grid-cols-[0.9fr_1.1fr]');
expect(appSource).not.toContain('Account payload');
});
});