Added stats to the automations list on mobile - #30355
Conversation
ref https://linear.app/ghost/issue/NY-1540/mobile-view-for-automations-list-table The three stat columns were hidden below `lg`, so on mobile the list showed only a name, description and status. The stats are the reason to open the list at all, and their absence made the screen read as unfinished rather than deliberately condensed. Each row now lays out on a four-track grid below `lg`: the name spans the first row, the stats sit on the second, and the status badge stays pinned right. Placement is explicit rather than wrapping the stats in a container, because a wrapper between `tr` and `td` is invalid markup and would break the real table layout that returns at `lg`. Each stat carries its own label beneath its value, matching the newsletter list in settings, since the column headers are hidden at that width. Column widths are scoped to `lg` so they no longer fight the mobile grid, and the skeleton uses the same layout so nothing shifts as the list loads.
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: QUIET Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
Included review availability: Your plan provides up to 10 included reviews per hour; 9 remain after this review. 📜 Recent review details⏰ Context from checks skipped due to timeout. (10)
🧰 Additional context used📓 Path-based instructions (6)Review Admin UI for existing Shade reuse, correct component layer, semantic⚙️ CodeRabbit configuration file Files:
Review lens: "where does this data become trusted?"⚙️ CodeRabbit configuration file Files:
Prioritise concrete correctness, security, data-integrity, compatibility,⚙️ CodeRabbit configuration file Files:
Type-safe boundaries: Fail only if the PR:📄 CodeRabbit inference engine (Custom checks) Files:
Build new features in React,📄 CodeRabbit inference engine (AGENTS.md) Files:
Always use `pnpm`, never npm or Yarn.📄 CodeRabbit inference engine (AGENTS.md) Files:
🔇 Additional comments (1)
Walkthrough
Suggested reviewers: Merge Risk: ⚪ Minimal · up to The automations list now shows labeled stats on mobile while preserving the desktop table layout. No actionable merge-blocking risk remains beyond normal checks and review. 🚥 Pre-merge checks | ✅ 6✅ Passed checks (6 passed)
Full details: Type-Safe BoundariesExplanation PASS. The PR diff versus Full details: New Files Are TypescriptExplanation PASS: The diff from origin/main contains one modified file, ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
ref https://linear.app/ghost/issue/NY-1540/mobile-view-for-automations-list-table Resolves against "Updated automation table to handle missing stats" (#30313), which landed on the same component after this branch was cut. That change hides the stat columns entirely when the browse response omits stats, so the mobile stats and their labels now render inside its `showRunAnalytics` guard rather than unconditionally. The status badge keeps both its new grid placement and the conditional desktop widths introduced there.
|
| Command | Status | Duration | Result |
|---|---|---|---|
nx run @tryghost/admin:test:acceptance |
✅ Succeeded | 8m 19s | View ↗ |
nx run-many -t test:unit -p @tryghost/admin |
✅ Succeeded | 2m 7s | View ↗ |
nx run ghost-monorepo:lint:boundaries |
✅ Succeeded | 23s | View ↗ |
nx run-many -t lint -p @tryghost/admin,ghost-mo... |
✅ Succeeded | 1m 25s | View ↗ |
nx run @tryghost/admin:build |
✅ Succeeded | 14s | View ↗ |
nx run-many --target=build --projects=tag:publi... |
✅ Succeeded | <1s | View ↗ |
nx run @tryghost/e2e:test:fixtures |
✅ Succeeded | 2s | View ↗ |
💡 Verify your cache is correct by running tasks in a sandbox. Read docs ↗
☁️ Nx Cloud last updated this comment at 2026-08-27 20:14:12 UTC
2 participants
ref https://linear.app/ghost/issue/NY-1540/mobile-view-for-automations-list-table
Why are you making it?
Below the
lgbreakpoint the automations list showed only a name, description and status badge — the three stat columns were hidden outright. The stats are the reason to open the list at all, so their absence made the screen read as unfinished rather than deliberately condensed.What does it do?
Each row now lays out on a four-track grid below
lg: the name spans the first row, the three stats sit on the second, and the status badge stays pinned right. Placement is explicit rather than wrapping the stats in a container, because a wrapper element betweentrandtdis invalid markup and would break the real table layout that returns atlg.Each stat carries its own label beneath its value, matching the newsletter list in settings, since the column headers are hidden at that width. Column widths are scoped to
lgso they no longer fight the mobile grid, and the skeleton uses the same layout so nothing shifts as the list loads.The desktop table is untouched.
Why is this something Ghost users or developers need?
The automations list is the entry point to the feature, and its stats are what tell you whether an automation is doing anything. On mobile that information was simply missing, leaving a list that looked broken rather than compact.
Notes for review