[PR #5] [MERGED] Revamp dashboard UI with Comfy brand refresh #5

Closed
opened 2026-10-31 22:05:55 +00:00 by bsakaguchi · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/Comfy-Org/comfyci-dashboard/pull/5
Author: @marawan206
Created: 6/4/2026
Status: ✅ Merged
Merged: 6/9/2026
Merged by: @marawan206

Base: main ← Head: ui-revamp


📝 Commits (2)

  • bf45eb4 Add pnpm-workspace.yaml to approve dependency build scripts
  • 208a26a Revamp dashboard UI with Comfy brand refresh

📊 Changes

33 files changed (+1273 additions, -526 deletions)

View changed files

📝 components/Header.tsx (+67 -23)
➕ components/Inputs.tsx (+38 -0)
📝 components/Labels/ClearableLabel.tsx (+11 -13)
📝 components/LongTextPreview.tsx (+3 -3)
➕ components/Pager.tsx (+69 -0)
➕ components/StatsDashboard.tsx (+256 -0)
📝 components/StatusButton.tsx (+31 -23)
➕ components/Surface.tsx (+32 -0)
📝 components/ThemeToggler.tsx (+2 -2)
📝 components/UsageGraph.tsx (+20 -11)
📝 components/layout.tsx (+11 -4)
📝 pages/index.tsx (+253 -186)
📝 pages/waterfall/index.tsx (+164 -125)
📝 pages/workflow/[id].tsx (+162 -122)
➕ pnpm-workspace.yaml (+3 -0)
➕ public/brand/favicon.svg (+4 -0)
➕ public/brand/logo-full-ink.svg (+3 -0)
➕ public/brand/logo-full-yellow.svg (+1 -0)
➕ public/brand/logo-mark-ink.svg (+3 -0)
➕ public/brand/logo-mark-yellow.svg (+3 -0)

...and 13 more files

📄 Description

Summary

Modernizes the ComfyCI dashboard around the current Comfy brand and adds a stats overview to the results page.

Brand & theme

  • New palette (ink backgrounds, electric-yellow / plum / sapphire accents) wired into Tailwind
  • Self-hosted PP Formula typography (converted to woff2)
  • Real Comfy logo in the header — yellow in dark mode, ink in light mode
  • Favicon + full icon set regenerated from the Color Combo ink logo

Stats dashboard (results page)

  • KPI cards: workflow runs, success rate, failed, average run time
  • Status breakdown donut + operating-system breakdown
  • Accent colors are theme-aware so they stay legible in light mode (electric-yellow is a dark-mode signature; light mode falls back to sapphire/plum)

Pages

  • All Results, Waterfall and the per-workflow detail page restyled into branded cards, status pills, branded selects/inputs and pagination
  • Fixed a nested table row in Waterfall and a no-op loading spinner on the detail page

All filter, pagination and URL-sync behaviour is preserved.

Note: dashboard stats are computed from the currently loaded page of results (the API has no aggregate endpoint), so they reflect the current filtered view.

Testing

  • tsc --noEmit ✓
  • next lint ✓ (no warnings)
  • All routes return 200 and compile cleanly in dev

This branch also includes the pnpm-workspace.yaml build-approval fix (#4) as its base, so it can be merged on its own.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/Comfy-Org/comfyci-dashboard/pull/5 **Author:** [@marawan206](https://github.com/marawan206) **Created:** 6/4/2026 **Status:** ✅ Merged **Merged:** 6/9/2026 **Merged by:** [@marawan206](https://github.com/marawan206) **Base:** `main` ← **Head:** `ui-revamp` --- ### 📝 Commits (2) - [`bf45eb4`](https://github.com/Comfy-Org/comfyci-dashboard/commit/bf45eb45442c973d52120860390bebdcdb25c1d8) Add pnpm-workspace.yaml to approve dependency build scripts - [`208a26a`](https://github.com/Comfy-Org/comfyci-dashboard/commit/208a26a7c7f55fc393351b4c24226244f9c08649) Revamp dashboard UI with Comfy brand refresh ### 📊 Changes **33 files changed** (+1273 additions, -526 deletions) <details> <summary>View changed files</summary> 📝 `components/Header.tsx` (+67 -23) ➕ `components/Inputs.tsx` (+38 -0) 📝 `components/Labels/ClearableLabel.tsx` (+11 -13) 📝 `components/LongTextPreview.tsx` (+3 -3) ➕ `components/Pager.tsx` (+69 -0) ➕ `components/StatsDashboard.tsx` (+256 -0) 📝 `components/StatusButton.tsx` (+31 -23) ➕ `components/Surface.tsx` (+32 -0) 📝 `components/ThemeToggler.tsx` (+2 -2) 📝 `components/UsageGraph.tsx` (+20 -11) 📝 `components/layout.tsx` (+11 -4) 📝 `pages/index.tsx` (+253 -186) 📝 `pages/waterfall/index.tsx` (+164 -125) 📝 `pages/workflow/[id].tsx` (+162 -122) ➕ `pnpm-workspace.yaml` (+3 -0) ➕ `public/brand/favicon.svg` (+4 -0) ➕ `public/brand/logo-full-ink.svg` (+3 -0) ➕ `public/brand/logo-full-yellow.svg` (+1 -0) ➕ `public/brand/logo-mark-ink.svg` (+3 -0) ➕ `public/brand/logo-mark-yellow.svg` (+3 -0) _...and 13 more files_ </details> ### 📄 Description ## Summary Modernizes the ComfyCI dashboard around the current Comfy brand and adds a stats overview to the results page. **Brand & theme** - New palette (ink backgrounds, electric-yellow / plum / sapphire accents) wired into Tailwind - Self-hosted **PP Formula** typography (converted to woff2) - Real Comfy logo in the header — yellow in dark mode, ink in light mode - Favicon + full icon set regenerated from the Color Combo ink logo **Stats dashboard** (results page) - KPI cards: workflow runs, success rate, failed, average run time - Status breakdown donut + operating-system breakdown - Accent colors are theme-aware so they stay legible in light mode (electric-yellow is a dark-mode signature; light mode falls back to sapphire/plum) **Pages** - All Results, Waterfall and the per-workflow detail page restyled into branded cards, status pills, branded selects/inputs and pagination - Fixed a nested table row in Waterfall and a no-op loading spinner on the detail page All filter, pagination and URL-sync behaviour is preserved. > Note: dashboard stats are computed from the currently loaded page of results (the API has no aggregate endpoint), so they reflect the current filtered view. ## Testing - `tsc --noEmit` ✓ - `next lint` ✓ (no warnings) - All routes return 200 and compile cleanly in dev This branch also includes the `pnpm-workspace.yaml` build-approval fix (#4) as its base, so it can be merged on its own. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
bsakaguchi 2026-10-31 22:05:55 +00:00
Sign in to join this conversation.
No labels
pull-request
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
Comfy-Org/comfyci-dashboard#5
No description provided.