# Skills portail - integration utile sans surcouche

## Intention

Le portail dispose deja d'un socle UX et metier solide.  
L'objectif n'est donc pas d'injecter artificiellement une nouvelle couche de "skills", mais de :

- capitaliser sur les briques deja presentes ;
- renforcer les zones qui apportent un vrai gain utilisateur ;
- eviter les dependances ou abstractions inutiles ;
- garder un portail fluide, lisible et robuste.

En pratique, un "skill" correspond ici a un **bloc de capacite reutilisable** :

- regle de layout ;
- logique UX ;
- moteur de donnees ;
- comportement mobile ;
- outil d'efficacite admin ;
- aide a l'autonomie association.

## Principe de pilotage

Avant d'ajouter un nouveau skill, verifier :

1. si le portail a deja une brique equivalente ;
2. si cette brique peut etre etendue proprement ;
3. si le gain UX ou metier est concret ;
4. si l'ajout ne degrade pas la performance ou la lisibilite.

## Lecture par priorite

### Priorite 1 - Skills structurels

Ces skills sont deja largement presents et doivent rester la base unique.

#### Responsive Engine

Etat :

- deja present

Points d'appui :

- [client/src/hooks/useMobile.tsx](/Users/selecta/Documents/portail-associations/client/src/hooks/useMobile.tsx)
- [client/src/components/DashboardLayout.tsx](/Users/selecta/Documents/portail-associations/client/src/components/DashboardLayout.tsx)
- [client/src/index.css](/Users/selecta/Documents/portail-associations/client/src/index.css)

Role :

- detection mobile / tablette / desktop ;
- adaptation sidebar / densite / structure ;
- reduction des regressions multi-appareils.

#### UI Kit Global

Etat :

- deja present

Points d'appui :

- [client/src/components/ui](/Users/selecta/Documents/portail-associations/client/src/components/ui)
- [client/src/components/portal/PortalSurface.tsx](/Users/selecta/Documents/portail-associations/client/src/components/portal/PortalSurface.tsx)

Role :

- boutons, badges, cartes, dialogues, tables, panneaux ;
- langage visuel commun entre public, association et admin.

#### Layout Manager

Etat :

- deja present

Points d'appui :

- [client/src/components/DashboardLayout.tsx](/Users/selecta/Documents/portail-associations/client/src/components/DashboardLayout.tsx)
- [client/src/components/portal/PortalSurface.tsx](/Users/selecta/Documents/portail-associations/client/src/components/portal/PortalSurface.tsx)

Role :

- structure stable ;
- alignements ;
- marges ;
- paddings ;
- hierarchie des surfaces.

#### Typography System

Etat :

- deja present et relie au module Apparence

Points d'appui :

- [shared/appearance.ts](/Users/selecta/Documents/portail-associations/shared/appearance.ts)
- [client/src/lib/appearance.ts](/Users/selecta/Documents/portail-associations/client/src/lib/appearance.ts)
- [client/src/index.css](/Users/selecta/Documents/portail-associations/client/src/index.css)

Role :

- famille de police ;
- echelle des titres ;
- lisibilite globale ;
- personnalisation sans casser la coherence.

### Priorite 2 - Skills UX

#### Smooth Navigation

Etat :

- partiellement present, renforce dans ce tour

Points d'appui :

- [client/src/components/DashboardLayout.tsx](/Users/selecta/Documents/portail-associations/client/src/components/DashboardLayout.tsx)
- [client/src/pages/Home.tsx](/Users/selecta/Documents/portail-associations/client/src/pages/Home.tsx)
- [client/src/lib/routePrefetch.ts](/Users/selecta/Documents/portail-associations/client/src/lib/routePrefetch.ts)

Role :

- navigation plus immediate ;
- prechargement des vues clefs au survol, au focus et au toucher ;
- reduction de la sensation d'attente entre clic et affichage.

#### Panel Interaction

Etat :

- deja present

Points d'appui :

- composants `Dialog`, `Sheet`, `DropdownMenu`, `Sidebar`
- regroupements d'actions secondaires deja poses sur plusieurs vues

Role :

- ouverture/fermeture propre ;
- actions secondaires discretes ;
- meilleure densite operationnelle.

#### List Enhancer

Etat :

- present par endroits, a propager selon besoin

Points d'appui :

- filtres et vues admin ;
- densite compacte / detaillee ;
- recherche sur annuaire et bordereau.

Role :

- tri ;
- recherche ;
- pagination ;
- lecture dense mais lisible.

#### Action Visibility

Etat :

- deja present sur les zones prioritaires

Role :

- mettre en avant valider / ignorer / appliquer / ouvrir ;
- reduire le bruit visuel ;
- garder une action principale claire.

### Priorite 3 - Skills Data

#### Matching Engine

Etat :

- deja present

Points d'appui :

- [server/associationDirectoryMatcher.ts](/Users/selecta/Documents/portail-associations/server/associationDirectoryMatcher.ts)
- [server/routers.ts](/Users/selecta/Documents/portail-associations/server/routers.ts)

Role :

- detection des correspondances ;
- rapprochement portail / bordereau ;
- reduction des doublons.

#### Fusion Engine

Etat :

- present en logique de validation, a etendre si besoin

Role :

- fusion propre ;
- arbitrage humain ;
- tracabilite.

#### Data Validation

Etat :

- deja largement present

Points d'appui :

- normalisations dans `server/associationDirectory.ts`
- validations schema Zod dans `server/routers.ts`
- helpers partages `shared/*`

#### API Connector (RNA / SIRENE / HelloAsso)

Etat :

- present et renforce

Points d'appui :

- [server/associationReferenceSync.ts](/Users/selecta/Documents/portail-associations/server/associationReferenceSync.ts)
- [docs/compliance/association-directory-official-enrichment.md](/Users/selecta/Documents/portail-associations/docs/compliance/association-directory-official-enrichment.md)

Role :

- enrichissement controle ;
- aucune creation automatique ;
- validation admin obligatoire.

### Priorite 4 - Skills Mobile

#### Mobile Scroll

Etat :

- renforce

Points d'appui :

- [client/src/index.css](/Users/selecta/Documents/portail-associations/client/src/index.css)
- [client/src/lib/appearance.ts](/Users/selecta/Documents/portail-associations/client/src/lib/appearance.ts)

Role :

- limiter les couches couteuses pendant le scroll ;
- garder les fonds immersifs sans penaliser la fluidite.

#### Lazy Loading

Etat :

- deja present sur les routes et certaines cartes

Points d'appui :

- `lazy(...)` dans [client/src/App.tsx](/Users/selecta/Documents/portail-associations/client/src/App.tsx)

#### Prefetch Engine

Etat :

- ajoute dans ce tour

Points d'appui :

- [client/src/lib/routePrefetch.ts](/Users/selecta/Documents/portail-associations/client/src/lib/routePrefetch.ts)

Role :

- precharger les vues les plus frequentes ;
- accelerer la navigation percue ;
- ne rien casser dans le routeur existant.

#### Touch Gestures

Etat :

- a traiter seulement si un vrai besoin apparait

Decision UX :

- ne pas ajouter de gestuelle complexe par defaut ;
- privilegier une ergonomie simple avant les gestures.

### Priorite 5 - Skills Admin

#### Admin Dashboard

Etat :

- deja present

#### Correspondence Manager

Etat :

- deja present et enrichi

Role :

- correspondances a valider ;
- propositions officielles ;
- workflow de decision humain.

#### Notification Engine

Etat :

- deja present

Role :

- alertes ;
- badges ;
- suivi des dossiers prioritaires.

### Priorite 6 - Skills Association

#### Association Portal

Etat :

- deja present et fortement harmonise

#### Reservation Flow

Etat :

- deja present

#### Document Center

Etat :

- deja present

## Ce qui a ete ajoute dans ce tour

### 1. Prefetch discret des routes clefs

Ajout du fichier :

- [client/src/lib/routePrefetch.ts](/Users/selecta/Documents/portail-associations/client/src/lib/routePrefetch.ts)

Et branchement sur :

- la sidebar dashboard/admin ;
- la navigation et les CTA principaux de l'accueil.

Impact attendu :

- navigation plus fluide ;
- sensation de site plus reactif ;
- zero changement de logique metier.

### 2. Clarification strategique

On ne traite pas les skills comme des plugins externes a injecter partout.

On les traite comme :

- des capacites internes ;
- deja presentes ou utiles ;
- propageres seulement quand elles ont un vrai impact.

## Recommandation UX

Le bon ordre reste :

1. structurel ;
2. UX ;
3. data ;
4. mobile ;
5. admin ;
6. association.

Mais dans le code, cela doit se traduire par :

- extension des briques existantes ;
- pas de sur-abstraction ;
- pas de moteur supplementaire si la base actuelle couvre deja le besoin.

## Regle de prudence

Un skill n'est utile que s'il rend le portail :

- plus stable ;
- plus fluide ;
- plus lisible ;
- plus simple a administrer ;
- plus confortable pour l'association.

Sinon, c'est du superflu.