veza/docs/archive/frontend-sessions-2026/UI_MIGRATION_SUMMARY.md
senke 7c9eece09a
Some checks failed
Backend API CI / test-unit (push) Has been cancelled
Backend API CI / test-integration (push) Has been cancelled
Veza CI / Rust (Stream Server) (push) Has been cancelled
Veza CI / Backend (Go) (push) Has been cancelled
Veza CI / Notify on failure (push) Has been cancelled
Veza CI / Frontend (Web) (push) Has been cancelled
Frontend CI / test (push) Has been cancelled
Security Scan / Secret Scanning (gitleaks) (push) Has been cancelled
chore(cleanup): J1 — purge 220MB debris, archive session docs (complete)
First-attempt commit 02728909f only captured the .gitignore change; the
pre-commit hook silently dropped the 343 staged moves/deletes during
lint-staged's "no matching task" path. This commit re-applies the intended
J1 content on top of 24af2f72b (which was pushed in parallel).

Uses --no-verify because:
- J1 only touches .md/.json/.log/.png/binaries — zero code that would
  benefit from lint-staged, typecheck, or vitest
- The hook demonstrated it corrupts pure-rename commits in this repo
- Explicitly authorized by user for this one commit

Changes (343 total: 169 deletions + 174 renames):

Binaries purged (~167 MB):
- veza-backend-api/{server,modern-server,encrypt_oauth_tokens,seed,seed-v2}

Generated reports purged:
- 9 apps/web/lint_report*.json (~32 MB)
- 8 apps/web/tsc_*.{log,txt} + ts_*.log (TS error snapshots)
- 3 apps/web/storybook_*.json (1375+ stored errors)
- apps/web/{build_errors*,build_output,final_errors}.txt
- 70 veza-backend-api/coverage*.out + coverage_groups/ (~4 MB)
- 3 veza-backend-api/internal/handlers/*.bak

Root cleanup:
- 54 audit-*.png (visual regression baselines, ~11 MB)
- 9 stale MVP-era scripts (Jan 27, hardcoded v0.101):
  start_{iteration,mvp,recovery}.sh,
  test_{mvp_endpoints,protected_endpoints,user_journey}.sh,
  validate_v0101.sh, verify_logs_setup.sh, gen_hash.py

Session docs archived (not deleted — preserved under docs/archive/):
- 78 apps/web/*.md     → docs/archive/frontend-sessions-2026/
- 43 veza-backend-api/*.md → docs/archive/backend-sessions-2026/
- 53 docs/{RETROSPECTIVE_V,SMOKE_TEST_V,PLAN_V0_,V0_*_RELEASE_SCOPE,
          AUDIT_,PLAN_ACTION_AUDIT,REMEDIATION_PROGRESS}*.md
                        → docs/archive/v0-history/

README.md and CONTRIBUTING.md preserved in apps/web/ and veza-backend-api/.

Note: The .gitignore rules preventing recurrence were already pushed in
02728909f and remain in place — this commit does not modify .gitignore.

Refs: AUDIT_REPORT.md §11
2026-04-14 17:12:03 +02:00

4.2 KiB

Migration UI - Veza Frontend V2 → Apps/Web

Migration Complétée

Les composants UI de veza_frontend_web_v2 ont été intégrés dans apps/web avec compatibilité rétroactive.

Composants Migrés

1. Button (button.tsx)

  • Design Kodo v2 intégré
  • Support des variants v2 : primary, secondary, ghost, gaming, terminal, nature
  • Compatibilité shadcn : default, destructive, outline, link
  • Support de la prop icon
  • ForwardRef pour compatibilité

2. Card (card.tsx)

  • Design Kodo v2 intégré
  • Variants : default, manga, gaming, glass
  • Compatibilité avec CardHeader, CardTitle, CardContent, CardDescription, CardFooter
  • Mapping automatique des anciens variants (outlineddefault, elevatedgaming)

3. Input (input.tsx)

  • Design Kodo v2 intégré
  • Support de label et icon
  • Composant SearchInput inclus
  • Composant FileUpload inclus
  • ForwardRef pour compatibilité

4. Badge (badge.tsx)

  • Design Kodo v2 intégré
  • Variants Kodo : cyan, magenta, lime, gold, terminal
  • Compatibilité shadcn : default, primary, success, warning, error, secondary
  • Support de icon, dot, count

5. Progress (progress.tsx)

  • Design Kodo v2 intégré
  • Variants : default, gaming, segmented
  • Couleurs : cyan, magenta, lime, gold
  • Support de labelLeft et labelRight
  • Alias ProgressBar pour compatibilité

6. Autres Composants

  • ImageCropper.tsx - Copié tel quel
  • ImageViewerModal.tsx - Copié tel quel
  • WaveformVisualizer.tsx - Copié tel quel
  • Toast.tsx - Copié tel quel (utilisé via ToastContext)

Sauvegarde

Le dossier UI original a été sauvegardé dans :

  • apps/web/src/components/ui.backup/

Compatibilité

Rétrocompatibilité Maintenue

Tous les imports existants continuent de fonctionner :

import { Button } from '@/components/ui/button';
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { Badge } from '@/components/ui/badge';
import { Progress } from '@/components/ui/progress';

🎨 Nouveau Design Kodo

Les composants utilisent maintenant le design system "Kodo" avec :

  • Couleurs : kodo-cyan, kodo-magenta, kodo-lime, kodo-gold
  • Backgrounds : kodo-void, kodo-ink, kodo-graphite, kodo-slate, kodo-steel
  • Styles cyberpunk/modernes

Vérifications

Linter

  • Aucune erreur de lint détectée

Types TypeScript

  • Tous les composants sont typés
  • ForwardRef utilisé pour compatibilité React

Couleurs Tailwind

  • Les couleurs Kodo sont déjà définies dans apps/web/src/index.css
  • Pas besoin de configuration supplémentaire

Prochaines Étapes Recommandées

  1. Tester visuellement : Vérifier que les composants s'affichent correctement
  2. Tester fonctionnellement : Vérifier que les interactions fonctionnent
  3. Migration progressive : Remplacer progressivement les anciens styles par les nouveaux variants Kodo
  4. Documentation : Mettre à jour la documentation des composants UI

Notes

  • Les composants conservent leur compatibilité avec le code existant
  • Le design est maintenant unifié avec le style Kodo de la v2
  • Les fonctionnalités backend restent intactes (pas de changement dans la logique)

Fichiers Modifiés

  • apps/web/src/components/ui/button.tsx - Adapté avec design Kodo
  • apps/web/src/components/ui/card.tsx - Adapté avec design Kodo + compatibilité
  • apps/web/src/components/ui/input.tsx - Adapté avec design Kodo
  • apps/web/src/components/ui/badge.tsx - Adapté avec design Kodo
  • apps/web/src/components/ui/progress.tsx - Adapté avec design Kodo

Fichiers Copiés

  • apps/web/src/components/ui/ImageCropper.tsx
  • apps/web/src/components/ui/ImageViewerModal.tsx
  • apps/web/src/components/ui/WaveformVisualizer.tsx
  • apps/web/src/components/ui/Toast.tsx

Migration complétée avec succès ! 🎉

Le frontend apps/web utilise maintenant le design moderne de veza_frontend_web_v2 tout en conservant toutes les fonctionnalités backend existantes.