This commit is contained in:
Simo committed
1 parent
f6871807c9
commit
e7a6587b7f
14 files changed
-1045
No files matched your search
@@ -1,94 +0,0 @@
|
||||
# ACL and Import Backend Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Complete ACL management and activate every existing administration import workflow.
|
||||
|
||||
**Architecture:** Use the normalized ACL tables as the single authorization source and map emulator ranks to `rank_<id>` roles. Port the proven import core and services from `habbo-next`, expose them through locale-free API routes guarded server-side, and verify DB plus filesystem outputs.
|
||||
|
||||
**Tech Stack:** Next.js 16 route handlers, React 19, TypeScript, Prisma/MariaDB, Vitest, Node filesystem and streams.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Work directly in `E:\Users\simol\Desktop\EpicNext-cms`; no worktree or subagents.
|
||||
- Preserve and never stage the existing `package.json` modification.
|
||||
- Pull `main` before publication and never force-push.
|
||||
- Do not copy generated Prisma files.
|
||||
- Every import API requires `admin.assets.import`; destructive catalog operations also require `admin.catalog.edit`.
|
||||
- Import success requires database and required filesystem/FurnitureData outputs.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Lock ACL and route coverage with failing contracts
|
||||
|
||||
**Files:**
|
||||
- Create: `src/lib/admin/acl-management-contract.test.ts`
|
||||
- Create: `src/lib/import-backend-contract.test.ts`
|
||||
|
||||
- [ ] Assert that permission mutations use `adminAction` with `PERMS.PERMISSIONS_MANAGE`, write normalized ACL tables, and do not write legacy housekeeping permission tables.
|
||||
- [ ] Assert that every API referenced by `src/app/admin/import/**` exists and contains a server-side `PERMS.ASSETS_IMPORT` guard.
|
||||
- [ ] Run both tests and verify they fail on the missing management/API implementation.
|
||||
- [ ] Commit with `test: define acl and import backend contracts`.
|
||||
|
||||
### Task 2: Normalize ACL persistence and management
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/actions/permissions.ts`
|
||||
- Modify: `src/app/admin/permissions/page.tsx`
|
||||
- Modify: `src/app/admin/permissions/[id]/page.tsx`
|
||||
- Modify: `src/app/admin/permissions/[id]/rank-edit-client.tsx`
|
||||
- Use: `src/lib/services/permission-ranks.ts`
|
||||
- Create: `prisma/migrations/0014_complete_acl_and_import_permissions.sql`
|
||||
|
||||
- [ ] Add focused failing tests for rank service and ACL assignment behavior.
|
||||
- [ ] Replace legacy writes with emulator rank service and normalized ACL assignments.
|
||||
- [ ] Seed and migrate roles/permissions idempotently, using `Role` and `User` discriminator casing.
|
||||
- [ ] Invalidate permission cache, update RCON, and log each mutation.
|
||||
- [ ] Run ACL tests and migration contract tests; commit with `fix: complete acl management`.
|
||||
|
||||
### Task 3: Port shared import core and domain services
|
||||
|
||||
**Files:**
|
||||
- Create: `src/lib/services/import/core/*.ts`
|
||||
- Create: `src/lib/services/{clone-import,clothing-set-import,effect-import,figure-import,furni-import,nitro-assets,pet-import}.ts`
|
||||
- Modify: `src/lib/services/furni-asset-dirs.ts`
|
||||
- Modify: `src/lib/services/furni-data.ts`
|
||||
- Test: matching `*.test.ts` files
|
||||
|
||||
- [ ] Port tests first and verify failures from missing modules.
|
||||
- [ ] Port reference implementations, adapting Prisma model names and EpicNext settings.
|
||||
- [ ] Preserve Windows absolute-path handling and live Nitro mirroring.
|
||||
- [ ] Run all import service tests; commit with `feat: add asset import services`.
|
||||
|
||||
### Task 4: Add guarded import route handlers
|
||||
|
||||
**Files:**
|
||||
- Create: `src/app/api/admin/import/**/route.ts`
|
||||
- Create: `src/app/api/nitro-assets/bundled/furniture/[...path]/route.ts`
|
||||
|
||||
- [ ] Add badge, clone, clothing, effects, furni, pets, and repair handlers used by the existing clients.
|
||||
- [ ] Apply server-side API context plus `PERMS.ASSETS_IMPORT` to every handler.
|
||||
- [ ] Require `PERMS.CATALOG_EDIT` for deletion, repair, resync, and catalog-mutating operations.
|
||||
- [ ] Run route contract, API authorization, and service tests; commit with `feat: add guarded asset import api`.
|
||||
|
||||
### Task 5: Align pages, actions, and permissions
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/app/admin/import/**/page.tsx`
|
||||
- Modify: `src/actions/import-badges.ts`
|
||||
- Modify: `src/actions/import-furni.ts`
|
||||
- Modify: `src/lib/permission-slugs.ts`
|
||||
|
||||
- [ ] Make every import page use `PERMS.ASSETS_IMPORT` consistently.
|
||||
- [ ] Replace stub cleanup/deletion behavior with guarded service calls.
|
||||
- [ ] Run contract tests and TypeScript; commit with `fix: connect admin import workflows`.
|
||||
|
||||
### Task 6: Complete verification and publish
|
||||
|
||||
**Files:**
|
||||
- Verify all committed files; exclude `package.json`.
|
||||
|
||||
- [ ] Run `git diff --check origin/main...HEAD`.
|
||||
- [ ] Run `pnpm test`, `pnpm typecheck`, and `pnpm build`.
|
||||
- [ ] Confirm `git status --short` contains only ` M package.json`.
|
||||
- [ ] Fetch `origin/main`, require it to be an ancestor of `HEAD`, and push `main` without force.
|
||||
@@ -1,43 +0,0 @@
|
||||
# Admin Events Polls Banners Prefixes Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Port four complete admin modules from habbo-next into EpicNext with safe schema ownership and ACL enforcement.
|
||||
|
||||
**Architecture:** Add CMS-owned tables and Prisma models first, then validators/actions, then locale-free admin routes and navigation. Existing safe-action, audit, admin-list, UI primitives, and semantic theme systems are reused.
|
||||
|
||||
**Tech Stack:** Next.js 16, Prisma 7, MariaDB SQL migrations, Zod, React Hook Form, Vitest.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Never modify emulator-owned poll tables.
|
||||
- Preserve the local `package.json` modification.
|
||||
- Remove `[locale]` routing assumptions.
|
||||
- Use EpicNext semantic colors and ACL permission constants.
|
||||
|
||||
### Task 1: Schema and ACL
|
||||
|
||||
- [ ] Add failing migration/schema contract tests for all CMS tables and permission slugs.
|
||||
- [ ] Add Prisma models and an idempotent numbered migration.
|
||||
- [ ] Generate Prisma and run schema/migration tests.
|
||||
- [ ] Commit with `feat: add schema for admin content modules`.
|
||||
|
||||
### Task 2: Validators and actions
|
||||
|
||||
- [ ] Port event/poll validators and add invalid-input tests.
|
||||
- [ ] Port events, polls, banners, and prefixes actions using existing safe-action/audit APIs.
|
||||
- [ ] Run action import contracts, typecheck, and targeted tests.
|
||||
- [ ] Commit with `feat: add admin content module actions`.
|
||||
|
||||
### Task 3: Routes and UI
|
||||
|
||||
- [ ] Port the 24 module files without locale routing and add the missing date-time picker primitive.
|
||||
- [ ] Add route/import contract tests and adapt query/API differences found by typecheck.
|
||||
- [ ] Add navigation entries and permission visibility.
|
||||
- [ ] Run targeted tests and typecheck; commit with `feat: add admin content module pages`.
|
||||
|
||||
### Task 4: Verification
|
||||
|
||||
- [ ] Run Prisma generation, full test suite, typecheck, and production build.
|
||||
- [ ] Verify migration idempotency and ensure `package.json` is unstaged.
|
||||
- [ ] Push the verified commits to `origin/main`.
|
||||
@@ -1,86 +0,0 @@
|
||||
# Admin Operations Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Add complete moderation, logs, analytics, DevOps, and online-user administration verticals.
|
||||
|
||||
**Architecture:** Port each reference vertical independently, adapt its data access to EpicNext's Prisma/schema conventions, and enforce ACL at both route and mutation boundaries. Reuse shared admin components and semantic admin theme tokens.
|
||||
|
||||
**Tech Stack:** Next.js 16, React 19, TypeScript, Prisma/MariaDB, Vitest, RCON.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Work directly on `main`; no worktree or subagents.
|
||||
- Preserve and never stage the local `package.json` change.
|
||||
- Do not copy generated Prisma code.
|
||||
- Every page/action/API must use its documented ACL permission.
|
||||
- Missing optional emulator tables render unavailable states instead of crashing the admin shell.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Define route, ACL, and theme contracts
|
||||
|
||||
**Files:**
|
||||
- Create: `src/lib/admin-operations-contract.test.ts`
|
||||
|
||||
- [ ] Assert all moderation, log, analytics, DevOps, and online routes exist.
|
||||
- [ ] Assert mutations and APIs contain the matching `PERMS` guard.
|
||||
- [ ] Assert new sources contain no forbidden public structural theme tokens.
|
||||
- [ ] Run the contract and confirm it fails because routes are absent.
|
||||
- [ ] Commit with `test: define admin operations contracts`.
|
||||
|
||||
### Task 2: Moderation and calls for help
|
||||
|
||||
**Files:**
|
||||
- Create: `src/actions/moderation.ts`
|
||||
- Create: `src/app/admin/moderation/**`
|
||||
- Modify: `src/app/admin/layout.tsx`
|
||||
|
||||
- [ ] Port moderation validation tests and confirm failure.
|
||||
- [ ] Add dashboard, actions, CFH list/detail, and team pages.
|
||||
- [ ] Adapt user/ban/CFH queries and protect reads/edits with moderation ACL.
|
||||
- [ ] Log actions and separate RCON failures from database results.
|
||||
- [ ] Run contract, moderation tests, and typecheck; commit `feat: add admin moderation operations`.
|
||||
|
||||
### Task 3: Detailed administration logs
|
||||
|
||||
**Files:**
|
||||
- Create: `src/app/admin/logs/{audit,chat,commands,trades}/**`
|
||||
- Modify: `src/app/admin/logs/page.tsx`
|
||||
|
||||
- [ ] Add failing route/filter contract coverage.
|
||||
- [ ] Port paginated read-only tables using EpicNext log models or compatible raw queries.
|
||||
- [ ] Protect every route with `admin.logs.view` and use semantic admin status colors.
|
||||
- [ ] Run log tests and typecheck; commit `feat: add detailed admin logs`.
|
||||
|
||||
### Task 4: Analytics and export
|
||||
|
||||
**Files:**
|
||||
- Create: `src/app/admin/analytics/**`
|
||||
- Create: `src/app/api/admin/analytics/export/route.ts`
|
||||
|
||||
- [ ] Add failing ACL/export contract checks.
|
||||
- [ ] Port overview, activity, and economy aggregates.
|
||||
- [ ] Guard reads with `admin.analytics.view` and export with `admin.analytics.export`.
|
||||
- [ ] Ensure export excludes secrets and fields absent from the visible tables.
|
||||
- [ ] Run analytics contracts and typecheck; commit `feat: add admin analytics`.
|
||||
|
||||
### Task 5: DevOps health and online users
|
||||
|
||||
**Files:**
|
||||
- Create: `src/app/admin/devops/**`
|
||||
- Create: `src/app/api/admin/devops/health/route.ts`
|
||||
- Create: `src/app/admin/online/**`
|
||||
|
||||
- [ ] Add failing route, redaction, and ACL checks.
|
||||
- [ ] Port health/errors/online pages and adapt queries to EpicNext models.
|
||||
- [ ] Redact credentials, connection strings, environment variables, and stack details from API responses.
|
||||
- [ ] Guard DevOps with `admin.devops.view/edit` and online users with `admin.users.view`.
|
||||
- [ ] Run contracts and typecheck; commit `feat: add devops and online operations`.
|
||||
|
||||
### Task 6: Verify and publish
|
||||
|
||||
- [ ] Run `git diff --check origin/main...HEAD`.
|
||||
- [ ] Run `pnpm test`, `pnpm typecheck`, and `pnpm build`.
|
||||
- [ ] Confirm only `package.json` remains modified.
|
||||
- [ ] Fetch `origin/main`, verify it is an ancestor of `HEAD`, and push `main` without force.
|
||||
@@ -1,170 +0,0 @@
|
||||
# Admin Theme Isolation Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Make every admin page, including all import workflows, readable in light and dark mode without inheriting unsafe public-theme color combinations.
|
||||
|
||||
**Architecture:** Generate a dedicated semantic `--admin-*` palette alongside the existing public variables, scope it to the admin layout, and migrate admin UI chrome to those tokens. A source-contract test prevents public structural tokens and unapproved literal palette colors from returning to `/admin`.
|
||||
|
||||
**Tech Stack:** Next.js 16, React 19, TypeScript, Tailwind CSS, CSS custom properties, Vitest.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Work directly in `E:\Users\simol\Desktop\EpicNext-cms`; do not create a worktree.
|
||||
- Preserve and do not stage the existing local `package.json` modification.
|
||||
- Cover the complete `src/app/admin` tree, including badge, clone, clothing, effects, furni, pets, and repair imports.
|
||||
- Preserve literal colors that represent editable data or faithful content previews.
|
||||
- Do not add runtime dependencies.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Enforce the admin color boundary
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/lib/admin-theme-source-audit.test.ts`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: source files below `src/app/admin`
|
||||
- Produces: a failing contract when UI chrome uses forbidden public or literal colors
|
||||
|
||||
- [ ] **Step 1: Extend the source audit with explicit forbidden patterns and exception paths**
|
||||
|
||||
Add checks for structural `--color-background`, `--color-surface`, `--color-text`, `--color-text-muted`, and palette utilities such as `bg-zinc-400`. Exempt the theme editor, favicon editor, user-editable banner/prefix/event/tag/team values, and faithful preview canvases.
|
||||
|
||||
- [ ] **Step 2: Verify the test fails for the current admin sources**
|
||||
|
||||
Run: `pnpm vitest run src/lib/admin-theme-source-audit.test.ts`
|
||||
|
||||
Expected: FAIL listing current public-token and hard-coded-color violations, including import pages.
|
||||
|
||||
- [ ] **Step 3: Commit the failing contract**
|
||||
|
||||
Run: `git add src/lib/admin-theme-source-audit.test.ts && git commit -m "test: enforce admin theme isolation"`
|
||||
|
||||
### Task 2: Generate the semantic admin palette
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/lib/theme-css.ts`
|
||||
- Modify: `src/components/theme-vars.tsx`
|
||||
- Modify: `src/components/theme-vars.test.ts`
|
||||
- Modify: `src/lib/theme-contrast.test.ts`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: `ThemePalette`, `readableColor`, and derived semantic foregrounds
|
||||
- Produces: `--admin-canvas`, `--admin-surface`, `--admin-surface-elevated`, `--admin-text`, `--admin-text-muted`, `--admin-border`, `--admin-accent`, `--admin-accent-foreground`, status, sidebar, input, overlay, and focus variables
|
||||
|
||||
- [ ] **Step 1: Add failing assertions for complete light and dark admin tokens**
|
||||
|
||||
Assert that generated CSS contains every admin token and that readable foregrounds are derived rather than copied from unsafe public values.
|
||||
|
||||
- [ ] **Step 2: Run focused tests and confirm the missing-token failure**
|
||||
|
||||
Run: `pnpm vitest run src/components/theme-vars.test.ts src/lib/theme-contrast.test.ts`
|
||||
|
||||
Expected: FAIL because the admin palette has not been generated.
|
||||
|
||||
- [ ] **Step 3: Generate the admin tokens using existing contrast helpers**
|
||||
|
||||
Keep the public palette unchanged. Use stable neutral structural surfaces for each mode, allow the preset primary color to influence `--admin-accent`, and derive its foreground through `readableColor`.
|
||||
|
||||
- [ ] **Step 4: Run focused tests**
|
||||
|
||||
Run: `pnpm vitest run src/components/theme-vars.test.ts src/lib/theme-contrast.test.ts`
|
||||
|
||||
Expected: PASS.
|
||||
|
||||
- [ ] **Step 5: Commit**
|
||||
|
||||
Run: `git add src/lib/theme-css.ts src/components/theme-vars.tsx src/components/theme-vars.test.ts src/lib/theme-contrast.test.ts && git commit -m "feat: add semantic admin palette"`
|
||||
|
||||
### Task 3: Migrate shared admin styling and layout
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/app/globals.css`
|
||||
- Modify: `src/app/admin/layout.tsx`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: the `--admin-*` palette from Task 2
|
||||
- Produces: admin layout, cards, tables, forms, navigation, dialogs, and focus states independent from public structural colors
|
||||
|
||||
- [ ] **Step 1: Scope admin semantic aliases at the admin root**
|
||||
|
||||
Apply the admin canvas/text variables at `.admin-page` and replace shared admin CSS references to public background, surface, text, muted text, border, and primary variables with their semantic admin equivalents.
|
||||
|
||||
- [ ] **Step 2: Migrate sidebar and header classes in the admin layout**
|
||||
|
||||
Use the sidebar, accent, surface, text, muted, and border admin variables; retain no public structural variable in layout chrome.
|
||||
|
||||
- [ ] **Step 3: Run the source audit and CSS/theme tests**
|
||||
|
||||
Run: `pnpm vitest run src/lib/admin-theme-source-audit.test.ts src/components/theme-vars.test.ts src/lib/theme-contrast.test.ts`
|
||||
|
||||
Expected: remaining failures point only to individual pages.
|
||||
|
||||
- [ ] **Step 4: Commit**
|
||||
|
||||
Run: `git add src/app/globals.css src/app/admin/layout.tsx && git commit -m "fix: isolate shared admin styling"`
|
||||
|
||||
### Task 4: Migrate admin pages and import workflows
|
||||
|
||||
**Files:**
|
||||
- Modify: violating files reported by `src/lib/admin-theme-source-audit.test.ts` below `src/app/admin/**`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: semantic admin variables and shared admin styles from Task 3
|
||||
- Produces: zero unapproved source-audit violations across all admin routes
|
||||
|
||||
- [ ] **Step 1: Replace structural public variables page by page**
|
||||
|
||||
Map background to `--admin-canvas` or `--admin-surface`, text to `--admin-text`, muted text to `--admin-text-muted`, primary UI accents to `--admin-accent`, and status UI to the matching admin status token.
|
||||
|
||||
- [ ] **Step 2: Replace hard-coded palette utilities in ordinary admin pages**
|
||||
|
||||
Migrate catalog currency accents, offline indicators, alerts, modal overlays, and decorative gradients. Do not alter stored/user-entered color fields.
|
||||
|
||||
- [ ] **Step 3: Migrate every import workflow**
|
||||
|
||||
Replace status shadows, selection gradients, tooltips, dialog overlays, labels, and borders in badge, clone, clothing, effects, furni, pets, and repair imports. Preserve asset pixels and intentionally neutral preview canvases.
|
||||
|
||||
- [ ] **Step 4: Run the source audit until it passes**
|
||||
|
||||
Run: `pnpm vitest run src/lib/admin-theme-source-audit.test.ts`
|
||||
|
||||
Expected: PASS with no unapproved violations.
|
||||
|
||||
- [ ] **Step 5: Commit**
|
||||
|
||||
Run: `git add src/app/admin && git commit -m "fix: use semantic colors across admin pages"`
|
||||
|
||||
### Task 5: Verify and publish
|
||||
|
||||
**Files:**
|
||||
- Verify all committed files; do not stage `package.json`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: Tasks 1-4
|
||||
- Produces: verified commits on `main`
|
||||
|
||||
- [ ] **Step 1: Run formatting and whitespace checks**
|
||||
|
||||
Run: `git diff --check origin/main...HEAD`
|
||||
|
||||
Expected: no output and exit code 0.
|
||||
|
||||
- [ ] **Step 2: Run complete verification**
|
||||
|
||||
Run: `pnpm test && pnpm typecheck && pnpm build`
|
||||
|
||||
Expected: all tests pass, TypeScript exits 0, and Next.js production build succeeds.
|
||||
|
||||
- [ ] **Step 3: Confirm the dirty-file boundary**
|
||||
|
||||
Run: `git status --short`
|
||||
|
||||
Expected: only ` M package.json`.
|
||||
|
||||
- [ ] **Step 4: Synchronize and publish main safely**
|
||||
|
||||
Run: `git fetch origin main --prune`, verify `origin/main` is an ancestor of `HEAD`, then run `git push origin main`.
|
||||
|
||||
Expected: push succeeds without force.
|
||||
@@ -1,87 +0,0 @@
|
||||
# EpicNext Multitheme Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Give every EpicNext preset complete, coherent light and dark palettes while retaining the visitor mode toggle and rebranding the CMS information popup.
|
||||
|
||||
**Architecture:** A canonical theme-key contract defines every persisted/runtime color. Presets provide complete `light` and `dark` palettes; `ThemeVars` emits both scopes and the existing toggle only selects a scope. Admin preset application persists both variants atomically and legacy unqualified settings remain the light-mode compatibility source.
|
||||
|
||||
**Tech Stack:** Next.js 16, React 19, TypeScript, CSS custom properties, Prisma website settings, Vitest.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Work directly in `E:\Users\simol\Desktop\EpicNext-cms`; do not create a worktree.
|
||||
- Preserve the existing uncommitted `package.json` change and never stage it.
|
||||
- Keep `localStorage.theme` limited to `light` or `dark`.
|
||||
- Every built-in preset must define every canonical color key in both modes.
|
||||
- Build, typecheck, and the complete test suite must pass before publication.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Canonical complete preset model
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/lib/theme-presets.ts`
|
||||
- Modify: `src/lib/theme-contrast.test.ts`
|
||||
|
||||
**Interfaces:**
|
||||
- Produces: `ThemeMode`, `ThemeColorKey`, `ThemePalette`, `ThemePreset`, `THEME_COLOR_KEYS`, and `PRESETS` with `{ light, dark }` variants.
|
||||
- Consumes: existing color names used by `ThemeVars` and the admin editor.
|
||||
|
||||
- [ ] Add failing tests that iterate every preset/mode and require exact coverage of `THEME_COLOR_KEYS`, then run `pnpm vitest run src/lib/theme-contrast.test.ts` and confirm missing dark variants fail.
|
||||
- [ ] Define the canonical keys and typed palette/preset interfaces, convert every preset to complete light/dark variants, and include buttons, links, borders, and gradients.
|
||||
- [ ] Update contrast tests to evaluate both variants and run the targeted test to green.
|
||||
- [ ] Commit only `src/lib/theme-presets.ts` and `src/lib/theme-contrast.test.ts` with `feat: add complete light and dark presets`.
|
||||
|
||||
### Task 2: Runtime light/dark variables
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/components/theme-vars.tsx`
|
||||
- Modify: `src/app/globals.css`
|
||||
- Create: `src/components/theme-vars.test.tsx`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: complete `ThemePreset` and mode-qualified website settings.
|
||||
- Produces: one server-generated style containing `:root{...}` and `html.dark{...}` variables.
|
||||
|
||||
- [ ] Add a failing render test that requires separate light/dark variable blocks and different preset-specific background values.
|
||||
- [ ] Extract palette loading and CSS generation into testable helpers in `theme-vars.tsx`; read legacy keys for light fallback and `<key>_dark` for dark overrides.
|
||||
- [ ] Remove hardcoded color declarations from `html.dark` while retaining input/table behavioral selectors.
|
||||
- [ ] Run the new test and existing contrast suite to green.
|
||||
- [ ] Commit the three files with `feat: generate theme-aware light and dark variables`.
|
||||
|
||||
### Task 3: Complete admin persistence
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/actions/admin-theme.ts`
|
||||
- Modify: `src/app/admin/theme/page.tsx`
|
||||
- Create: `src/lib/theme-settings.ts`
|
||||
- Create: `src/lib/theme-settings.test.ts`
|
||||
|
||||
**Interfaces:**
|
||||
- Produces: `settingKey(key: ThemeColorKey, mode: ThemeMode): string` and `presetSettings(preset: ThemePreset): Array<[string, string]>`.
|
||||
- Consumes: canonical preset model from Task 1.
|
||||
|
||||
- [ ] Add failing tests proving `presetSettings` returns every light key plus every `_dark` key with no duplicates.
|
||||
- [ ] Implement pure setting mapping helpers and use them in `applyPreset` so a preset writes the full pair.
|
||||
- [ ] Render light and dark color sections in the admin form and update `saveTheme` to persist both sets.
|
||||
- [ ] Preserve legacy unqualified light keys and use `_dark` suffixes only for dark values.
|
||||
- [ ] Run mapping, theme, action-contract, typecheck, and relevant UI tests.
|
||||
- [ ] Commit the four files with `feat: persist complete multitheme palettes`.
|
||||
|
||||
### Task 4: EpicNext popup and final verification
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/components/cms-info-popup.tsx`
|
||||
- Modify: `src/components/cms-info-popup.test.tsx`
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: semantic runtime CSS variables.
|
||||
- Produces: EpicNext-branded footer trigger and modal copy.
|
||||
|
||||
- [ ] Change the popup test first to require `EpicNext Info`, `EpicNext`, and `Modern Next.js CMS`; run it and confirm it fails on AtomCMS copy.
|
||||
- [ ] Replace AtomCMS branding and credits without introducing literal theme colors.
|
||||
- [ ] Run popup and theme tests, then `pnpm typecheck`, `pnpm test`, and `pnpm build`.
|
||||
- [ ] Inspect `git diff --check` and confirm `package.json` remains unstaged and unchanged by this implementation.
|
||||
- [ ] Commit popup files with `feat: rebrand CMS information as EpicNext`.
|
||||
- [ ] Push the completed commits to `origin/main` only after all verification succeeds.
|
||||
@@ -1,53 +0,0 @@
|
||||
# Semantic Theme Contrast Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Make ordinary public and admin text readable across every EpicNext light/dark preset by replacing concrete palette choices with tested semantic colors.
|
||||
|
||||
**Architecture:** Extend the runtime CSS generator with semantic foreground, solid-foreground, subtle-background, and border variables. Central CSS utilities expose those meanings to components. A scoped source audit prevents risky hard-coded admin text colors while allowing explicit graphical preview files.
|
||||
|
||||
**Tech Stack:** Next.js 16, TypeScript, CSS custom properties, Tailwind CSS 4, Vitest.
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- Work directly on `main` in `E:\Users\simol\Desktop\EpicNext-cms`.
|
||||
- Preserve and never stage the existing `package.json` modification.
|
||||
- Maintain WCAG AA 4.5:1 for ordinary text.
|
||||
- Do not recolor favicon, catalog-art, image, or color-picker previews.
|
||||
- Verify the complete test suite, typecheck, and production build before publication.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Semantic contrast generation
|
||||
|
||||
**Files:** `src/lib/theme-contrast.ts`, `src/lib/theme-contrast.test.ts`, `src/lib/theme-css.ts`, `src/components/theme-vars.test.ts`
|
||||
|
||||
- [ ] Add failing tests for muted/subtle/disabled text, sidebar text, and success/warning/error/info pairs across every preset and mode.
|
||||
- [ ] Extend `derivePublicForegrounds` and `themePaletteCss` to emit the tested variables.
|
||||
- [ ] Run the four theme test files and commit with `feat: derive semantic theme contrast tokens`.
|
||||
|
||||
### Task 2: Semantic CSS utilities and admin shell
|
||||
|
||||
**Files:** `src/app/globals.css`, `src/app/admin/layout.tsx`, `src/components/admin/admin-nav-link.tsx`, `src/lib/admin-theme-source-audit.test.ts`
|
||||
|
||||
- [ ] Add a failing source-audit test that rejects risky fixed text colors in the admin shell.
|
||||
- [ ] Add semantic utilities for text hierarchy, statuses, notices, sidebar, tables, and inputs.
|
||||
- [ ] Replace the hard-coded admin sidebar and navigation palette with semantic variables.
|
||||
- [ ] Run the audit and theme tests and commit with `feat: theme admin shell semantically`.
|
||||
|
||||
### Task 3: Admin-wide ordinary text migration
|
||||
|
||||
**Files:** ordinary UI files under `src/app/admin` and `src/components/admin`; exclude explicit graphical preview files in the audit allowlist.
|
||||
|
||||
- [ ] Expand the failing audit to reject `text-gray-400`, `text-gray-500`, `text-white`, and raw text hex colors outside the allowlist.
|
||||
- [ ] Mechanically replace muted/disabled/status text utilities with semantic utilities and variables.
|
||||
- [ ] Inspect status badges and notices to ensure their text/background use the same semantic family.
|
||||
- [ ] Run audit, full test suite, and typecheck; commit with `refactor: use semantic colors across admin`.
|
||||
|
||||
### Task 4: Final verification and publication
|
||||
|
||||
**Files:** no additional production files.
|
||||
|
||||
- [ ] Run `pnpm test`, `pnpm typecheck`, and `pnpm build`.
|
||||
- [ ] Run `git diff --check` and confirm `package.json` remains unstaged.
|
||||
- [ ] Review the final diff for graphical preview exclusions and publish to `origin/main` after approval.
|
||||
@@ -1,78 +0,0 @@
|
||||
# Admin UX Cleanup Phase 1 — Implementation Plan
|
||||
|
||||
> **For agentic workers:** Execute task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Remove double hub headers, wire orphan routes into tabs, dedupe theme/language controls, group Radio tabs, and differentiate Access vs Moderation icons.
|
||||
|
||||
**Architecture:** Config-driven hubs in `src/lib/admin-nav.ts`; chrome in `AdminHubChrome` / `AdminSectionTabs`; layout controls in `src/app/admin/layout.tsx`. No new routes — only navigation and presentation.
|
||||
|
||||
**Tech Stack:** Next.js App Router, React, Tailwind, Lucide, existing admin CSS tokens.
|
||||
|
||||
**Spec:** `docs/superpowers/specs/2026-07-17-admin-ux-cleanup-design.md`
|
||||
|
||||
---
|
||||
|
||||
## File map
|
||||
|
||||
| File | Role |
|
||||
|------|------|
|
||||
| `src/lib/admin-nav.ts` | Hub tabs, Radio `group`, icon imports |
|
||||
| `src/components/admin/admin-section-tabs.tsx` | Optional grouped tab rows |
|
||||
| `src/components/admin/admin-hub-chrome.tsx` | Pass tabs through (no API change if tabs shape extends) |
|
||||
| `src/app/admin/layout.tsx` | Theme/lang: sidebar always; topbar `lg:hidden` only |
|
||||
| `src/app/admin/**/page.tsx` (hub lists) | Strip redundant `h1` + duplicate intro blocks |
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Extend tab type + Radio groups + orphan tabs + icons
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/lib/admin-nav.ts`
|
||||
- Modify: `src/components/admin/admin-section-tabs.tsx`
|
||||
|
||||
- [ ] Add optional `group?: string` to `AdminHubTab` / `AdminTab`
|
||||
- [ ] Users: add Multi-accounts tab
|
||||
- [ ] Engagement: add Event types + Templates tabs
|
||||
- [ ] Observability: add Chat, Commands, Trades, Activity, Economy, Errors; tighten Logs `match` to exact index only via scorer (href-only is enough if subpaths are longer)
|
||||
- [ ] Radio: set `group: "primary"` / `group: "tools"` on tabs
|
||||
- [ ] Moderation nav icon → `Gavel` (or `ShieldAlert`); keep Access as `Ban`
|
||||
- [ ] Render grouped tabs: if any tab has `group`, render one nav per distinct group (label Primary / Tools only for radio tools group — use human labels from group id: `primary` unlabeled or “Main”, `tools` → “Tools”)
|
||||
|
||||
### Task 2: Theme / language placement
|
||||
|
||||
**Files:**
|
||||
- Modify: `src/app/admin/layout.tsx`
|
||||
|
||||
- [ ] Keep switchers in sidebar
|
||||
- [ ] Wrap topbar switchers in `className="flex … lg:hidden"` so desktop shows them once
|
||||
|
||||
### Task 3: Strip redundant hub list headers
|
||||
|
||||
**Files:** Hub **list/overview** pages that duplicate shell title (not entity detail/create):
|
||||
|
||||
Strip the page-level title row (`h1` / icon header duplicating hub), keep filters and action buttons.
|
||||
|
||||
**Remove duplicate title on (list/tab pages):**
|
||||
`banners`, `users`, `users/multi-accounts`, `rooms`, `prefixes`, `sounds`, `tickets`, `tickets/templates`, `polls`, `online`, `moderation`, `moderation/actions`, `moderation/cfh`, `moderation/team`, `logs` (if present), `logs/audit`, `logs/chat`, `logs/commands`, `logs/trades`, `events`, `events/types`, `devops`, `devops/errors`, `analytics`, `analytics/activity`, `analytics/economy`, `catalog` (list chrome only)
|
||||
|
||||
**Keep title on:**
|
||||
`polls/create`, `polls/[id]`, `events/create`, `events/[id]`, `catalog/[id]`, and any `show`/`edit`/`new` entity pages
|
||||
|
||||
Also strip duplicate headers on other hub tab roots that use different class patterns (articles, photos, ads, radio overview, settings, etc.) if they repeat hub title — grep for similar patterns.
|
||||
|
||||
### Task 4: Verify + commit
|
||||
|
||||
- [ ] Spot-check tab active states: `/admin/users` vs `/admin/users/multi-accounts`, `/admin/logs` vs `/admin/logs/chat`, `/admin/events` vs `/admin/events/types`
|
||||
- [ ] Commit + push
|
||||
|
||||
---
|
||||
|
||||
## Spec coverage
|
||||
|
||||
| Spec item | Task |
|
||||
|-----------|------|
|
||||
| 1.1 Single hub header | Task 3 |
|
||||
| 1.2 Orphan routes | Task 1 |
|
||||
| 1.3 Theme/lang | Task 2 |
|
||||
| 1.4 Radio groups | Task 1 |
|
||||
| 1.5 Icons | Task 1 |
|
||||
Reference in new issue
Block a user