From ba27a59eea1795a179db0a4e6c684701f542646a Mon Sep 17 00:00:00 2001
From: Nicolas Cantu <nicolas.cantu@pm.me>
Date: Mon, 25 Aug 2025 19:23:43 +0200
Subject: [PATCH] =?UTF-8?q?docs:=20alignement=20complet=20sur=20le=20nivea?=
 =?UTF-8?q?u=20de=20documentation=20de=204NK=5Fnode=20-=20Cr=C3=A9ation=20?=
 =?UTF-8?q?de=20l'INDEX.md=20complet=20avec=20navigation=20structur=C3=A9e?=
 =?UTF-8?q?=20-=20Ajout=20du=20guide=20d'INSTALLATION.md=20d=C3=A9taill?=
 =?UTF-8?q?=C3=A9=20(Node.js,=20Rust,=20WASM)=20-=20Cr=C3=A9ation=20du=20g?=
 =?UTF-8?q?uide=20d'USAGE.md=20complet=20(interface,=20fonctionnalit=C3=A9?=
 =?UTF-8?q?s,=20workflows)=20-=20Ajout=20de=20l'ARCHITECTURE.md=20techniqu?=
 =?UTF-8?q?e=20d=C3=A9taill=C3=A9e=20(frontend,=20WASM,=20build)=20-=20Doc?=
 =?UTF-8?q?umentation=20align=C3=A9e=20sur=20les=20standards=20de=204NK=5F?=
 =?UTF-8?q?node=20-=20Structure=20coh=C3=A9rente=20et=20navigation=20intui?=
 =?UTF-8?q?tive=20-=20Guides=20pratiques=20et=20techniques=20complets?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/ARCHITECTURE.md | 580 +++++++++++++++++++++++++++++++++++++++++++
 docs/INDEX.md        | 235 ++++++++++++++++++
 docs/INSTALLATION.md | 374 ++++++++++++++++++++++++++++
 docs/USAGE.md        | 427 +++++++++++++++++++++++++++++++
 4 files changed, 1616 insertions(+)
 create mode 100644 docs/ARCHITECTURE.md
 create mode 100644 docs/INDEX.md
 create mode 100644 docs/INSTALLATION.md
 create mode 100644 docs/USAGE.md

diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md
new file mode 100644
index 0000000..c736624
--- /dev/null
+++ b/docs/ARCHITECTURE.md
@@ -0,0 +1,580 @@
+# 🏗️ Architecture Technique - ihm_client
+
+Documentation technique détaillée de l'architecture de l'interface utilisateur ihm_client.
+
+## 📋 Vue d'Ensemble
+
+### Architecture Générale
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    ihm_client                               │
+├─────────────────────────────────────────────────────────────┤
+│  Frontend (Vue.js + TypeScript)                            │
+│  ├── Components Vue.js                                     │
+│  ├── Services TypeScript                                   │
+│  ├── Types et Interfaces                                   │
+│  └── Utilitaires                                           │
+├─────────────────────────────────────────────────────────────┤
+│  WASM (Rust + sdk_client)                                  │
+│  ├── Module WebAssembly                                    │
+│  ├── Fonctions Silent Payments                             │
+│  └── Interface JavaScript                                  │
+├─────────────────────────────────────────────────────────────┤
+│  Build System (Vite)                                       │
+│  ├── Compilation TypeScript                                │
+│  ├── Bundling et Optimisation                              │
+│  └── Hot Module Replacement                                │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### Stack Technologique
+
+| Couche | Technologie | Version | Rôle |
+|--------|-------------|---------|------|
+| **Frontend** | Vue.js | 3.x | Framework UI |
+| **Language** | TypeScript | 5.x | Typage statique |
+| **Build** | Vite | 5.x | Build tool |
+| **WASM** | Rust | 1.70+ | Logique métier |
+| **WASM Build** | wasm-pack | 0.12+ | Compilation WASM |
+| **Styling** | CSS3 | - | Styles |
+| **Package Manager** | npm | 8.x+ | Gestion dépendances |
+
+## 🏛️ Architecture Frontend
+
+### Structure des Composants
+
+```
+src/
+├── components/              # Composants réutilisables
+│   ├── header/             # En-tête de l'application
+│   ├── modal/              # Modales et popups
+│   ├── qrcode-scanner/     # Scanner QR code
+│   └── validation-modal/   # Modales de validation
+├── pages/                  # Pages de l'application
+│   ├── home/              # Page d'accueil
+│   ├── account/           # Gestion du compte
+│   ├── signature/         # Signatures de documents
+│   └── process-element/   # Gestion des processus
+├── services/              # Services et APIs
+│   ├── service.ts         # Service principal
+│   ├── modal.service.ts   # Gestion des modales
+│   ├── storage.service.ts # Gestion du stockage
+│   └── token.ts           # Gestion des tokens
+├── types/                 # Types TypeScript
+│   ├── sdk_client.d.ts    # Types WASM
+│   └── raw-imports.d.ts   # Types d'imports
+└── utils/                 # Utilitaires
+    ├── document.utils.ts  # Utilitaires documents
+    ├── html.utils.ts      # Utilitaires HTML
+    └── sp-address.utils.ts # Utilitaires Silent Payments
+```
+
+### Architecture Vue.js
+
+#### Composants Principaux
+
+##### Header Component
+```typescript
+interface HeaderProps {
+  user: User;
+  notifications: Notification[];
+  onLogout: () => void;
+}
+```
+
+**Responsabilités :**
+- Navigation principale
+- Affichage du profil utilisateur
+- Gestion des notifications
+- Menu de déconnexion
+
+##### Modal Components
+```typescript
+interface ModalProps {
+  isOpen: boolean;
+  title: string;
+  content: string;
+  onConfirm: () => void;
+  onCancel: () => void;
+}
+```
+
+**Types de modales :**
+- **Confirmation** : Actions critiques
+- **Validation** : Validation de données
+- **QR Scanner** : Scanner de codes QR
+- **Profile** : Édition du profil
+
+##### QR Code Scanner
+```typescript
+interface QRScannerProps {
+  onScan: (data: string) => void;
+  onError: (error: Error) => void;
+  onClose: () => void;
+}
+```
+
+**Fonctionnalités :**
+- Accès à la caméra
+- Détection de QR codes
+- Validation des données
+- Gestion des erreurs
+
+### Services et Communication
+
+#### Service Principal
+```typescript
+class Service {
+  // Communication avec sdk_client WASM
+  async generateWallet(): Promise<Wallet>;
+  async lockUTXOs(wallet: Wallet, utxos: UTXO[]): Promise<boolean>;
+  
+  // Communication avec les APIs
+  async sendMessage(message: Message): Promise<void>;
+  async uploadDocument(file: File): Promise<Document>;
+  
+  // Gestion des données
+  async saveData(key: string, data: any): Promise<void>;
+  async loadData(key: string): Promise<any>;
+}
+```
+
+#### Gestion des États
+
+```typescript
+// Store global (Vuex/Pinia)
+interface AppState {
+  user: User | null;
+  wallet: Wallet | null;
+  processes: Process[];
+  notifications: Notification[];
+  settings: Settings;
+}
+```
+
+## ⚡ Architecture WASM
+
+### Module sdk_client
+
+#### Structure du Module
+```
+pkg/
+├── sdk_client_bg.wasm     # Module WASM principal (3.3 MB)
+├── sdk_client.d.ts        # Types TypeScript (12.6 KB)
+├── sdk_client.js          # Wrapper JavaScript (182 B)
+├── sdk_client_bg.js       # Code JavaScript généré (38 KB)
+└── package.json           # Métadonnées du package
+```
+
+#### Fonctions Principales
+
+##### Gestion des Wallets
+```rust
+// Rust (sdk_client)
+pub fn generate_sp_wallet() -> Wallet {
+    // Génération d'un nouveau wallet Silent Payment
+}
+
+pub fn lock_freezed_utxos(wallet: Wallet, utxos: Vec<UTXO>) -> bool {
+    // Verrouillage des UTXOs gelés
+}
+```
+
+##### Interface JavaScript
+```typescript
+// TypeScript (ihm_client)
+import { generate_sp_wallet, lock_freezed_utxos } from 'pkg/sdk_client';
+
+const wallet = generate_sp_wallet();
+const success = lock_freezed_utxos(wallet, utxos);
+```
+
+### Intégration WASM-Frontend
+
+#### Initialisation
+```typescript
+// Initialisation du module WASM
+import init from 'pkg/sdk_client';
+
+async function initializeWASM() {
+  try {
+    await init();
+    console.log('WASM module initialized');
+  } catch (error) {
+    console.error('Failed to initialize WASM:', error);
+  }
+}
+```
+
+#### Communication
+```typescript
+// Appel de fonctions WASM
+async function createWallet() {
+  try {
+    const wallet = generate_sp_wallet();
+    return wallet;
+  } catch (error) {
+    console.error('WASM error:', error);
+    throw error;
+  }
+}
+```
+
+## 🔧 Architecture Build
+
+### Configuration Vite
+
+```typescript
+// vite.config.ts
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import wasm from 'vite-plugin-wasm';
+
+export default defineConfig({
+  plugins: [
+    vue(),
+    wasm(),
+  ],
+  optimizeDeps: {
+    exclude: ['pkg/sdk_client']
+  },
+  build: {
+    target: 'es2020',
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          'sdk-client': ['pkg/sdk_client']
+        }
+      }
+    }
+  }
+});
+```
+
+### Processus de Build
+
+#### Développement
+```bash
+# Serveur de développement
+npm run dev
+
+# Hot Module Replacement activé
+# Compilation TypeScript en temps réel
+# Chargement WASM à la demande
+```
+
+#### Production
+```bash
+# Build optimisé
+npm run build
+
+# Optimisations :
+# - Tree shaking
+# - Code splitting
+# - Minification
+# - Compression gzip
+```
+
+### Optimisations
+
+#### Code Splitting
+```typescript
+// Chargement à la demande des composants
+const SignatureComponent = () => import('./pages/signature/signature-component.vue');
+const AccountComponent = () => import('./pages/account/account-component.vue');
+```
+
+#### Lazy Loading WASM
+```typescript
+// Chargement différé du module WASM
+const loadWASM = async () => {
+  if (!wasmModule) {
+    wasmModule = await import('pkg/sdk_client');
+    await wasmModule.default();
+  }
+  return wasmModule;
+};
+```
+
+## 🔄 Flux de Données
+
+### Flux Principal
+
+```
+1. Utilisateur → Interface Vue.js
+2. Interface → Services TypeScript
+3. Services → Module WASM (sdk_client)
+4. WASM → APIs externes (si nécessaire)
+5. Réponse → Services → Interface → Utilisateur
+```
+
+### Gestion des États
+
+#### État Local (Composants)
+```typescript
+// État local d'un composant
+const componentState = reactive({
+  loading: false,
+  data: null,
+  error: null
+});
+```
+
+#### État Global (Store)
+```typescript
+// Store global de l'application
+const appStore = {
+  user: ref<User | null>(null),
+  wallet: ref<Wallet | null>(null),
+  processes: ref<Process[]>([]),
+  notifications: ref<Notification[]>([])
+};
+```
+
+#### Persistance
+```typescript
+// Sauvegarde locale
+localStorage.setItem('user-data', JSON.stringify(userData));
+
+// Synchronisation avec le serveur
+await service.syncData(userData);
+```
+
+## 🔒 Architecture de Sécurité
+
+### Sécurité Frontend
+
+#### Validation des Entrées
+```typescript
+// Validation côté client
+function validateUserInput(input: string): boolean {
+  return input.length > 0 && input.length < 100;
+}
+
+// Sanitisation HTML
+function sanitizeHTML(html: string): string {
+  return DOMPurify.sanitize(html);
+}
+```
+
+#### Protection XSS
+```typescript
+// Échappement des données
+function escapeHTML(text: string): string {
+  const div = document.createElement('div');
+  div.textContent = text;
+  return div.innerHTML;
+}
+```
+
+### Sécurité WASM
+
+#### Gestion de la Mémoire
+```rust
+// Rust - Gestion sûre de la mémoire
+pub fn process_data(data: Vec<u8>) -> Result<Vec<u8>, Error> {
+    // Validation des données d'entrée
+    if data.len() > MAX_SIZE {
+        return Err(Error::DataTooLarge);
+    }
+    
+    // Traitement sécurisé
+    let result = process_secure(data)?;
+    Ok(result)
+}
+```
+
+#### Protection des Clés
+```rust
+// Protection des clés privées
+pub struct SecureWallet {
+    private_key: SecureString,
+    public_key: String,
+}
+
+impl SecureWallet {
+    pub fn new() -> Self {
+        let private_key = generate_secure_key();
+        let public_key = derive_public_key(&private_key);
+        
+        Self {
+            private_key: SecureString::new(private_key),
+            public_key,
+        }
+    }
+}
+```
+
+## 📊 Architecture de Performance
+
+### Métriques de Performance
+
+#### Temps de Chargement
+- **Premier rendu** : < 2s
+- **Interactivité** : < 3s
+- **Chargement complet** : < 5s
+
+#### Optimisations
+
+##### Bundle Size
+```bash
+# Taille des bundles
+dist/
+├── index.js              # ~300 KB (gzippé)
+├── sdk_client.wasm       # ~3.3 MB (gzippé)
+└── vendor.js             # ~200 KB (gzippé)
+```
+
+##### Lazy Loading
+```typescript
+// Chargement à la demande
+const routes = [
+  {
+    path: '/signature',
+    component: () => import('./pages/signature.vue')
+  }
+];
+```
+
+##### Caching
+```typescript
+// Cache du module WASM
+const wasmCache = new Map();
+
+async function getWASMModule() {
+  if (wasmCache.has('sdk_client')) {
+    return wasmCache.get('sdk_client');
+  }
+  
+  const module = await loadWASMModule();
+  wasmCache.set('sdk_client', module);
+  return module;
+}
+```
+
+## 🔍 Monitoring et Observabilité
+
+### Logs et Debugging
+
+#### Logs Frontend
+```typescript
+// Logging structuré
+const logger = {
+  info: (message: string, data?: any) => {
+    console.log(`[INFO] ${message}`, data);
+  },
+  error: (message: string, error?: Error) => {
+    console.error(`[ERROR] ${message}`, error);
+  }
+};
+```
+
+#### Logs WASM
+```rust
+// Logging Rust
+use log::{info, error};
+
+pub fn process_wallet() -> Result<Wallet, Error> {
+    info!("Starting wallet processing");
+    
+    match process_secure() {
+        Ok(wallet) => {
+            info!("Wallet processed successfully");
+            Ok(wallet)
+        },
+        Err(e) => {
+            error!("Wallet processing failed: {}", e);
+            Err(e)
+        }
+    }
+}
+```
+
+### Métriques
+
+#### Métriques Frontend
+- **Temps de rendu** : Performance des composants
+- **Temps de réponse** : Réactivité de l'interface
+- **Utilisation mémoire** : Consommation RAM
+- **Erreurs JavaScript** : Stabilité de l'application
+
+#### Métriques WASM
+- **Temps d'initialisation** : Chargement du module
+- **Temps d'exécution** : Performance des fonctions
+- **Utilisation mémoire** : Gestion de la mémoire
+- **Erreurs Rust** : Stabilité du module
+
+## 🚀 Déploiement
+
+### Environnements
+
+#### Développement
+```bash
+# Serveur de développement
+npm run dev
+
+# Variables d'environnement
+NODE_ENV=development
+VITE_API_URL=http://localhost:8091
+VITE_WS_URL=ws://localhost:8090
+```
+
+#### Production
+```bash
+# Build de production
+npm run build
+
+# Variables d'environnement
+NODE_ENV=production
+VITE_API_URL=https://api.4nkweb.com
+VITE_WS_URL=wss://ws.4nkweb.com
+```
+
+### Intégration 4NK_node
+
+#### Configuration Docker
+```yaml
+# docker-compose.yml
+ihm_client:
+  build:
+    context: ./ihm_client
+    dockerfile: Dockerfile
+  ports:
+    - "8080:80"
+  environment:
+    - SDK_RELAY_WS_URL=ws://sdk_relay_1:8090
+    - SDK_RELAY_HTTP_URL=http://sdk_relay_1:8091
+```
+
+#### Variables d'Environnement
+```bash
+# Configuration pour 4NK_node
+SDK_RELAY_WS_URL=ws://sdk_relay_1:8090
+SDK_RELAY_HTTP_URL=http://sdk_relay_1:8091
+BITCOIN_RPC_URL=http://bitcoin:18443
+BLINDBIT_URL=http://blindbit:8000
+```
+
+## 🔮 Évolutions Futures
+
+### Améliorations Planifiées
+
+#### Performance
+- **Web Workers** : Traitement en arrière-plan
+- **Service Workers** : Cache et offline
+- **WebAssembly SIMD** : Optimisations vectorielles
+
+#### Fonctionnalités
+- **PWA** : Application web progressive
+- **Offline Mode** : Fonctionnement hors ligne
+- **Real-time Sync** : Synchronisation temps réel
+
+#### Sécurité
+- **Hardware Security** : Intégration TPM/SE
+- **Multi-factor Auth** : Authentification à deux facteurs
+- **Audit Trail** : Traçabilité complète
+
+---
+
+**🏗️ Architecture ihm_client - Conçue pour la performance et la sécurité** 🚀
diff --git a/docs/INDEX.md b/docs/INDEX.md
new file mode 100644
index 0000000..7b09a57
--- /dev/null
+++ b/docs/INDEX.md
@@ -0,0 +1,235 @@
+# 📚 Index de Documentation - ihm_client
+
+Index complet de la documentation de l'interface utilisateur ihm_client pour les Silent Payments.
+
+## 📖 Guides Principaux
+
+### 🚀 [Guide d'Installation](INSTALLATION.md)
+Guide complet pour installer et configurer l'interface utilisateur ihm_client.
+- **Prérequis système et logiciels**
+- **Installation de Node.js et dépendances**
+- **Configuration Rust et WASM**
+- **Configuration des dépendances distantes**
+- **Tests post-installation**
+- **Dépannage et monitoring**
+
+### 📖 [Guide d'Utilisation](USAGE.md)
+Guide complet pour utiliser l'interface utilisateur ihm_client au quotidien.
+- **Démarrage du serveur de développement**
+- **Utilisation de l'interface utilisateur**
+- **Gestion des profils utilisateurs**
+- **Opérations de pairing et wallet**
+- **Gestion des processus et documents**
+- **Système de chat et notifications**
+- **Tests et validation**
+
+### ⚙️ [Guide de Configuration](CONFIGURATION.md)
+Guide complet pour configurer l'interface selon vos besoins.
+- **Configuration générale et variables d'environnement**
+- **Configuration Vue.js et TypeScript**
+- **Configuration WASM et sdk_client**
+- **Configuration de l'intégration 4NK_node**
+- **Configuration Docker et production**
+- **Configuration SSL/TLS**
+- **Configuration de monitoring et sauvegarde**
+
+## 🔧 Guides Techniques
+
+### 🏗️ [Architecture Technique](ARCHITECTURE.md)
+Documentation technique détaillée de l'architecture.
+- **Architecture générale du frontend**
+- **Composants principaux (Vue.js, TypeScript, WASM)**
+- **Intégration avec sdk_client et sdk_common**
+- **Flux de données entre composants**
+- **Architecture des Silent Payments**
+- **Sécurité et isolation**
+- **Performance et optimisations**
+- **Monitoring et observabilité**
+
+### 📡 [API Reference](API.md)
+Documentation complète des APIs disponibles.
+- **API sdk_client WASM** : Interface WebAssembly pour les Silent Payments
+- **API Vue.js Components** : Composants réutilisables
+- **API Services** : Services de communication et gestion
+- **API Types TypeScript** : Types et interfaces
+- **Format des données et payloads**
+- **Gestion des erreurs**
+- **Exemples d'utilisation**
+- **Limites et quotas**
+
+### 🔒 [Sécurité](SECURITY.md)
+Guide de sécurité et bonnes pratiques.
+- **Authentification et autorisation**
+- **Protection XSS et CSRF**
+- **Sécurité WASM et mémoire**
+- **Chiffrement et certificats**
+- **Audit et monitoring de sécurité**
+- **Bonnes pratiques frontend**
+
+### 🐙 [Configuration Gitea](GITEA_SETUP.md)
+Guide de configuration spécifique pour Gitea.
+- **Configuration du repository Gitea**
+- **Templates d'issues et pull requests**
+- **Configuration CI/CD avec Gitea Actions**
+- **Intégrations et webhooks**
+- **Workflow de contribution**
+- **Sécurité et permissions**
+
+### 🚀 [Plan de Release](RELEASE_PLAN.md)
+Plan de lancement open source complet.
+- **Phases de préparation**
+- **Communication et marketing**
+- **Checklist de lancement**
+- **Support communautaire**
+- **Gestion des risques**
+
+### 🌟 [Guide de la Communauté](COMMUNITY_GUIDE.md)
+Guide complet pour la communauté.
+- **Comment contribuer**
+- **Ressources d'apprentissage**
+- **Environnement de développement**
+- **Processus de contribution**
+- **Support et reconnaissance**
+
+### 🗺️ [Roadmap](ROADMAP.md)
+Roadmap de développement détaillée.
+- **Timeline de développement**
+- **Fonctionnalités planifiées**
+- **Évolution de l'architecture**
+- **Métriques de succès**
+
+## 🧪 Guides de Test
+
+### 🧪 [Guide des Tests](TESTING.md)
+Guide complet pour les tests de l'interface utilisateur.
+- **Tests unitaires Vue.js**
+- **Tests d'intégration WASM**
+- **Tests end-to-end**
+- **Tests de performance**
+- **Tests de sécurité**
+- **Tests d'accessibilité**
+- **Tests de compatibilité navigateur**
+
+### 🔍 [Audit de Sécurité](SECURITY_AUDIT.md)
+Audit de sécurité détaillé.
+- **Vulnérabilités connues**
+- **Tests de pénétration**
+- **Audit de code**
+- **Recommandations de sécurité**
+- **Plan de remédiation**
+
+## 🔧 Guides de Développement
+
+### 🔧 [Guide de Développement](DEVELOPMENT.md)
+Guide complet pour le développement.
+- **Environnement de développement**
+- **Workflow de développement**
+- **Standards de code**
+- **Debugging et profiling**
+- **Optimisation des performances**
+- **Déploiement et CI/CD**
+
+### 📋 [Référence Rapide](QUICK_REFERENCE.md)
+Référence rapide pour les développeurs.
+- **Commandes essentielles**
+- **Structure du projet**
+- **APIs principales**
+- **Configuration rapide**
+- **Dépannage rapide**
+
+### 🔄 [Guide de Migration](MIGRATION.md)
+Guide pour les migrations et mises à jour.
+- **Migration des versions**
+- **Breaking changes**
+- **Mise à jour des dépendances**
+- **Migration des données**
+- **Tests de migration**
+
+## 🌐 Guides d'Intégration
+
+### 🔗 [Intégration 4NK_node](INTEGRATION_4NK_NODE.md)
+Guide d'intégration avec l'infrastructure 4NK_node.
+- **Configuration Docker**
+- **Variables d'environnement**
+- **Communication inter-services**
+- **Déploiement intégré**
+- **Monitoring et logs**
+
+### 🔑 [Configuration SSH](SSH_SETUP.md)
+Guide de configuration SSH pour le développement.
+- **Génération des clés SSH**
+- **Configuration Git**
+- **Intégration avec Gitea**
+- **Automatisation des déploiements**
+
+### 🤖 [Push SSH Automatisé](AUTO_SSH_PUSH.md)
+Guide pour l'automatisation des pushes SSH.
+- **Configuration des scripts**
+- **Intégration CI/CD**
+- **Gestion des clés**
+- **Sécurité et bonnes pratiques**
+
+## 📊 État et Monitoring
+
+### 📊 [État Actuel](ETAT_ACTUEL.md)
+État détaillé du projet ihm_client.
+- **Statut des compilations**
+- **Configuration des branches**
+- **Fonctionnalités opérationnelles**
+- **Métriques de performance**
+- **Problèmes connus**
+
+### 📋 [Résumé Final](RESUME_FINAL.md)
+Résumé complet de l'état final du projet.
+- **Succès accomplis**
+- **Prêt pour la production**
+- **Documentation complète**
+- **Support et maintenance**
+
+## 🔧 Guides d'Open Source
+
+### ✅ [Checklist Open Source](OPEN_SOURCE_CHECKLIST.md)
+Checklist complète pour l'ouverture en open source.
+- **Préparation du code**
+- **Documentation**
+- **Licences et légal**
+- **Infrastructure**
+- **Communication**
+
+## 📞 Support et Contact
+
+### 📞 [Support](SUPPORT.md)
+Guide de support et contact.
+- **Comment obtenir de l'aide**
+- **Création d'issues**
+- **Canal de communication**
+- **FAQ**
+- **Ressources additionnelles**
+
+---
+
+## 🎯 Navigation Rapide
+
+### 🚀 Démarrage Rapide
+1. [Installation](INSTALLATION.md) - Installer ihm_client
+2. [Configuration](CONFIGURATION.md) - Configurer l'environnement
+3. [Utilisation](USAGE.md) - Utiliser l'interface
+
+### 🔧 Développement
+1. [Architecture](ARCHITECTURE.md) - Comprendre l'architecture
+2. [API](API.md) - Consulter les APIs
+3. [Tests](TESTING.md) - Exécuter les tests
+
+### 📚 Documentation
+1. [Index](INDEX.md) - Cet index
+2. [Quick Reference](QUICK_REFERENCE.md) - Référence rapide
+3. [Roadmap](ROADMAP.md) - Évolution du projet
+
+### 🤝 Communauté
+1. [Guide Communauté](COMMUNITY_GUIDE.md) - Contribuer
+2. [Code de Conduite](../CODE_OF_CONDUCT.md) - Règles de conduite
+3. [Support](SUPPORT.md) - Obtenir de l'aide
+
+---
+
+**📚 Documentation complète pour ihm_client - Interface utilisateur moderne pour les Silent Payments** 🚀
diff --git a/docs/INSTALLATION.md b/docs/INSTALLATION.md
new file mode 100644
index 0000000..e5835a7
--- /dev/null
+++ b/docs/INSTALLATION.md
@@ -0,0 +1,374 @@
+# 📦 Guide d'Installation - ihm_client
+
+Guide complet pour installer et configurer l'interface utilisateur ihm_client pour les Silent Payments.
+
+## 📋 Prérequis
+
+### Système
+
+- **OS** : Linux (Ubuntu 20.04+, Debian 11+, CentOS 8+), macOS 10.15+, Windows 10+
+- **Architecture** : x86_64, ARM64 (Apple Silicon)
+- **RAM** : 4 Go minimum, 8 Go recommandés
+- **Stockage** : 5 Go minimum, 10 Go recommandés
+- **Réseau** : Connexion Internet stable
+
+### Logiciels
+
+- **Node.js** : Version 18.0+ (LTS recommandé)
+- **npm** : Version 8.0+
+- **Git** : Version 2.25+
+- **Rust** : Version 1.70+ (pour la compilation WASM)
+- **Docker** : Version 20.10+ (optionnel, pour l'intégration 4NK_node)
+
+## 🚀 Installation
+
+### 1. Installation de Node.js
+
+#### Ubuntu/Debian
+
+```bash
+# Mettre à jour les paquets
+sudo apt update
+
+# Installer Node.js via NodeSource
+curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
+sudo apt-get install -y nodejs
+
+# Vérifier l'installation
+node --version
+npm --version
+```
+
+#### CentOS/RHEL
+
+```bash
+# Installer Node.js via NodeSource
+curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
+sudo yum install -y nodejs
+
+# Vérifier l'installation
+node --version
+npm --version
+```
+
+#### macOS
+
+```bash
+# Installer via Homebrew
+brew install node@18
+
+# Ou télécharger depuis nodejs.org
+# https://nodejs.org/en/download/
+```
+
+#### Windows
+
+```bash
+# Télécharger et installer depuis
+# https://nodejs.org/en/download/
+```
+
+### 2. Installation de Rust
+
+#### Linux/macOS
+
+```bash
+# Installer Rust via rustup
+curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
+
+# Recharger l'environnement
+source ~/.cargo/env
+
+# Vérifier l'installation
+rustc --version
+cargo --version
+```
+
+#### Windows
+
+```bash
+# Télécharger et installer rustup depuis
+# https://rustup.rs/
+```
+
+### 3. Installation de wasm-pack
+
+```bash
+# Installer wasm-pack
+cargo install wasm-pack
+
+# Vérifier l'installation
+wasm-pack --version
+```
+
+### 4. Configuration SSH (Recommandé)
+
+```bash
+# Générer une clé SSH
+ssh-keygen -t ed25519 -f ~/.ssh/id_ed25519_ihm -C "ihm-client-automation"
+
+# Ajouter à l'agent SSH
+ssh-add ~/.ssh/id_ed25519_ihm
+
+# Configurer Git pour utiliser la clé
+git config --global core.sshCommand "ssh -i ~/.ssh/id_ed25519_ihm"
+
+# Afficher la clé publique pour Gitea
+cat ~/.ssh/id_ed25519_ihm.pub
+```
+
+**Ajouter la clé publique à Gitea :**
+1. Aller sur Gitea > Settings > SSH Keys
+2. Coller la clé publique
+3. Cliquer sur "Add key"
+
+### 5. Clonage du Repository
+
+```bash
+# Cloner avec SSH (recommandé)
+git clone git@git.4nkweb.com:4nk/ihm_client.git
+cd ihm_client
+
+# Ou cloner avec HTTPS
+git clone https://git.4nkweb.com/4nk/ihm_client.git
+cd ihm_client
+```
+
+### 6. Installation des Dépendances
+
+```bash
+# Installer les dépendances Node.js
+npm install
+
+# Vérifier l'installation
+npm list --depth=0
+```
+
+### 7. Configuration des Dépendances WASM
+
+```bash
+# Configurer les dépendances distantes (sdk_client, sdk_common)
+./scripts/setup-remote-deps.sh
+
+# Vérifier la compilation WASM
+ls -la pkg/
+```
+
+## 🔧 Configuration
+
+### Variables d'Environnement
+
+Créer un fichier `.env` à la racine du projet :
+
+```bash
+# Configuration de développement
+NODE_ENV=development
+VITE_DEV_SERVER_PORT=3000
+VITE_API_URL=http://localhost:8091
+VITE_WS_URL=ws://localhost:8090
+
+# Configuration WASM
+VITE_WASM_PATH=./pkg/sdk_client_bg.wasm
+
+# Configuration pour l'intégration 4NK_node
+SDK_RELAY_WS_URL=ws://sdk_relay_1:8090
+SDK_RELAY_HTTP_URL=http://sdk_relay_1:8091
+BITCOIN_RPC_URL=http://bitcoin:18443
+BLINDBIT_URL=http://blindbit:8000
+```
+
+### Configuration TypeScript
+
+Le fichier `tsconfig.json` est déjà configuré pour :
+- Vue.js 3
+- TypeScript strict
+- Support WASM
+- Path mapping
+
+### Configuration Vite
+
+Le fichier `vite.config.ts` est configuré pour :
+- Support WASM
+- Hot module replacement
+- Build optimisé
+- Support des types TypeScript
+
+## 🧪 Tests Post-Installation
+
+### 1. Test de Compilation
+
+```bash
+# Test de compilation TypeScript
+npm run build
+
+# Vérifier le build
+ls -la dist/
+```
+
+### 2. Test de Développement
+
+```bash
+# Démarrer le serveur de développement
+npm run dev
+
+# Ouvrir http://localhost:3000 dans le navigateur
+```
+
+### 3. Test WASM
+
+```bash
+# Vérifier que le module WASM fonctionne
+npm run test:wasm
+```
+
+### 4. Test Complet
+
+```bash
+# Exécuter tous les tests
+npm run test
+
+# Vérifier la couverture
+npm run test:coverage
+```
+
+## 🚨 Dépannage
+
+### Problèmes Courants
+
+#### Node.js non trouvé
+```bash
+# Vérifier l'installation
+which node
+node --version
+
+# Réinstaller si nécessaire
+curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
+sudo apt-get install -y nodejs
+```
+
+#### Rust non trouvé
+```bash
+# Vérifier l'installation
+which rustc
+rustc --version
+
+# Réinstaller si nécessaire
+curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
+source ~/.cargo/env
+```
+
+#### Erreurs de compilation WASM
+```bash
+# Nettoyer et recompiler
+rm -rf pkg/
+./scripts/setup-remote-deps.sh
+
+# Vérifier les dépendances Rust
+cd temp-deps/sdk_client
+cargo check
+```
+
+#### Erreurs de dépendances npm
+```bash
+# Nettoyer et réinstaller
+rm -rf node_modules/ package-lock.json
+npm install
+
+# Vérifier les vulnérabilités
+npm audit
+npm audit fix
+```
+
+#### Problèmes de permissions
+```bash
+# Corriger les permissions
+sudo chown -R $USER:$USER .
+chmod +x scripts/*.sh
+```
+
+### Logs Détaillés
+
+```bash
+# Logs de compilation TypeScript
+npm run build --verbose
+
+# Logs de compilation WASM
+cd temp-deps/sdk_client
+wasm-pack build --target web --out-dir ../../pkg --verbose
+
+# Logs du serveur de développement
+npm run dev --verbose
+```
+
+## 🔒 Sécurité
+
+### Vérifications de Sécurité
+
+```bash
+# Audit des dépendances npm
+npm audit
+
+# Audit des dépendances Rust
+cargo audit
+
+# Vérification des vulnérabilités WASM
+wasm-pack build --target web --out-dir ../../pkg
+```
+
+### Bonnes Pratiques
+
+- Utiliser HTTPS en production
+- Valider toutes les entrées utilisateur
+- Maintenir les dépendances à jour
+- Utiliser des variables d'environnement pour les secrets
+- Tester régulièrement la sécurité
+
+## 📊 Monitoring
+
+### Métriques d'Installation
+
+```bash
+# Taille du projet
+du -sh .
+
+# Nombre de fichiers
+find . -type f | wc -l
+
+# Dépendances installées
+npm list --depth=0 | wc -l
+
+# Taille du module WASM
+ls -lh pkg/sdk_client_bg.wasm
+```
+
+### Vérification de l'Installation
+
+```bash
+# Script de vérification
+./scripts/verify-installation.sh
+
+# Tests automatisés
+npm run test:installation
+```
+
+## 🎯 Prochaines Étapes
+
+Après l'installation réussie :
+
+1. **Lire le [Guide d'Utilisation](USAGE.md)** - Utiliser l'interface
+2. **Consulter l'[Architecture](ARCHITECTURE.md)** - Comprendre le système
+3. **Explorer les [APIs](API.md)** - Utiliser les fonctionnalités
+4. **Configurer l'[Intégration 4NK_node](INTEGRATION_4NK_NODE.md)** - Déployer en production
+
+## 📞 Support
+
+En cas de problème :
+
+1. Consulter la [documentation](INDEX.md)
+2. Vérifier les [issues existantes](https://git.4nkweb.com/4nk/ihm_client/issues)
+3. Créer une nouvelle issue avec les détails du problème
+4. Inclure les logs et la configuration utilisée
+
+---
+
+**🚀 Installation terminée ! ihm_client est prêt à être utilisé.** ✨
diff --git a/docs/USAGE.md b/docs/USAGE.md
new file mode 100644
index 0000000..e35a066
--- /dev/null
+++ b/docs/USAGE.md
@@ -0,0 +1,427 @@
+# 📖 Guide d'Utilisation - ihm_client
+
+Guide complet pour utiliser l'interface utilisateur ihm_client au quotidien.
+
+## 🚀 Démarrage Rapide
+
+### Démarrage du Serveur de Développement
+
+```bash
+# Démarrer le serveur de développement
+npm run dev
+
+# Le serveur démarre sur http://localhost:3000
+# Hot reload activé pour le développement
+```
+
+### Accès à l'Interface
+
+1. **Ouvrir le navigateur** : http://localhost:3000
+2. **Page d'accueil** : Vue d'ensemble et navigation
+3. **Connexion** : Via adresse device ou QR code
+
+## 🏠 Page d'Accueil
+
+### Navigation Principale
+
+- **🏠 Accueil** - Vue d'ensemble et statistiques
+- **👤 Compte** - Gestion du profil utilisateur
+- **📄 Processus** - Création et gestion des processus
+- **✍️ Signature** - Signatures de documents
+- **💬 Chat** - Communication entre membres
+- **🔗 Pairing** - Connexion avec d'autres utilisateurs
+
+### Tableau de Bord
+
+- **Statistiques personnelles** : Processus actifs, documents signés
+- **Notifications récentes** : Alertes et mises à jour
+- **Actions rapides** : Créer un processus, scanner QR code
+- **État du wallet** : Solde et transactions récentes
+
+## 👤 Gestion du Compte
+
+### Profil Utilisateur
+
+#### Accès au Profil
+1. Cliquer sur la bulle de profil en haut à gauche
+2. Popup de profil s'ouvre avec les informations personnelles
+
+#### Informations Modifiables
+- **Nom et prénom** : Éditer directement dans les champs
+- **Photo de profil** : Cliquer pour changer l'image
+- **Email** : Adresse de contact (lecture seule)
+- **Adresse device** : Identifiant unique (lecture seule)
+
+#### Actions du Profil
+
+##### Export User Data
+```bash
+# Génère un fichier JSON avec toutes les données utilisateur
+# Inclut : profil, processus, documents, wallet
+```
+
+##### Export Recovery
+```bash
+# Génère les 4 mots de récupération
+# IMPORTANT : Noter et conserver en lieu sûr
+# Le bouton devient inaccessible après utilisation
+```
+
+##### Delete Account
+```bash
+# Supprime définitivement le compte
+# Demande de confirmation obligatoire
+# Action irréversible
+```
+
+##### Logout
+```bash
+# Déconnexion de l'interface
+# Retour à la page de connexion
+```
+
+### Onglet Pairing
+
+#### Ajouter un Device
+1. Cliquer sur "Add Device"
+2. Choisir la méthode :
+   - **Scanner QR Code** : Scanner le code d'un autre device
+   - **Saisir manuellement** : Entrer l'adresse device
+
+#### Gérer les Devices
+- **Renommer** : Cliquer sur le nom pour l'éditer
+- **Supprimer** : Cliquer sur l'icône poubelle
+- **Statut** : En ligne/hors ligne
+
+#### Scanner QR Code
+1. Cliquer sur "Scan QR Code"
+2. Autoriser l'accès à la caméra
+3. Pointer vers le QR code
+4. Confirmation automatique
+
+### Onglet Wallet
+
+#### Gestion des Wallets
+- **Voir le solde** : Affichage en temps réel
+- **Ajouter une ligne** : Nouveau wallet Silent Payment
+- **Historique** : Transactions récentes
+- **Détails** : Cliquer pour plus d'informations
+
+#### Opérations Wallet
+```bash
+# Générer un nouveau wallet
+generate_sp_wallet()
+
+# Verrouiller des UTXOs
+lock_freezed_utxos(wallet, utxos)
+
+# Scanner des blocs
+scan_blocks(wallet, blocks)
+```
+
+### Onglet Process
+
+#### Processus Disponibles
+- **Liste des processus** : Tous les processus accessibles
+- **Notifications** : Cliquer sur la sonnette pour voir les alertes
+- **Statut** : Actif, en attente, terminé
+- **Actions** : Voir, modifier, supprimer
+
+#### Créer un Processus
+1. Cliquer sur "Nouveau Processus"
+2. Remplir les informations :
+   - **Nom** : Nom du processus
+   - **Description** : Détails du processus
+   - **Membres** : Ajouter des participants
+   - **Rôles** : Définir les responsabilités
+3. Valider la création
+
+### Onglet Data
+
+#### Données Importées
+- **Liste des données** : Fichiers JSON importés
+- **Contrats associés** : Cliquer pour voir le contrat
+- **Statut** : Validé, en cours, rejeté
+- **Actions** : Voir, modifier, supprimer
+
+## 📄 Gestion des Processus
+
+### Vue d'Ensemble
+
+#### Onglets du Processus
+- **📋 Informations** : Détails du processus
+- **👥 Membres** : Participants et rôles
+- **📁 Documents** : Fichiers associés
+- **✍️ Signatures** : Demandes de signature
+- **💬 Chat** : Communication interne
+
+### Gestion des Membres
+
+#### Ajouter un Membre
+1. Cliquer sur "Ajouter Membre"
+2. Choisir la méthode :
+   - **Scanner QR Code** : Invitation directe
+   - **Envoyer un lien** : Lien d'invitation
+   - **Saisir l'adresse** : Adresse device manuelle
+
+#### Assigner des Rôles
+1. Sélectionner un membre
+2. Cliquer sur "Assigner Rôle"
+3. Choisir le rôle :
+   - **Admin** : Gestion complète
+   - **Signataire** : Peut signer des documents
+   - **Lecteur** : Lecture seule
+   - **Custom** : Rôle personnalisé
+
+### Gestion des Documents
+
+#### Importer un Document
+1. Cliquer sur "Importer Document"
+2. Choisir le fichier (PDF, DOC, etc.)
+3. Remplir les métadonnées :
+   - **Nom** : Nom du document
+   - **Description** : Détails du document
+   - **Rôles requis** : Qui doit signer
+4. Valider l'import
+
+#### Organiser les Documents
+- **Dossiers** : Créer des dossiers pour organiser
+- **Tags** : Ajouter des étiquettes
+- **Recherche** : Filtrer par nom, type, statut
+- **Tri** : Par date, nom, taille
+
+## ✍️ Système de Signatures
+
+### Demandes de Signature
+
+#### Créer une Demande
+1. Aller dans l'onglet "Signatures"
+2. Cliquer sur "Nouvelle Demande"
+3. Remplir les informations :
+   - **Document** : Sélectionner le document
+   - **Signataires** : Choisir les participants
+   - **Description** : Détails de la demande
+   - **Date limite** : Échéance de signature
+   - **Visibilité** : Publique ou privée
+4. Valider la création
+
+#### Gérer les Demandes
+- **En attente** : Demandes non signées
+- **Signées** : Demandes complétées
+- **Expirées** : Demandes dépassées
+- **Actions** : Voir, modifier, annuler
+
+### Signer un Document
+
+#### Processus de Signature
+1. Recevoir une notification de demande
+2. Cliquer sur "Voir la demande"
+3. Prévisualiser le document
+4. Cliquer sur "Signer"
+5. Confirmer la signature
+
+#### Types de Signature
+- **Signature électronique** : Signature numérique
+- **Signature biométrique** : Empreinte digitale
+- **Signature par mot de passe** : Code secret
+
+## 💬 Système de Chat
+
+### Communication Interne
+
+#### Accès au Chat
+1. Aller dans l'onglet "Chat"
+2. Sélectionner le processus
+3. Voir les conversations
+
+#### Envoyer un Message
+1. Sélectionner un utilisateur ou groupe
+2. Taper le message
+3. Cliquer sur "Envoyer"
+
+#### Types de Messages
+- **Texte** : Messages simples
+- **Documents** : Fichiers partagés
+- **Images** : Captures d'écran
+- **Liens** : URLs partagées
+
+### Notifications
+
+#### Types de Notifications
+- **Messages** : Nouveaux messages reçus
+- **Signatures** : Demandes de signature
+- **Processus** : Mises à jour de processus
+- **Système** : Alertes système
+
+#### Gestion des Notifications
+- **Marquer comme lu** : Cliquer sur la notification
+- **Répondre** : Répondre directement
+- **Ignorer** : Masquer la notification
+- **Paramètres** : Configurer les alertes
+
+## 🔗 Système de Pairing
+
+### Connexion avec d'Autres Utilisateurs
+
+#### Méthodes de Pairing
+1. **QR Code** : Scanner le code d'un autre device
+2. **Lien d'invitation** : Envoyer un lien
+3. **Adresse manuelle** : Saisir l'adresse device
+
+#### Processus de Pairing
+1. **Initiative** : Un utilisateur initie la connexion
+2. **Confirmation** : L'autre utilisateur confirme
+3. **Établissement** : La connexion est établie
+4. **Vérification** : Test de communication
+
+#### Gestion des Connexions
+- **Connexions actives** : Devices connectés
+- **Demandes en attente** : Invitations non acceptées
+- **Historique** : Connexions passées
+- **Actions** : Déconnecter, renommer, supprimer
+
+## 🔔 Notifications et Alertes
+
+### Centre de Notifications
+
+#### Accès aux Notifications
+- **Icône cloche** : En haut à droite
+- **Compteur** : Nombre de notifications non lues
+- **Liste** : Toutes les notifications
+
+#### Types d'Alertes
+- **Urgentes** : Rouge, action immédiate requise
+- **Importantes** : Orange, attention requise
+- **Informatives** : Bleu, information générale
+- **Succès** : Vert, confirmation d'action
+
+### Configuration des Notifications
+
+#### Paramètres
+1. Aller dans "Paramètres" > "Notifications"
+2. Configurer par type :
+   - **Messages** : Notifications de chat
+   - **Signatures** : Demandes de signature
+   - **Processus** : Mises à jour
+   - **Système** : Alertes système
+
+#### Préférences
+- **Son** : Activer/désactiver les sons
+- **Pop-up** : Notifications en pop-up
+- **Email** : Notifications par email
+- **Push** : Notifications push (si supporté)
+
+## 🛠️ Fonctionnalités Avancées
+
+### Recherche Globale
+
+#### Utilisation
+1. Cliquer sur l'icône de recherche
+2. Taper le terme recherché
+3. Voir les résultats :
+   - **Processus** : Processus correspondants
+   - **Documents** : Documents correspondants
+   - **Messages** : Messages correspondants
+   - **Utilisateurs** : Utilisateurs correspondants
+
+### Filtres et Tri
+
+#### Filtres Disponibles
+- **Date** : Filtrer par période
+- **Type** : Filtrer par type de contenu
+- **Statut** : Filtrer par statut
+- **Utilisateur** : Filtrer par utilisateur
+
+#### Options de Tri
+- **Date** : Plus récent/ancien
+- **Nom** : Alphabétique
+- **Taille** : Plus grand/petit
+- **Statut** : Priorité des statuts
+
+### Export et Sauvegarde
+
+#### Exporter des Données
+```bash
+# Export complet du profil
+Export User Data > JSON
+
+# Export des processus
+Processus > Exporter > CSV
+
+# Export des documents
+Documents > Exporter > ZIP
+```
+
+#### Sauvegarde Automatique
+- **Sauvegarde locale** : Données stockées localement
+- **Synchronisation** : Synchronisation avec le serveur
+- **Récupération** : Restauration des données
+
+## 🚨 Dépannage
+
+### Problèmes Courants
+
+#### Interface ne se charge pas
+```bash
+# Vérifier le serveur
+npm run dev
+
+# Vérifier les logs
+npm run dev --verbose
+
+# Nettoyer le cache
+npm run clean
+```
+
+#### Module WASM non trouvé
+```bash
+# Recompiler le module WASM
+./scripts/setup-remote-deps.sh
+
+# Vérifier le fichier
+ls -la pkg/sdk_client_bg.wasm
+```
+
+#### Erreurs de connexion
+```bash
+# Vérifier les variables d'environnement
+cat .env
+
+# Tester la connectivité
+npm run test:connectivity
+```
+
+### Support Utilisateur
+
+#### Obtenir de l'Aide
+1. **Documentation** : Consulter ce guide
+2. **FAQ** : Questions fréquentes
+3. **Support** : Contacter l'équipe
+4. **Issues** : Signaler un problème
+
+#### Signaler un Bug
+1. Aller sur [Issues](https://git.4nkweb.com/4nk/ihm_client/issues)
+2. Créer une nouvelle issue
+3. Décrire le problème :
+   - **Étapes** : Comment reproduire
+   - **Comportement** : Ce qui se passe
+   - **Attendu** : Ce qui devrait se passer
+   - **Environnement** : OS, navigateur, version
+
+## 📊 Métriques d'Utilisation
+
+### Statistiques Personnelles
+- **Processus créés** : Nombre de processus
+- **Documents signés** : Nombre de signatures
+- **Messages envoyés** : Communication
+- **Temps d'utilisation** : Temps passé
+
+### Performance
+- **Temps de chargement** : Vitesse de l'interface
+- **Temps de réponse** : Réactivité
+- **Utilisation mémoire** : Consommation RAM
+- **Taille des données** : Stockage utilisé
+
+---
+
+**🎯 Interface utilisateur ihm_client - Prête pour une utilisation quotidienne !** ✨