docs(ui-ux): add UI/UX rework master plan and industry benchmark blueprint

[JOY (JOY)]

What kind of change does this PR introduce?

Docs & Architecture: Added comprehensive UI/UX Rework Master Plan and Industry Benchmark Blueprint (docs/ui-ux-rework-plan.md) covering Crove brand color analysis (Emerald Green vs. Royal Purple), competitive analysis (Publer, Typefully, Buffer, Hootsuite), 4-phase implementation roadmap, and zero-conflict upstream merge strategy.

Why was this change needed?

To document the architectural plan and technical specifications for modernizing Crove Post's frontend before execution, ensuring the new design achieves high usability while remaining 100% compatible with upstream Postiz updates.

Technical Details & Scope

• docs/ui-ux-rework-plan.md:
  • Color psychology and brand fit evaluation for Crove (Emerald Green #10B981 vs Royal Purple #7C3AED).
  • Deep-dive benchmarks into Publer (Workspace & Calendar UX), Typefully (Split-view composer & live mobile preview), Buffer (Queues), and Hootsuite (anti-patterns to avoid).
  • 4-phase implementation plan:
    • Phase 1: App Shell & Workspace Switcher Popover
    • Phase 2: Post Composer Studio (Typefully Style Split-View)
    • Phase 3: Visual Interactive Calendar (Publer Style)
    • Phase 4: Analytics & KPI Insights Dashboard
  • Zero-Conflict layer isolation principles (Theme tokens in CSS, isolated sub-components, preserved upstream workflows).
• ROADMAP.md: Updated milestones and provider readiness status.

Verification & Testing

• Markdown rendering and link verification.
• Verified Branding Guard validation: pnpm dlx tsx scripts/branding-guard.ts (100% passed).
• Verified SSO unit test suite: pnpm --filter @crove/sso test (31/31 passed).

QA

1. Open docs/ui-ux-rework-plan.md and review the master plan and benchmark analysis
2. Verify that all sections (Brand analysis, Benchmarks, 4-phase roadmap, Zero-conflict strategy) are clear and well-structured
3. Confirm that existing unit tests and branding validation continue to pass

Checklist:

• My code follows the project's code style and architectural conventions.
• Local build passes (pnpm run build).
• Tests and typecheck have been verified without errors.
• Documentation has been updated (if applicable).
• No secrets or sensitive credentials are included in this PR.
• I have filled in the QA / Verification section above with real steps to verify this change.

---

Note

Low Risk
Documentation-only change with no runtime, auth, or data-path impact.

Overview
Adds docs/ui-ux-rework-plan.md, a draft architectural standard for Crove Post’s frontend rework—no application code changes.

The doc compares Emerald Green vs Royal Purple brand accents and recommends a hybrid palette (green for growth/brand, purple for AI/copilot, obsidian dark canvas). It captures competitive UX notes from Publer, Typefully, Buffer/Metricool, and anti-patterns from Hootsuite.

It outlines four planned modules: app shell with CroveWorkspaceSelector popover, Typefully-style split composer with live previews, Publer-style drag-and-drop calendar, and an analytics dashboard (KPIs, sparklines, heatmaps). Zero-conflict upstream merge rules are documented: leave orchestrator/integrations untouched, theme via colors.scss / tailwind.config.cjs, and isolate Crove-only UI in outer layout wrappers.

^{Reviewed by Cursor Bugbot for commit 53ba349. Configure here.}

[cursor]

Bugbot couldn't run - usage limit reached

Bugbot is counted against Cursor usage for this user or team, and this run hit a usage or spend limit.

A user or team admin can review and increase usage limits in the Cursor dashboard.

(requestId: serverGenReqId_30eeca74-309e-4a8e-9d33-4e80928d4e97)

[gemini-code-assist]

Code Review

This pull request introduces a master plan and benchmark blueprint for the Crove Post UI/UX rework, detailing brand color choices, UI/UX benchmarks, a 4-module architecture, and zero-conflict merge guidelines. The feedback highlights a conflict between the proposed Emerald Green primary accent and the existing design system, points out potential cross-organization data leakage risks with SWR cache mutation during workspace switching, and suggests adding database migration guidelines to ensure a true zero-conflict merge strategy.

[gemini-code-assist]

The proposal to use Emerald Green (#10B981 / #059669) as the primary brand accent and Royal Purple (#7C3AED) as the secondary/AI accent conflicts with the established Design System in DESIGN.md. According to DESIGN.md (Section 1, Principle 4 and Section 2.1), Royal Purple (#612BD3 / #7c3aed) is defined as the dominant primary accent and core brand mark, while Emerald Green is reserved as a semantic success/online indicator. Introducing Emerald Green as the primary brand accent will require updating the core design tokens and guidelines in DESIGN.md to maintain consistency.

[gemini-code-assist]

Switching workspaces via SWR mutate without a page reload (window.location.reload()) requires careful cache invalidation. Since many SWR queries (e.g., posts, integrations, analytics) are scoped to the active organization, simply mutating the workspace state without clearing or revalidating all other organization-dependent SWR caches can lead to stale data or cross-organization data leakage in the UI. Ensure the implementation plans for a global cache reset or systematic key revalidation upon switching.

[gemini-code-assist]

To ensure a true zero-conflict merge strategy with upstream Postiz, consider adding a guideline regarding database schema changes and Prisma migrations. Modifying existing upstream tables or adding migrations directly to the main sequence can cause severe conflicts during upstream merges. Recommending isolated tables or a specific migration naming/prefixing convention would help prevent these issues.