Files

T

Sylvain Duchesne 5a29938130 Modern UI port, render-based @ui tests, dev seed, layer contracts

- Port modern clean theme (DM Sans, orange accent, app-* CSS classes)
  and screen redesigns from festipod-mockups; replace sketchy Ubuntu
  theme. New shared components: BottomNav, EventCover, EventMeetingPoints,
  Toast, AvatarStack, Tag, RelevanceIcon.

- Restructure from prototyping shell to real mobile web app:
  path-based routing (History API), Gallery/DemoMode/PhoneFrame removed,
  Storybook setup for screen/component browsing.

- ConnectScreen ported from mockup (QR-based user connection); routed
  at /profile/connect, wired from FriendsListScreen.

- Dev-only auto-seed of NG wallet when empty
  (gated on NODE_ENV !== 'production'); bootstrapWallet already
  self-checks for non-empty ngSet so safe even in race conditions.

- Render-based @ui test infrastructure: happy-dom + LocalDataProvider +
  RouterProvider via src/shared/test-harness/renderHelper.tsx, exposed
  on the world as renderedDoc. world.hasText/hasField/hasElement prefer
  the rendered DOM and fall back to source for backward compatibility.

- Migrate 25 brittle @ui assertions from regex-on-source to DOM
  queries; delete implementation-detail tests (showDuplicateWarning,
  importableEvents, importedFrom — anti-patterns per the new contract).
  Update feature files where the UI changed: "Mes amis" → "Mon réseau",
  "Mes événements à venir" → "À venir" on home, Thématique removed
  from create-event wizard, etc.

- Path-based @e2e steps (pushState + popstate dispatch) replacing the
  legacy "#/demo/…" hash routing tied to the deleted Gallery.

- Add .project/knowledge/test-layer-contracts.md defining the role of
  each test layer (@ui = display with seed data + DOM, @data = mutations
  through NG broker, @e2e = critical user journeys) with anti-patterns
  and migration consequences.

Test status: 75 passed / 71 skipped (explicit "non implémenté")
/ 2 failed (pre-existing @wip on ngSet.delete() NG ORM limitation).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

2026-05-18 09:49:50 +02:00

3.2 KiB

Raw Blame History

Festipod

Mobile-first web app for discovering and sharing festival/event recommendations through trusted networks.

Architecture

Feature-based: code organized by business domain, not technical layer. See architecture.

src/modules/{event,user,home,auth,workshop,meeting,notification}/
src/shared/          # Components, context, data — importable by all modules
src/app/             # App shell (router, providers, entry point)
src/screens/index.ts # Screen registry (used by Storybook)

Routing

Path-based routing with History API (custom router in src/app/router.tsx).

Path	Screen
`/`	WelcomeScreen
`/login`	LoginScreen
`/home`	HomeScreen
`/events`	EventsScreen
`/events/new`	CreateEventScreen
`/events/:id`	EventDetailScreen
`/events/:id/edit`	UpdateEventScreen
`/events/:id/invite`	InviteScreen
`/events/:id/participants`	ParticipantsListScreen
`/events/:id/meeting-points`	MeetingPointsScreen
`/profile`	ProfileScreen
`/profile/edit`	UpdateProfileScreen
`/profile/friends`	FriendsListScreen
`/profile/share`	ShareProfileScreen
`/users/:id`	UserProfileScreen
`/settings`	SettingsScreen

Screens use useNavigate() and useParams() hooks from the router — no prop drilling.

Data Layer

NextGraph (P2P/local-first) with SHEX shapes and ORM. See data-layer.

BDD Testing

Multi-layer Cucumber/Gherkin in French. See bdd-testing for the setup and test-layer-contracts for what each layer is allowed to test.

@ui scenarios render screens in-process (happy-dom + seed data) and assert on the DOM. @data scenarios test data operations through the real NextGraph broker. @e2e scenarios test the real app UI in the broker iframe. See data-layer-testing.

Quick Start

bun run dev              # Dev server with HMR (port 3000)
bun run build            # Production build to dist/
bun run storybook        # Browse screens and components
bun run test:cucumber    # Run all BDD tests
bun run features:parse   # Regenerate features.ts from .feature files
bun run steps:extract    # Extract step definitions for tooltips
bun run build:orm        # Regenerate ORM from SHEX shapes

Documentation

Architecture — module structure, import rules, app shell
Data Layer — NextGraph, shapes, context, seed data
BDD Testing — Cucumber setup, step layers, feature files
Test Layer Contracts — what each of @ui/@data/@e2e is allowed to test
Screens — screen inventory, registry, sketchy components
Data-Layer Testing — real broker testing, wallet setup, Playwright harness, e2e layer

Briefs (work not yet started)

Multi-store refactor — passer du mono-store actuel à une structure de Group stores par communauté/event/RDV (prérequis multi-user)

3.2 KiB Raw Blame History