MediaLibraryPageComponent replaces the coming-soon placeholder at
/backoffice/media. Built entirely on Sprint 6 Design System primitives
(app-card, app-button, app-input, app-empty-state, app-dialog, app-pagination,
app-skeleton) and Sprint 4 Task 2's MediaRepository/MockMediaRepository.
- Grid view with per-tile filename/size and delete action
- Hidden native file input triggered by an app-button, uploads via
MediaLibraryFacade -> MediaRepository.upload()
- Delete requires confirmation through app-dialog (destructive action)
- Search + pagination wired to MockMediaRepository's list() params
- Loading state shows app-skeleton tiles; empty state shows app-empty-state
- New mediaLibrary.* translation namespace across en/ru/hy
Verified in browser (via a temporary unguarded route, reverted before
commit - /backoffice/media itself requires Telegram QR admin auth not
available in this session): empty state renders correctly with translated
copy, search input and upload button present, no console errors.
Architecture:
- Each brand has its own pages folder with Angular components
- brand-routes.ts defines routes for default brand (dexar)
- brand-routes.novo.ts defines routes for novo brand
- angular.json fileReplacements swaps brand-routes.ts based on build config
Structure:
- src/app/brands/dexar/pages/ - Dexar HTML templates
- src/app/brands/novo/pages/ - Novo components (TS + HTML)
- src/app/brands/brand-routes.ts - Default (dexar) routes
- src/app/brands/brand-routes.novo.ts - Novo routes
This approach allows:
- Adding 3rd, 4th, 5th brands by creating new folders
- Each brand has completely separate templates
- No @if conditionals needed in templates
- Build-time separation (zero runtime overhead)
- Changed contact labels from green to text-secondary color
- Changed contact values/links from green to text-primary with hover effect
- Added proper hover state for all contact card child elements
- Fixed readability issue where green text was on green-tinted background
