Clarify primary CTAs across Cycles and other pages

[Modsofthenation]

Summary

Cycles showed the same solid green Create cycle with directs CTA up to four times (header, NextStep banner, section chrome, and form). That made the call to action unclear.

Rule applied: NextStep owns the one solid primary action for “what to do now.” Duplicate PageHeader / Section / table-row actions use secondary or ghost.

Cycles (empty state)

• One primary: NextStep → Create cycle
• Header: secondary “Jump to create form”
• Section action removed
• Form submit stays secondary
• Phase chips use a toggle style instead of a second solid primary
• Export/Import section buttons demoted; NextStep keeps Download when cycles exist

Also tightened

Team, Roles, Home, Person, Promotions, Promotion detail, Writing desk, Settings, Consistency, Templates, Backfill

Test plan

• pnpm --filter @prm/ui typecheck
• Cycles empty: only one solid green Create button (NextStep)
• Cycles with data: only NextStep Download is solid primary
• Spot-check Home / Team / Settings for competing neon green buttons

  

Summary by CodeRabbit

• UI Improvements
  • Refined button hierarchy across pages, making primary actions more prominent and secondary actions visually consistent.
  • Updated navigation, forms, settings, role management, promotion, team, and writing-desk controls with clearer styling.
  • Improved cycle page organization, including clearer empty states, inline controls, active phase buttons, and more accessible import/export actions.
  • Added visual styling for selected toggle and chip buttons.
  • Simplified page headers by moving key actions into relevant page sections.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 5b7cd831-d9ed-459d-9087-4dbaef4fff14

📥 Commits

Reviewing files that changed from the base of the PR and between 6f23200 and e05341d.

📒 Files selected for processing (14)

• CHANGELOG.md
• apps/ui/src/pages/BackfillPage.tsx
• apps/ui/src/pages/ConsistencyPage.tsx
• apps/ui/src/pages/CyclesPage.tsx
• apps/ui/src/pages/HomePage.tsx
• apps/ui/src/pages/PersonPage.tsx
• apps/ui/src/pages/PromotionDetailPage.tsx
• apps/ui/src/pages/PromotionsPage.tsx
• apps/ui/src/pages/RolesPage.tsx
• apps/ui/src/pages/SettingsPage.tsx
• apps/ui/src/pages/TeamPage.tsx
• apps/ui/src/pages/TemplatesPage.tsx
• apps/ui/src/pages/WritingDeskPage.tsx
• apps/ui/src/styles.css

---

📝 Walkthrough

Walkthrough

The PR standardizes CTA hierarchy across UI pages. It removes duplicate header actions, updates button styles, adds selected toggle styling, and restructures cycle creation, phase, export, and import controls.

Changes

CTA hierarchy and cycle controls

Layer / File(s)	Summary
Cross-page CTA hierarchy and selected states CHANGELOG.md, apps/ui/src/pages/*.tsx, apps/ui/src/styles.css	Page actions now use secondary or ghost styling. Duplicate header actions were removed. Pressed toggle buttons now use brand-selected styling.
Cycles content actions apps/ui/src/pages/CyclesPage.tsx	Cycle creation, phase updates, bundle export, and bundle import controls now render within section content. Existing API actions and status handling remain in place.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Possibly related PRs

• Modsofthenation/PerformanceReviewManager#63: Its RolesPage UX changes overlap with this PR’s role-action hierarchy updates.

Suggested reviewers: cursoragent

✨ Finishing Touches 💡 1

⚔️ Resolve merge conflicts 💡

• Resolve merge conflict in branch cursor/clarify-primary-ctas-3367

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch cursor/clarify-primary-ctas-3367

---

_{Comment @coderabbitai help to get the list of available commands.}