feat(demo): Add apps/demo-ng-zorro and link the three demos

Aperta
#98 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
34/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
angular, nginx, playwright, supabase, typescript

Direzione di ricerca

Read the existing apps/demo-material and apps/demo-tailwind pages, environments, and e2e projects, plus tools/demo-artifacts/shared.mjs and the CI and docs files named in the issue. Start by checking dependency #97 and the shared patterns in @pidrang/demo-shared; then trace the two existing demos through their build and Playwright setup. Done means the new app meets the listed CRUD and sign-in criteria, passes its pages build and e2e, and all three demos link to one another locally and in the pages build.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement layer: demo layer: tooling pkg: new

Context

@pidrang/ng-zorro (#97) needs to be rendered somewhere, the same way #5 and #8 wired their adapters into apps/demo-material and apps/demo-tailwind. Both demos are thin: states, routes and app config come from @pidrang/demo-shared (#43); each app owns its pages, paginator and home page. The link between demos only knows two apps: apps/demo-material/src/environments/environment.ts:4 has tailwindDemoUrl and apps/demo-tailwind/src/environments/environment.ts:4 has materialDemoUrl. tools/demo-artifacts/shared.mjs:10 lists the two demos and four libraries. Demo budgets are 600 KB warning / 1 MB error for the initial bundle.

Scope

  • Add apps/demo-ng-zorro (users, products, orders) on @pidrang/demo-shared and @pidrang/ng-zorro: list with nz-pagination, create, show, edit, delete, sign-in and home pages, with the same behavior as the two other demos.
  • Load only the ng-zorro component styles the pages use, register icons explicitly and provide the ng-zorro i18n locale.
  • Add local and pages configurations, environment.pages.ts with the shared demo account, and a default dev-server port next to 4200/4201.
  • Replace the two single-sibling URLs with a list so each demo links to the two others.
  • Add the demo-ng-zorro-e2e Playwright project, include the demo in tools/demo-artifacts and its e2e, and update CI, docs/demo-artifacts.md, docs/architecture.md, CONTRIBUTING and the README.

Out of scope

Changes to the adapter itself (#97) or to @pidrang/core; deploying the demo on pidrang.dev (follow-up in pidrang/pidrang.github.io once the demo artifacts include it); CLI generation (separate issue).

Acceptance criteria

  • apps/demo-ng-zorro completes list/create/show/edit/delete and sign-in against the local Supabase stack, with equivalent behavior to the two other demos.
  • nx build demo-ng-zorro -c pages passes the existing budgets.
  • The Demo artifacts build contains demo-ng-zorro/ and its pages e2e passes.
  • Each of the three demos links to the two others, locally and in the pages build.

Notes for the dev

Touch a new app and e2e project, the three demos' environments and home pages, tools/demo-artifacts, CI and docs. Keep shared logic in @pidrang/demo-shared, not in the app.

Rules: no code comments, no any/$any; standalone components, signals and inject(). Core production imports only @angular/core and local core modules, never router/common/forms/UI. Other Pidrang libraries depend only on core, except @pidrang/cli-supabase which depends on @pidrang/cli as per the package graph in CLAUDE.md; apps compose adapters. Use conventional commits. For UI changes, validate with Playwright against pnpm exec nx serve demo-material, pnpm exec nx serve demo-tailwind and pnpm exec nx serve demo-ng-zorro; record tested paths and failures.

Depends on

  • #97
Lingua principale
TypeScript
Stelle
2
Fork
2
Merge medio
9h 17m
PR unite (30g)
48

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di pidrang/pidrang

Tutte le issue di pidrang/pidrang

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.