# TODO - PrimeFaces Freya Extension

**Date** : 2025-12-25
**Statut** : 🚧 EN COURS - Composants composites à créer

---

## 📊 État Actuel du Projet

### ✅ Ce qui est FAIT

1. **Structure du projet**
   - ✅ Architecture multi-modules (runtime, deployment, integration-tests)
   - ✅ Configuration Maven complète (pom.xml)
   - ✅ Métadonnées Quarkus extension

2. **Templates et Layout**
   - ✅ `template.xhtml` - Template principal
   - ✅ `menu.xhtml` - Menu latéral
   - ✅ `topbar.xhtml` - Barre supérieure
   - ✅ `footer.xhtml` - Pied de page
   - ✅ `config.xhtml` - Panneau de configuration
   - ✅ `rightpanel.xhtml` - Panneau latéral droit

3. **Pages prédéfinies**
   - ✅ `landing.xhtml` - Page d'accueil
   - ✅ `login.xhtml` - Page de connexion
   - ✅ `error.xhtml` - Page d'erreur
   - ✅ `notfound.xhtml` - Page 404
   - ✅ `access.xhtml` - Accès refusé
   - ✅ `help.xhtml` - Aide
   - ✅ `invoice.xhtml` - Facture
   - ✅ `empty.xhtml` - Page vide

4. **Java**
   - ✅ `GuestPreferences.java` - Bean de gestion des préférences

5. **Configuration**
   - ✅ `freya.taglib.xml` - Déclaration de 25 composants composites
   - ✅ `primefaces-freya.taglib.xml` - Composant menu personnalisé

6. **Documentation**
   - ✅ `README.md` - Documentation utilisateur
   - ✅ `ANALYSE_INTEGRALE.md` - Analyse technique

---

## ❌ Ce qui MANQUE (CRITIQUE)

### 1. Composants Composites (25 fichiers .xhtml)

**Répertoire cible** : `runtime/src/main/resources/META-INF/resources/freya/`

Le fichier `freya.taglib.xml` déclare 25 composants mais les fichiers XHTML correspondants **n'existent pas encore** :

#### Composants de Layout (5)
- [ ] `freya/menu.xhtml` - Menu réutilisable
- [ ] `freya/card.xhtml` - Carte avec header/footer
- [ ] `freya/panel.xhtml` - Panneau pliable
- [ ] `freya/dialog.xhtml` - Dialogue modal
- [ ] `freya/formDialog.xhtml` - Dialogue avec formulaire

#### Composants de Formulaire (10)
- [ ] `freya/inputText.xhtml` - Champ texte avec validation
- [ ] `freya/inputTextarea.xhtml` - Zone de texte multiligne
- [ ] `freya/inputNumber.xhtml` - Champ numérique formaté
- [ ] `freya/inputPassword.xhtml` - Mot de passe avec feedback
- [ ] `freya/selectOneMenu.xhtml` - Menu déroulant avec filtre
- [ ] `freya/selectManyMenu.xhtml` - Sélection multiple
- [ ] `freya/calendar.xhtml` - Sélecteur de date
- [ ] `freya/checkbox.xhtml` - Case à cocher
- [ ] `freya/radioButton.xhtml` - Bouton radio
- [ ] `freya/fileUpload.xhtml` - Upload de fichier

#### Composants de Données (3)
- [ ] `freya/dataTable.xhtml` - Tableau avec pagination/tri
- [ ] `freya/dataView.xhtml` - Vue de données (list/grid)
- [ ] `freya/treeTable.xhtml` - Tableau arborescent

#### Composants de Navigation (2)
- [ ] `freya/breadcrumb.xhtml` - Fil d'Ariane
- [ ] `freya/steps.xhtml` - Étapes (wizard)

#### Composants d'Action (3)
- [ ] `freya/button.xhtml` - Bouton simple
- [ ] `freya/commandButton.xhtml` - Bouton avec action serveur
- [ ] `freya/linkButton.xhtml` - Bouton lien

#### Composants de Feedback (2)
- [ ] `freya/message.xhtml` - Message pour un composant
- [ ] `freya/growl.xhtml` - Notifications toast

#### Composants Utilitaires (4)
- [ ] `freya/spacer.xhtml` - Espaceur
- [ ] `freya/divider.xhtml` - Séparateur
- [ ] `freya/badge.xhtml` - Badge
- [ ] `freya/avatar.xhtml` - Avatar

**Total : 25 composants à créer**

---

### 2. Documentation des Composants

- [ ] **COMPOSITE_COMPONENTS_DOCUMENTATION.md**
  - Localisation : `runtime/src/main/resources/META-INF/resources/freya/`
  - Contenu : Documentation complète de chaque composant avec :
    - Description
    - Attributs
    - Exemples d'utilisation
    - Snippets de code

---

### 3. Tests d'Intégration

Le module `integration-tests/` contient seulement une page de vérification basique.

À ajouter :
- [ ] Page de démonstration complète des composants
- [ ] Tests automatisés (JUnit/Selenium)
- [ ] Tests de validation de formulaires
- [ ] Tests d'intégration avec Quarkus

---

### 4. Composant Menu Personnalisé (Optionnel)

Le fichier `primefaces-freya.taglib.xml` déclare un composant `menu` avec renderer personnalisé, mais :
- [ ] Classe Java `FreyaMenuRenderer` manquante
- [ ] Classe Java `FreyaMenu` (component-type) manquante

**Note** : Cela peut être optionnel si le composant composite `freya/menu.xhtml` suffit.

---

## 🎯 Priorités

### Priorité CRITIQUE (Bloquant)

**1. Créer les 25 composants composites**
- Sans ces composants, l'extension ne peut pas être utilisée
- Le README promet ces composants mais ils n'existent pas
- Localisation : `runtime/src/main/resources/META-INF/resources/freya/`

### Priorité HAUTE

**2. Documentation des composants**
- Fichier `COMPOSITE_COMPONENTS_DOCUMENTATION.md`
- Explique comment utiliser chaque composant
- Référencé dans le README mais manquant

### Priorité MOYENNE

**3. Page de démonstration**
- Créer `components-demo.xhtml` dans `integration-tests/`
- Montre tous les composants en action
- Permet de tester visuellement l'extension

### Priorité BASSE

**4. Tests automatisés**
- Tests JUnit pour validation
- Tests Selenium pour UI
- Tests d'intégration Quarkus

---

## 📋 Structure des Composants Composites

Chaque composant doit suivre la structure JSF Composite Component :

```xhtml
<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:composite="http://xmlns.jcp.org/jsf/composite"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:p="http://primefaces.org/ui">

    <!-- Interface : Définit les attributs du composant -->
    <composite:interface>
        <composite:attribute name="id" required="false" />
        <composite:attribute name="label" required="false" />
        <composite:attribute name="value" required="false" />
        <composite:attribute name="required" required="false" default="false" />
        <!-- Autres attributs... -->

        <!-- Pour les composants éditables (input, etc.) -->
        <composite:editableValueHolder name="input" targets="inputComponent" />

        <!-- Pour les composants avec actions (button, etc.) -->
        <composite:actionSource name="action" targets="buttonComponent" />
    </composite:interface>

    <!-- Implementation : Structure HTML du composant -->
    <composite:implementation>
        <div class="field">
            <label for="#{cc.clientId}:inputComponent">#{cc.attrs.label}</label>
            <p:inputText id="inputComponent"
                         value="#{cc.attrs.value}"
                         required="#{cc.attrs.required}"
                         styleClass="w-full" />
            <p:message for="inputComponent" />
        </div>
    </composite:implementation>

</ui:composition>
```

---

## 🛠️ Plan d'Action Recommandé

### Phase 1 : Composants Essentiels (Priorité 1)
**Temps estimé : 2-3 jours**

1. Créer le répertoire `runtime/src/main/resources/META-INF/resources/freya/`
2. Créer les composants de formulaire (les plus utilisés) :
   - `inputText.xhtml`
   - `inputTextarea.xhtml`
   - `inputNumber.xhtml`
   - `selectOneMenu.xhtml`
   - `calendar.xhtml`
   - `checkbox.xhtml`
3. Créer les composants de layout :
   - `card.xhtml`
   - `panel.xhtml`
   - `dialog.xhtml`
4. Créer les composants d'action :
   - `button.xhtml`
   - `commandButton.xhtml`

### Phase 2 : Composants Avancés (Priorité 2)
**Temps estimé : 2 jours**

1. Créer les composants de données :
   - `dataTable.xhtml`
   - `dataView.xhtml`
2. Créer les composants utilitaires :
   - `badge.xhtml`
   - `avatar.xhtml`
   - `divider.xhtml`
   - `spacer.xhtml`
3. Créer les composants restants :
   - `breadcrumb.xhtml`
   - `steps.xhtml`
   - `message.xhtml`
   - `growl.xhtml`

### Phase 3 : Documentation et Tests (Priorité 3)
**Temps estimé : 1-2 jours**

1. Créer `COMPOSITE_COMPONENTS_DOCUMENTATION.md`
2. Créer `components-demo.xhtml` avec exemples de tous les composants
3. Tester chaque composant dans `integration-tests/`
4. Valider la compilation et l'utilisation de l'extension

---

## 📚 Ressources Nécessaires

### Documentation Officielle
- [JSF Composite Components](https://docs.oracle.com/javaee/6/tutorial/doc/giqzr.html)
- [PrimeFaces Components](https://www.primefaces.org/showcase/)
- [Freya Theme Demo](https://www.primefaces.org/freya/)

### Exemples de Code
- Templates PrimeFaces existants dans `WEB-INF/`
- Bean `GuestPreferences.java` pour accès aux préférences
- Composant menu dans `WEB-INF/menu.xhtml` (référence)

---

## ⚠️ Points d'Attention

### 1. Binding Bidirectionnel
Les composants éditables (input, select, etc.) doivent utiliser `<composite:editableValueHolder>` pour permettre le binding bidirectionnel avec `value="#{bean.property}"`.

### 2. Validation JSF
Tous les composants de formulaire doivent supporter les validateurs JSF standard et afficher les messages d'erreur avec `<p:message>`.

### 3. AJAX et Update
Les composants doivent supporter les attributs AJAX standards de PrimeFaces (`update`, `process`, `oncomplete`, etc.).

### 4. Accessibilité
Utiliser les attributs ARIA et labels appropriés pour l'accessibilité.

### 5. Responsive Design
Les composants doivent être responsive et utiliser PrimeFlex pour le layout (`w-full`, `p-field`, etc.).

---

## 🎯 Critères de Succès

L'extension sera **COMPLÈTE** quand :

1. ✅ Les 25 composants composites existent et fonctionnent
2. ✅ La documentation `COMPOSITE_COMPONENTS_DOCUMENTATION.md` est complète
3. ✅ Une page de démonstration montre tous les composants
4. ✅ L'extension peut être ajoutée à un projet Quarkus et utilisée immédiatement
5. ✅ Tous les composants suivent les conventions PrimeFaces et JSF
6. ✅ Le README est à jour et reflète l'état réel du projet

---

## 🚀 Pour Démarrer

### 1. Créer le répertoire des composants
```bash
mkdir -p primefaces-freya-extension/runtime/src/main/resources/META-INF/resources/freya
```

### 2. Créer le premier composant (exemple: inputText)
```bash
cat > primefaces-freya-extension/runtime/src/main/resources/META-INF/resources/freya/inputText.xhtml << 'EOF'
<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:composite="http://xmlns.jcp.org/jsf/composite"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:p="http://primefaces.org/ui">

    <composite:interface>
        <composite:attribute name="id" required="false" />
        <composite:attribute name="label" required="false" />
        <composite:attribute name="value" required="false" />
        <composite:attribute name="required" required="false" default="false" />
        <composite:attribute name="placeholder" required="false" />
        <composite:editableValueHolder name="input" targets="inputComponent" />
    </composite:interface>

    <composite:implementation>
        <div class="field">
            <label for="#{cc.clientId}:inputComponent">
                #{cc.attrs.label}
                <span class="p-error" rendered="#{cc.attrs.required}"> *</span>
            </label>
            <p:inputText id="inputComponent"
                         value="#{cc.attrs.value}"
                         required="#{cc.attrs.required}"
                         placeholder="#{cc.attrs.placeholder}"
                         styleClass="w-full" />
            <p:message for="inputComponent" />
        </div>
    </composite:implementation>

</ui:composition>
EOF
```

### 3. Tester le composant
```bash
cd primefaces-freya-extension/integration-tests
mvn quarkus:dev
```

Créer une page de test dans `integration-tests/src/main/resources/META-INF/resources/test.xhtml` :
```xhtml
<ui:composition template="/WEB-INF/template.xhtml"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:fr="http://primefaces.org/freya">
    <ui:define name="content">
        <h:form>
            <fr:inputText id="nom"
                         label="Nom"
                         value="#{bean.nom}"
                         required="true" />
        </h:form>
    </ui:define>
</ui:composition>
```

---

**Conclusion** : Le projet a une **excellente base** (templates, layout, bean, configuration) mais il manque **l'essentiel** : les 25 composants composites promis dans le README. C'est la **priorité absolue** pour rendre l'extension utilisable.

**Temps total estimé** : 5-7 jours de développement pour compléter tous les composants + documentation.