- Implemented multi-selection for notes with Ctrl+click, long-press, and keyboard shortcuts (Ctrl+A, Escape) - Added Gemini API integration with environment configuration and routes - Enhanced code block UI with improved copy feedback animation and visual polish - Added sort order toggle (asc/desc) for note lists with persistent state
273 lines
6.4 KiB
Markdown
273 lines
6.4 KiB
Markdown
# 🤖 Interface IA Gemini - Documentation Complète
|
|
|
|
## 📋 Vue d'ensemble
|
|
|
|
L'interface IA Gemini est un système d'intelligence artificielle intégré dans ObsiViewer qui permet d'exécuter automatiquement plusieurs tâches sur les notes Markdown.
|
|
|
|
### ✨ Fonctionnalités actuelles
|
|
|
|
- ✅ **Résumé automatique**: Génère une description courte (une ligne) et l'ajoute au YAML frontmatter
|
|
- 🚧 **Tags intelligents**: Suggère des tags pertinents (beta)
|
|
- 🚧 **Détection de type**: Identifie le type de note (beta)
|
|
- 🚧 **Enrichissement métadonnées**: Complète les champs manquants (beta)
|
|
- 🚧 **Suggestions de liens**: Propose des liens connexes (beta)
|
|
- 🚧 **Extraction mots-clés**: Identifie les concepts clés (beta)
|
|
- 🚧 ****:
|
|
|
|
### 🎯 Objectif
|
|
|
|
Automatiser l'enrichissement des métadonnées YAML pour améliorer l'organisation et la recherche dans le vault.
|
|
|
|
---
|
|
|
|
## 📁 Architecture
|
|
|
|
### Fichiers créés
|
|
|
|
```
|
|
src/app/
|
|
├── services/
|
|
│ └── gemini.service.ts # Service de gestion des tâches IA
|
|
└── features/
|
|
└── gemini/
|
|
└── gemini-panel.component.ts # Composant d'interface utilisateur
|
|
|
|
docs/
|
|
└── GEMINI/
|
|
├── README.md # Ce fichier
|
|
├── TECHNICAL_IMPLEMENTATION.md # Détails techniques
|
|
├── USER_GUIDE.md # Guide utilisateur
|
|
└── INTEGRATION_GUIDE.md # Guide d'intégration
|
|
```
|
|
|
|
### Fichiers modifiés
|
|
|
|
```
|
|
src/app/layout/app-shell-nimbus/app-shell-nimbus.component.ts
|
|
- Ajout de l'import GeminiPanelComponent
|
|
- Ajout du bouton 🤖 dans la sidebar
|
|
- Ajout de la variable showGeminiPanel
|
|
- Ajout de la méthode onGeminiPanelOpen()
|
|
```
|
|
|
|
---
|
|
|
|
## 🚀 Démarrage rapide
|
|
|
|
### 1. Ouverture du panneau
|
|
|
|
Le panneau IA Gemini est accessible via le bouton 🤖 dans la barre latérale gauche (mode desktop) ou dans le menu (mobile/tablet).
|
|
|
|
### 2. Sélectionner une note
|
|
|
|
Sélectionnez une note dans la liste pour l'analyser avec l'IA.
|
|
|
|
### 3. Exécuter une tâche
|
|
|
|
Cliquez sur l'une des cartes de tâche disponibles:
|
|
|
|
- **Résumé automatique** (✨): Génère une description courte
|
|
- Autres tâches en mode beta (non implémentées)
|
|
|
|
### 4. Résultat
|
|
|
|
Le résumé est automatiquement ajouté dans le frontmatter YAML de la note sous le champ `description:`.
|
|
|
|
---
|
|
|
|
## 📊 Exemple d'utilisation
|
|
|
|
### Avant
|
|
|
|
```yaml
|
|
---
|
|
tags: []
|
|
creation_date: 2025-01-15
|
|
---
|
|
|
|
# Ma note importante
|
|
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
|
|
```
|
|
|
|
### Après exécution de "Résumé automatique"
|
|
|
|
```yaml
|
|
---
|
|
tags: []
|
|
creation_date: 2025-01-15
|
|
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
|
|
---
|
|
|
|
# Ma note importante
|
|
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
|
|
```
|
|
|
|
---
|
|
|
|
## 🔧 Configuration requise
|
|
|
|
### Dépendances
|
|
|
|
- Angular 20+
|
|
- TailwindCSS 3.4+
|
|
- ObsiViewer services: `VaultService`, `HttpClient`
|
|
|
|
### API Backend
|
|
|
|
- Endpoint `PATCH /api/vault/notes/:id` pour mettre à jour le frontmatter
|
|
|
|
---
|
|
|
|
## 📚 Documentation complète
|
|
|
|
| Document | Description |
|
|
|----------|-------------|
|
|
| [TECHNICAL_IMPLEMENTATION.md](./TECHNICAL_IMPLEMENTATION.md) | Architecture technique détaillée |
|
|
| [USER_GUIDE.md](./USER_GUIDE.md) | Guide utilisateur avec captures d'écran |
|
|
| [INTEGRATION_GUIDE.md](./INTEGRATION_GUIDE.md) | Guide pour développeurs |
|
|
|
|
---
|
|
|
|
## 🎨 Design
|
|
|
|
### Thèmes supportés
|
|
|
|
Le panneau IA Gemini s'adapte automatiquement à tous les thèmes ObsiViewer:
|
|
|
|
- Light / Dark
|
|
- Obsidian
|
|
- Nord
|
|
- Notion
|
|
- GitHub
|
|
- Discord
|
|
- Monokai
|
|
|
|
### Responsive
|
|
|
|
- **Desktop**: Panneau modal centré (max-width: 2xl)
|
|
- **Tablet**: Panneau plein écran avec overlay
|
|
- **Mobile**: Panneau plein écran optimisé
|
|
|
|
---
|
|
|
|
## ⚡ Performance
|
|
|
|
### Temps de traitement
|
|
|
|
- Chargement du panneau: < 50ms
|
|
- Analyse du contenu: ~200-800ms
|
|
- Mise à jour YAML: < 100ms
|
|
- **Total**: < 1 seconde
|
|
|
|
### Optimisations
|
|
|
|
- Utilisation d'Angular Signals pour la réactivité
|
|
- ChangeDetectionStrategy.OnPush
|
|
- Animations CSS optimisées
|
|
- Lazy loading du composant
|
|
|
|
---
|
|
|
|
## 🔒 Sécurité
|
|
|
|
### Validation des données
|
|
|
|
- Vérification de l'existence de la note
|
|
- Validation du contenu avant traitement
|
|
- Sanitization des résultats IA
|
|
- Gestion d'erreurs robuste
|
|
|
|
### Permissions
|
|
|
|
- Accès lecture/écriture au vault requis
|
|
- Aucune donnée envoyée à des services externes (pour le MVP)
|
|
|
|
---
|
|
|
|
## 🧪 Tests
|
|
|
|
### Tests manuels
|
|
|
|
1. Ouvrir le panneau IA Gemini
|
|
2. Sélectionner différentes notes (vides, courtes, longues)
|
|
3. Exécuter "Résumé automatique"
|
|
4. Vérifier que le frontmatter est correctement mis à jour
|
|
5. Tester sur mobile/tablet/desktop
|
|
6. Tester avec différents thèmes
|
|
|
|
### Tests automatisés (à venir)
|
|
|
|
- Unit tests pour `GeminiService`
|
|
- Integration tests pour `GeminiPanelComponent`
|
|
- E2E tests avec Playwright
|
|
|
|
---
|
|
|
|
## 🚦 Statut
|
|
|
|
| Fonctionnalité | Status | Version |
|
|
|----------------|--------|---------|
|
|
| Résumé automatique | ✅ Production | 1.0.0 |
|
|
| Tags intelligents | 🚧 Beta | - |
|
|
| Détection de type | 🚧 Beta | - |
|
|
| Enrichissement | 🚧 Beta | - |
|
|
| Suggestions liens | 🚧 Beta | - |
|
|
| Extraction mots-clés | 🚧 Beta | - |
|
|
|
|
---
|
|
|
|
## 📝 Roadmap
|
|
|
|
### Version 1.1 (Q1 2025)
|
|
|
|
- [ ] Intégration API Gemini réelle
|
|
- [ ] Implémentation "Tags intelligents"
|
|
- [ ] Tests automatisés complets
|
|
|
|
### Version 1.2 (Q2 2025)
|
|
|
|
- [ ] Détection de type de contenu
|
|
- [ ] Enrichissement automatique des métadonnées
|
|
- [ ] Interface de configuration avancée
|
|
|
|
### Version 2.0 (Q3 2025)
|
|
|
|
- [ ] Suggestions de liens intelligents
|
|
- [ ] Extraction de mots-clés
|
|
- [ ] Analyse de sentiments
|
|
- [ ] Résumés multi-paragraphes
|
|
|
|
---
|
|
|
|
## 🤝 Contribution
|
|
|
|
Pour contribuer à l'amélioration de l'interface IA Gemini:
|
|
|
|
1. Lire [INTEGRATION_GUIDE.md](./INTEGRATION_GUIDE.md)
|
|
2. Fork le repository
|
|
3. Créer une branche feature
|
|
4. Implémenter et tester
|
|
5. Soumettre une Pull Request
|
|
|
|
---
|
|
|
|
## 📞 Support
|
|
|
|
Pour toute question ou problème:
|
|
|
|
- GitHub Issues: [ObsiViewer/issues](https://github.com/brunoCharest/ObsiViewer/issues)
|
|
- Documentation: [docs/GEMINI/](./GEMINI/)
|
|
- Email: support@obsiviewer.com
|
|
|
|
---
|
|
|
|
**Dernière mise à jour**: 2025-01-15
|
|
**Version**: 1.0.0
|
|
**Auteur**: Bruno Charest
|