From 82b4a7849a1b3c5bc5073e818fc3e8c6d8f2fec1 Mon Sep 17 00:00:00 2001
From: sdarbinyan <sdarbinyan@4pay.ru>
Date: Fri, 17 Jul 2026 10:24:18 +0400
Subject: [PATCH] docs(static-pages): backoffice redirect + StaticPages.md

Milestone 7 of the Static Pages Module sprint.

- app.routes.ts: /backoffice/static-pages now redirects to /edit/static-pages
  (absolute redirectTo) instead of rendering BackofficeComingSoonPageComponent
  - Static Pages is a first-class Project Editor module, not a second CRUD
    surface over the same bootstrap.staticPages data.
- New docs/StaticPages.md: full field reference (General/Localization/SEO/
  Media/Publishing), the enabled+status storefront-gating story and its
  backward-compat default (existing/legacy data normalizes to
  enabled+published so nothing gets silently un-published; only new pages
  default to draft), CRUD/search/filter/bulk, the "mutate from the
  unfiltered list" implementation note, rich-text/HTML-mode contract
  (pointer to EDITOR.md), nav integration, and the export/import/draft/
  publish compatibility statement.
- docs/EDITOR.md: Static Pages row in the Sections table (was previously
  absent - the row lived implicitly in Footer's description), HTML editor
  section updated with the Sprint X+2 toolbar additions + validation
  contract, redirect noted near the route line. `docs/Project-Editor.md`
  (named in the original brief) no longer exists - superseded by EDITOR.md
  per that file's own header; documentation went there + the new file
  instead.
- docs/PROJECT.md: doc index entry for StaticPages.md.

Gate: tsc --noEmit, npm test (57/57), arch:check, build all green.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 docs/EDITOR.md        |  9 +++--
 docs/PROJECT.md       |  1 +
 docs/StaticPages.md   | 84 +++++++++++++++++++++++++++++++++++++++++++
 src/app/app.routes.ts |  7 ++--
 4 files changed, 97 insertions(+), 4 deletions(-)
 create mode 100644 docs/StaticPages.md

diff --git a/docs/EDITOR.md b/docs/EDITOR.md
index 330d599..4980237 100644
--- a/docs/EDITOR.md
+++ b/docs/EDITOR.md
@@ -15,7 +15,7 @@ src/app/features/project-editor/
   facade/      ProjectEditorFacade
 ```
 
-Route: `/edit/:section` or `/{lang}/edit/:section`.
+Route: `/edit/:section` or `/{lang}/edit/:section`. `/backoffice/static-pages` (the Admin dashboard) redirects here (`/edit/static-pages`) rather than hosting a second CRUD surface over the same `bootstrap.staticPages` data (Sprint X+2 — see `docs/StaticPages.md`).
 
 ## Facade
 
@@ -32,6 +32,7 @@ Route: `/edit/:section` or `/{lang}/edit/:section`.
 | Footer | `footer-section` | company info, address, phone, email, copyright, payment icons, social links, static pages list |
 | Homepage | `homepage-section` | homepage section list: visibility, order (drag-and-drop), layout strategy, columns |
 | Widgets | `widgets-section` | homepage widget configuration — typed editors for hero/categories/product-collection, JSON fallback for everything else |
+| Static Pages | `static-pages-editor` (`features/content-management/`) | Full CRUD, media, SEO, per-page draft/publish, device preview, nav integration — see `docs/StaticPages.md` (Sprint X+2) |
 | Marketplace Features | `features-section` | feature flags, catalog navigation mode, search suggestions/history, recently viewed, reviews/questions/recommendations |
 | Languages | `languages-section` | add/remove supported locale, set default locale; syncs translation keys across static pages and nav labels via `LocaleSyncService` |
 | Navigation | `navigation-section` | header nav: add/remove/reorder/edit label/URL/visibility, per-locale via `app-locale-tabs`. Flat footer nav: same. Grouped (column-based) footer nav is read-only here — edit via Footer tab. |
@@ -118,7 +119,11 @@ Interaction feedback + motion applied consistently, all gated behind `prefers-re
 
 **Status: working.** Verified live 2026-07-16 — typing captured, toolbar commands functional (bold toggles, `insertUnorderedList` wraps `<ul><li>`, H2/H3/link/image/table), `htmlChange` emits on every edit, and a "Код" toggle swaps to raw-HTML editing.
 
-**Caveat:** implemented on the deprecated `document.execCommand` API. It works in all current browsers today but is a legacy web API with no modern drop-in replacement; if a future browser drops it, this component needs a rewrite (e.g. a maintained rich-text library). By design it emits **raw, unsanitized** HTML — sanitization is a storefront-render concern, not an authoring one (see `docs/BACKEND.md` item 4 on server-side content moderation on publish).
+**Toolbar (Sprint X+2 additions):** horizontal rule, code block (`<pre>`), embed (prompt for a URL, inserts a sandboxed `<iframe sandbox="allow-scripts allow-same-origin">`) — alongside the original bold/italic/underline/H2/H3/lists/link/image/table set.
+
+**HTML-mode validation (Sprint X+2):** switching from raw-HTML back to the visual surface now runs `schema/validators/primitives.validateHtml` (stack-based tag-balance check) first; a malformed edit (unclosed/mismatched tag) stays in code mode with an inline error instead of silently corrupting the visual editor.
+
+**Caveat:** implemented on the deprecated `document.execCommand` API. It works in all current browsers today but is a legacy web API with no modern drop-in replacement; if a future browser drops it, this component needs a rewrite (e.g. a maintained rich-text library). By design it emits **raw, unsanitized** HTML — sanitization is a storefront-render concern, not an authoring one (see `docs/BACKEND.md` item 4 on server-side content moderation on publish; `StaticPageComponent` and `StaticPagePreviewComponent` both run content through `DomSanitizer` before render).
 
 ## Field-description / dropdown UX (Sprint 19+)
 
diff --git a/docs/PROJECT.md b/docs/PROJECT.md
index 15bda86..58a7a04 100644
--- a/docs/PROJECT.md
+++ b/docs/PROJECT.md
@@ -24,6 +24,7 @@ Every tenant conceptually has three surfaces on this one codebase:
 - **[FRONTEND.md](FRONTEND.md)** — app structure, routing, i18n, theming, state management (signals/facades, no NgRx), dynamic rendering.
 - **[BOOTSTRAP.md](BOOTSTRAP.md)** — the `BootstrapConfig` model, field-by-field, with a representative example JSON.
 - **[EDITOR.md](EDITOR.md)** — the Project Editor: every section, the save/publish/draft/reset model, and the field-description/dropdown UX.
+- **[StaticPages.md](StaticPages.md)** — the Static Pages module: full field reference, per-page draft/publish gating, CRUD/search/filter/bulk, rich text, device preview, nav integration (Sprint X+2).
 - **[PROJECT-STRUCTURE.md](PROJECT-STRUCTURE.md)** — folder-by-folder tour of `src/app/**` with a worked "add a new feature" example (admin dashboard).
 - **[ADMIN.md](ADMIN.md)** — Sprint 19 admin dashboard: routing, architecture, data sources, known gaps.
 - `docs/architecture/foundation/**` — the enforced ADRs (ADR-001…ADR-010) and standards docs (Coding-Standards, Naming-Conventions, Dependency-Rules, Folder-Blueprint, Import-Boundary-Matrix, State-Management-Standards, Configuration-Standards, Component-Standards, Service-Standards). These are governance, not narrative — read them directly; `ARCHITECTURE.md` only links to them.
diff --git a/docs/StaticPages.md b/docs/StaticPages.md
new file mode 100644
index 0000000..1c5fd80
--- /dev/null
+++ b/docs/StaticPages.md
@@ -0,0 +1,84 @@
+# Static Pages (Project Editor module)
+
+Sprint X+2. Full-featured CRUD editor for tenant static content (About, Privacy, Terms, Contacts, custom pages, etc.), living inside the Project Editor at `/edit/static-pages`. Edits `bootstrap.staticPages` directly — the same model the storefront renders from (`docs/BOOTSTRAP.md`), no parallel content store.
+
+`/backoffice/static-pages` (Admin dashboard) redirects here rather than hosting a second CRUD UI over the same data.
+
+## Where it lives
+
+```
+src/app/features/content-management/
+  models/content-page.model.ts       ContentPage — the CRUD-facing shape
+  services/content-page.service.ts   normalize / resolve / validate / serialize <-> StaticPageConfig
+  facade/content-management.facade.ts
+  components/
+    static-pages-editor.component.*  the editor UI (list + per-page card)
+    static-page-preview/             device preview (desktop/tablet/mobile)
+
+src/app/shared/models/config/static-page.model.ts   StaticPageConfig — the bootstrap wire format
+src/app/features/project-editor/components/html-editor/   MarketplaceHtmlEditorComponent (rich text)
+src/app/core/config/static-page-resolver.service.ts        storefront resolver
+```
+
+`ContentPageService` is the single translation layer between the editor's `ContentPage[]` and the bootstrap's `Record<string, StaticPageConfig>` (or the legacy array format) — normalize/resolve/validate/serialize all live there. Nothing else should hand-roll that mapping.
+
+## Field reference
+
+### General
+- `id` — stable key, also the bootstrap record key.
+- `slug` — used for duplicate-slug detection and as the `route` default.
+- `route` — **independently editable** from `slug` (defaults from it, but can diverge — e.g. a legacy redirect path). Validated for duplicates against every other page's route.
+- `enabled` — master on/off switch. A disabled page never resolves on the storefront, regardless of `status`.
+- Navigation visibility — `showInHeader`, `showInFooter`, `showInSitemap` (independent per-surface flags, unrelated to `enabled`).
+- `order` — sort position in the editor list and (for footer pages) the auto-generated footer nav group.
+- `icon` — optional icon identifier.
+
+### Localization
+- `title` (per locale, in `translations[locale].title`) and a top-level `title` fallback.
+- `translations[locale].html` — the rich-text/HTML body, one per supported locale.
+- `customTemplate` — optional template identifier; consumed by nothing yet (data-only field, forward-compatible with a future template-selection feature).
+
+### SEO
+Per top-level `seo` and per-translation `translations[locale].seo` (locale-specific overrides win when resolving): `title`, `description`, `keywords`, `canonical`, `robots`, `ogTitle`, `ogDescription`, `ogImage`.
+
+### Media
+- `heroImage`, `thumbnail` — wired through the shared `MediaPickerComponent` (same picker used by Branding/Footer logos).
+- `gallery: string[]` — a lightweight comma-separated URL list ("future ready" per the brief; no dedicated multi-upload UI yet).
+
+### Publishing
+- `status: 'draft' | 'published'` — **per-page** publish lifecycle, independent of the whole-bootstrap draft/publish cycle (see below).
+- Modified indicator — an "unsaved changes" badge per page, diffed against the originally loaded/published snapshot (`ProjectEditorFacade.originalStaticPages`).
+
+## The enabled + status gating story
+
+A static page resolves on the storefront (`ContentPageService.resolvePage`, used by both `StaticPageResolverService` for the page route and `FooterResolverService` for the auto-generated footer nav group) **only when `enabled === true` AND `status === 'published'`.** This is independent of whether the surrounding bootstrap itself has been published — a page marked `draft` stays invisible even after the tenant hits "Publish" on the whole config, and only becomes visible once its own status flips to `published`.
+
+**Compatibility default:** normalizing existing bootstrap data (loaded from the backend, imported, or read from a legacy array-format `staticPages`) defaults missing `enabled`/`status` to `enabled: true, status: 'published'` — pre-existing pages never get silently un-published by this feature landing. Only the editor's **create-page** action opts a brand-new page into `status: 'draft'` by default, so newly authored content doesn't go live until an author explicitly publishes it.
+
+The Static Pages editor's own **Live Preview** (desktop/tablet/mobile, `StaticPagePreviewComponent`) intentionally bypasses this gate — it renders straight from the page's current in-memory HTML, so a draft page can still be previewed before publishing.
+
+## CRUD, search, filter, bulk actions
+
+- Create, duplicate (clones a page as a new `draft`), delete (confirm dialog), reorder (up/down — not drag-and-drop; see below).
+- Search across id/slug/route/title (all locales); filter by status (draft/published) or by locale (hides pages missing a translation for the selected locale).
+- Bulk actions (multi-select checkboxes): delete, enable, disable, publish, unpublish.
+- **Important implementation detail:** every mutation (create/duplicate/delete/move/bulk) operates on the full, unfiltered page list, never the search/filter-narrowed view — reading from the filtered view before writing back would silently delete whatever the active filter was hiding. See the `persist()` comment in `static-pages-editor.component.ts`.
+- Reorder is up/down (`move()`), not literal drag handles — a deliberate, lower-complexity scope call; swapping in drag-and-drop later is additive.
+
+## Validation
+
+`ContentPageService.validatePages()` returns: `duplicateSlugs`, `duplicateRoutes` (checked independently — a route can diverge from its slug), `emptyTitles`, `invalidHtml` (via `schema/validators/primitives.validateHtml`), `invalidSeo` (canonical/OG-image URL shape, and `robots` against a known-token set: `index`, `noindex`, `follow`, `nofollow`, and their comma-joined combinations). Surfaced as per-page badges in the editor.
+
+This is layered under (not a replacement for) `ProjectValidator`'s existing platform-wide checks (`docs/EDITOR.md`'s "Configuration schema..." section), which already cover duplicate slugs and cross-surface duplicate routes (pages vs. static pages) at the whole-bootstrap level.
+
+## Rich text editor
+
+`MarketplaceHtmlEditorComponent` — see `docs/EDITOR.md`'s "HTML editor (Static Pages)" section for the full toolbar list, the Sprint X+2 additions (horizontal rule, code block, embed), and the HTML-mode validation contract.
+
+## Navigation integration
+
+The Navigation section (`navigation-section.component`) has an "Insert page link" control (page picker + button) next to both header and footer "Add link." It creates a `NavigationItemConfig { type: 'staticPage', key: <pageId> }` — a shape the resolvers (`StaticPageResolverService`, `FooterResolverService`) already understood before this sprint; only the editor-side create path was missing. A static-page-linked nav row shows a "Linked to page" indicator instead of editable label/URL fields, since both are derived dynamically from the linked page.
+
+## Export / import / draft / publish
+
+No changes to `ProjectEditorIoService` or `ProjectEditorDraftStorageService` — static pages flow through `bootstrap.staticPages` exactly as before, so JSON export/import and the draft-autosave/publish cycle work unmodified. All Sprint X+2 fields are additive and optional at the wire level.
diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 0c32b87..5f85400 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -87,9 +87,12 @@ const coreRoutes: Routes = [
         canDeactivate: [adminCategoryDirtyGuard]
       },
       {
+        // Static Pages is a first-class Project Editor module (Sprint X+2), not a
+        // separate backoffice CRUD surface - redirect here rather than build a
+        // second UI over the same bootstrap.staticPages data.
         path: 'static-pages',
-        loadComponent: () => import('./features/backoffice/shared/backoffice-coming-soon-page.component').then(m => m.BackofficeComingSoonPageComponent),
-        data: { titleKey: 'dashboard.actionStaticPages' }
+        redirectTo: '/edit/static-pages',
+        pathMatch: 'full'
       },
       {
         path: 'transactions',