sdarbinyan 565fd9b3a8 fix(backoffice): WCAG 2.1 AA accessibility fixes
RC A11Y-01 audit pass, Backoffice (admin/*) area. Builds on 712a7b4/63c9cee's
composition pass (scope="col", skeletons, empty-states) without redoing that
work.

- Sidebar nav landmark: admin-layout's <nav aria-label> reused the
  "Dashboard" nav-item translation key as its landmark label, misleadingly
  announcing the whole sidebar as "Dashboard" - added a dedicated
  adminShell.sidebarLabel key ("Admin sidebar navigation") in en/ru/hy.
  Skip link, #admin-content main landmark, Escape handling, and mobile-drawer
  focus management were already correct - verified, not touched.

- Categories tree drag-and-drop keyboard fallback (WCAG 2.1.1): the category
  tree's native HTML5 DnD (draggable/dragstart/drop) reorders siblings with
  no keyboard equivalent - existing arrow-key tree navigation only expands/
  collapses/selects, never reorders. Added per-row move-up/move-down icon
  buttons (disabled at sibling boundaries), reusing the existing `reorder`
  output so the facade's reorder logic is untouched; new
  adminCategories.moveUp/moveDown keys in en/ru/hy.

- Screen-reader loading announcements: skeleton-row loading states across
  Products, Categories, Customers, Orders, Transactions, Users, Reviews,
  Monitoring (webhooks/events), and Analytics (summary cards + top products)
  were purely visual (app-skeleton is aria-hidden by design) with no
  accessible "loading" text, unlike the storefront/product-details pattern -
  added role="status"/aria-live="polite"/aria-busy + sr-only text using the
  existing common.loading key.

- Table row headers: added scope="row" to the primary identifying cell
  (product/category/customer name, order number, transaction order number,
  user name, review customer, report target, top-products/low-stock product
  name, webhook endpoint) on 9 tables that only had scope="col". Added
  matching `tbody th[scope='row'] { font-weight/color/text-align/
  vertical-align }` + last-row border resets in each component's own scss so
  the semantic change doesn't alter visuals (the shared app-table stylesheet
  styles all <th> as bold/muted by default).

Verified via `git show --stat` of fb1afb7/a03260e and `docs/UI-COMPOSITION-
REVIEW.md`'s Backoffice sections first, per instructions - confirmed
scope="col" coverage already complete, all admin modals already route
through the shared app-dialog (focus-trap/Escape/return-focus already
correct, nothing to fix), and the bare-<select> filters still carry
aria-label per the accepted Sprint 28 decision (not re-migrated to
app-select).

Flagged, not fixed:
- No toast/notification system exists anywhere in this codebase (product/
  category save and delete call the gateway with no success/error UI at
  all, not even a subscribe error handler) - there is nothing to wire
  aria-live onto without adding a new UI mechanism, which is out of scope
  for an a11y-only pass. A prerequisite feature-level fix, not an a11y
  regression.
- Dashboard's per-card metric/status-row/timeline skeletons (dashboard-
  metric, dashboard-status-row, dashboard-timeline) were left without
  aria-live wiring - wrapping each of the ~10 simultaneous mini-widgets in
  its own live region would fire a burst of redundant announcements; needs
  a single page-level "loading dashboard" region instead, a larger change
  than this surgical pass.
- Monitoring's events table and the notifications dropdown (role="menu"
  with a static empty-state message, aria-haspopup="true") were left as-is -
  matches the same partial-widget-pattern precedent already accepted for
  locale-tabs/product-tabs in the storefront and builder passes.
- Analytics `lowStockProducts` table's missing loading-skeleton branch
  (already flagged, not fixed, in the RC-Visual-02 pass) - untouched again
  here for the same reason.

Verified: npx tsc --noEmit clean; npm run build green (only the pre-existing
768.57 kB vs 700 kB initial-bundle budget warning, unrelated to this pass).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-24 09:18:09 +04:00
2026-07-19 15:28:35 +04:00
2026-01-18 18:57:06 +04:00
2026-06-01 00:47:26 +04:00
2026-07-19 15:28:35 +04:00
2026-01-18 18:57:06 +04:00
2026-07-16 00:22:01 +04:00
2026-07-19 15:28:35 +04:00
2026-03-24 02:25:50 +04:00
2026-07-19 15:28:35 +04:00
2026-07-09 01:40:22 +04:00
2026-07-05 00:57:20 +04:00
2026-07-16 00:22:01 +04:00
2026-05-28 12:56:41 +00:00
2026-01-18 19:44:46 +04:00
2026-06-21 23:42:39 +04:00

Marketplace Frontend

Angular marketplace frontend for the client demonstration. The app uses standalone components, signals, runtime branding/configuration, and a production build optimized for the current marketplace experience.

Features

  • Responsive marketplace storefront
  • Category browsing and product detail pages
  • Search and shopping cart flows
  • Telegram login integration
  • Payment handoff through the existing backend contract
  • Runtime branding and configuration loading
  • PWA manifest and service worker configuration

Development

Install dependencies:

npm install

Start the local development server:

npm start

Build for production:

npm run build

The production build is written to dist/dexarmarket/.

Project Structure

src/
├── app/
│   ├── components/          # Shared storefront components
│   ├── core/                # Runtime, config, guards, providers, interceptors
│   ├── dynamic-renderer/    # Page, section, and widget rendering pipeline
│   ├── facades/             # Runtime, website, builder, and backoffice facades
│   ├── pages/               # Storefront, info, legal, cart, search, and item pages
│   ├── services/            # API, cart, auth, SEO, Telegram, and language services
│   └── widgets/             # Dynamic renderer widgets
├── assets/mock/             # Local mock configuration and catalog data
├── environments/            # Development and production environment settings
└── styles/                  # Shared global styles and themes

Useful Checks

npm run build
npm run arch:check

Notes

  • Authentication and payment integrations are intentionally left on their existing contracts.
  • Renderer and runtime architecture should remain stable during demo preparation.
  • Client-facing content should avoid placeholder names, mock labels, and temporary routes.
Description
No description provided
Readme 16 MiB
Languages
TypeScript 71.4%
HTML 15.3%
SCSS 11.9%
Shell 1.3%
JavaScript 0.1%