Grapevine_Disease_Detection/PROJECT_SUMMARY.md

VinEye - Project Summary

Plateforme de detection de maladies de la vigne par IA Derniere mise a jour : 2026-04-09

---

Vue d'ensemble

VinEye est une plateforme complete de detection de maladies de la vigne composee de :

• Application mobile (VinEye) : React Native / Expo, scan camera avec inference IA embarquee
• Dashboard admin (vineye-admin) : Next.js, gestion du contenu et suivi des utilisateurs
• Pipeline ML : CNN TensorFlow entraine sur 9 027 images de feuilles de vigne

Public cible : amateurs de vin, viticulteurs, jardiniers.

---

Stack technique

Couche	Mobile (VinEye)	Admin (vineye-admin)	ML
Framework	React Native 0.81 + Expo SDK 54	Next.js 16.2	TensorFlow / Keras
Langage	TypeScript strict	TypeScript strict	Python 3
Styling	NativeWind (Tailwind 3.4) + StyleSheet	Tailwind 4 + shadcn/ui	—
Navigation	React Navigation v7	App Router	—
Images	expo-image	next/image	—
Gradients	expo-linear-gradient	—	—
Animations	react-native-reanimated 4.1	—	—
Gestures	react-native-gesture-handler 2.28	—	—
Edge-to-edge	expo-navigation-bar + expo-status-bar	—	—
Icones	lucide-react-native	lucide-react	—
Cache	AsyncStorage + cacheManager (TTL)	—	—
Reseau	expo-network (connectivite)	—	—
Toast	sonner-native	Sonner	—
Base de donnees	AsyncStorage (local)	PostgreSQL via Prisma 7.6	—
Auth	— (local only)	Better Auth (JWT + sessions)	—
Forms	—	Zod validation	—
IA	Mock JS (intégration TFLite native échouée — build CMake Windows)	—	CNN MobileNetV2, 256×256

---

Avancement global

Application mobile — 95% complete

Feature	Status	Detail
Navigation (14 ecrans)	Done	Bottom tabs + FAB scanner + stack screens + 4 ecrans detail
HomeScreen	Done	Header, search, CTA, carousel maladies, alertes, guides
Scanner (camera)	Done	Capture photo, overlay detection, confidence meter
Resultats scan	Done	Affichage cepage, confiance, tags, grille infos
MyPlants (ex-Library)	Done	Liste scans groupes par date (today/yesterday/week/month/older), swipe-to-action (favori+suppr), recherche, pull-to-refresh, empty state CTA
ScanDetailScreen	Done	Hero immersif 380px, carte resultat + barre confiance animee, carte cepage conditionnelle, meta card (date+XP), location card (stub), share/delete actions
Profil utilisateur	Done	Avatar, stats Bento 2x2, XP, niveau
Parametres	Done	Theme, langue, notifications, referral
Guides maladies	Done	Connecte a l'API backend, SmallDiseaseCard en grille sur l'ecran Guides, icones Lucide par maladie, dot severite, degrade bordure
Guides pratiques	Done	3 guides avec contenu structure, GuideListItem iOS-style avec icones par categorie, stagger animations
Pages de detail	Done	DiseaseDetailScreen, GuideDetailScreen — hero immersif, edge-to-edge, animation d'entree
Edge-to-edge	Done	Contenu defile derriere status bar, navigation bar transparente (Android), useSafeAreaInsets
Transitions navigation	Done	Fade 250ms par defaut, slide_from_bottom pour modal Result, gesture back active
API mobile	Done	Service API centralise (apiGet), cache AsyncStorage avec TTL, detection IP automatique Expo
Connectivite reseau	Done	Hook useNetworkStatus (expo-network), NetworkContext, detection online/offline temps reel
Toast	Done	sonner-native, toasts auto offline/online, variantes success/error/warning/info
Sync maladies	Done	useDiseases/useDiseaseDetail : API → cache → fallback local, pull-to-refresh
Sync guides	Done	useGuides/useGuideDetail : meme strategie 3 niveaux
Cards maladies	Done	SmallDiseaseCard reutilisable, icones Lucide (Droplets, Snowflake, Skull...), dot severite anime, degrade bordure
List items guides	Done	GuideListItem iOS-style, icones par categorie (Leaf, Calendar, Grape), stagger animations
Skeleton loading	Done	Composants shimmer pour cards maladies, list items guides, carousel
Gamification	Done	7 niveaux, 7 badges, XP, streaks, decouvertes
i18n (FR + EN)	Done	Toutes les cles traduites (maladies enrichies + guides sections + tips)
Notifications	Partiel	UI uniquement, pas de push notifs
Carte/Map	Partiel	Placeholder, geoloc non implementee
Inference IA reelle	Bloque	Code mobile pret + libs installees, mais build CMake echoue sur Windows (path-too-long sur node_modules/react-native-fast-tflite). Voir Points critiques.

Dashboard admin — 95% complete

Feature	Status	Detail
Authentification	Done	Login email/password, sessions 7j, middleware
Dashboard stats	Done	Compteurs, scans recents, top maladies (Recharts)
CRUD Maladies enrichi	Done	Formulaire 7 sections : infos, symptomes, timeline visuelle, details techniques (accordeon), images par URL, apparence, publication
CRUD Guides enrichi	Done	Formulaire 5 sections : infos, contenu ancien (deprecie), editeur sections structurees (reorder, delete, tip, image), apparence, publication
Gestion alertes	Done	Alertes saisonnieres, region, dates, toggle actif
Gestion utilisateurs	Done	Liste paginee, stats, ban/unban, roles
API REST admin	Done	Endpoints complets pour diseases, guides, alerts, scans, users
API mobile publique	Done	4 endpoints GET sans auth (/api/mobile/diseases, guides + detail par slug), CORS, pagination, cache headers
Schema DB enrichi	Done	Disease : +timeline, +conditions[], +actions[], +impactedParts[], +DiseaseImage[]. Guide : +readTime, +coverImage, +GuideSection[]

Pipeline ML — 60% complete

Feature	Status	Detail
Architecture CNN	Done	4 blocs conv + classification, 3.8M params
Dataset	Done	9 027 images, 4 classes (Black Rot, ESCA, Healthy, Leaf Blight)
Entrainement	Done	100 epochs, Adam lr=0.001, augmentation
Precision modele	A ameliorer	~30% (surapprentissage probable vers ESCA)
Export TFLite	Done	grapevine_v1.tflite (9 MB) embarque dans assets mobile
Integration mobile	Bloque	Code mobile pret + libs installees, mais build CMake natif echoue (Windows path-too-long sur le sous-projet react-native-fast-tflite)

---

Points critiques

1. Inference IA — Modele branche, qualite a ameliorer

Status : modele branche et fonctionnel via react-native-fast-tflite. MAIS le modele actuel a ~25% de validation accuracy (overfitting massif diagnostique). Les predictions sont donc souvent erronees en conditions reelles.

Stack mobile :

• react-native-fast-tflite ^3.0.1 + react-native-nitro-modules ^0.35.6
• Modele : VinEye/src/assets/models/grapevine_v1.tflite (9 MB, MobileNetV2 256x256, 4 classes)
• Plugin Expo withCmakeFix pour les flags CMake (response files + ninja path) qui evitent le bug "path too long" sur Windows lors du build C++ Nitro
• Fallback gracieux : si chargement modele echoue, le service tombe sur mockDetection() (random pondere) + log error console

Prochaines actions :

• Retrainer le modele (data augmentation, regularization, fix data leakage, fine-tuning progressif de MobileNetV2)
• Voir docs/audit_report.md (a produire) pour le diagnostic complet
• Quand un nouveau .tflite sera pret, juste remplacer le fichier dans assets/models/grapevine_v1.tflite (interface du service inchangee)
• Eventuellement : quantization int8 post-training pour passer de 9 MB a ~2.5 MB

2. Stockage images — PARTIELLEMENT RESOLU

Les DiseaseImage et GuideSection.image existent en DB avec des URLs. Il manque un systeme d'upload reel (S3/Cloudinary). Les images sont ajoutees par URL manuelle dans les formulaires admin.

3. Synchronisation mobile <-> serveur — PARTIELLEMENT RESOLU

Les maladies et guides se synchronisent via l'API mobile publique avec cache local et fallback offline. Il reste a implementer : auth mobile, sync des scans, sync des alertes.

4. Precision du modele ML

~30% de precision est insuffisant pour un usage reel. Le modele semble surfit vers la classe ESCA.

Pistes :

• Augmenter et equilibrer le dataset
• Experimenter d'autres architectures (ResNet, EfficientNet transfer learning)
• Cross-validation + early stopping
• Analyser la matrice de confusion par classe

5. Absence de tests

Aucun test unitaire ou d'integration dans aucune partie du projet (mobile, admin, ML).

6. Images placeholder

Les images des maladies et cepages utilisent des URLs Unsplash generiques (vignobles, raisins, feuilles). A remplacer par de vraies photos agronomiques specifiques a chaque maladie (stockage local ou distant).

7. Formulaires admin enrichis — DONE

Les formulaires CRUD pour maladies et guides reflètent tous les champs du schema enrichi (timeline, conditions, actions, sections structurees, images). Validation Zod côte serveur.

---

Features detaillees

Gamification (mobile)

Element	Detail
Niveaux	7 : Bourgeon → Vendangeur → Amateur → Sommelier → Expert → Maitre → Maitre de Chai
XP	+10 scan, +25 nouveau cepage, +5 streak, +5 confiance >90%
Badges	7 : Premier Scan, Connaisseur, En Feu, Oeil Affute, Explorateur, Perfectionniste, Maitre
Streaks	Scans quotidiens consecutifs

Base de maladies (7)

Maladie	Type	Severite
Mildiou	Fongique	Haute
Oidium	Fongique	Haute
Black Rot	Fongique	Haute
ESCA	Fongique	Moyenne
Botrytis	Fongique	Moyenne
Flavescence Doree	Bacterien	Haute
Chlorose	Abiotique	Basse

Base de cepages (~15)

Varietes francaises avec : nom FR/EN, couleur, regions, caracteristiques. Utilises pour l'affichage post-scan (mock actuel attribue un cepage aleatoire quand result=vine).

Schema base de donnees (admin)

User (better-auth + role, xp, level, banned)
  ├── Session
  ├── Account
  └── Scan* ──→ Disease?

Disease (slug, name FR/EN, type, severity, symptoms, treatment, published)

Guide (slug, title FR/EN, content, category, order, published)

SeasonAlert (title FR/EN, type, region, active, dateRange)

API REST (admin)

Methode	Endpoint	Description
GET/POST	/api/diseases	Liste / creation
GET/PUT/DELETE	/api/diseases/[id]	Detail / edition / suppression
GET/POST	/api/guides	Liste / creation
GET/PUT/DELETE	/api/guides/[id]	Detail / edition / suppression
GET/POST	/api/alerts	Liste / creation
GET/PUT/DELETE	/api/alerts/[id]	Detail / edition / suppression
GET/POST	/api/scans	Liste / creation
GET/PUT/DELETE	/api/scans/[id]	Detail / edition / suppression
GET	/api/users	Liste utilisateurs
GET	/api/users/[id]	Detail utilisateur

---

Design System (mobile)

Token	Valeur
Fond app	#F8F9FB
Cards	#FFFFFF, radius 24-32, border #F0F0F0
Primary (vert vigne)	#2D6A4F (800), #1B4332 (900)
Accent (violet raisin)	#8E24AA (700), #6A0572 (800)
Texte principal	#1A1A1A
Texte secondaire	#8E8E93
Style	Bento Box minimaliste, espaces genereux

---

Arborescence du projet

Grapevine_Disease_Detection/
├── VinEye/                       # App mobile React Native + Expo
│   ├── App.tsx                   # Point d'entree
│   ├── src/
│   │   ├── screens/              # 14 ecrans (+ DiseaseDetail, GuideDetail, ScanDetail, MyPlants)
│   │   ├── components/           # UI (ui/, home/, scanner/, gamification/, history/, guides/, my-plants/, disease/)
│   │   ├── config/               # api.ts (base URL dynamique Expo)
│   │   ├── contexts/             # NetworkContext, ToastContext
│   │   ├── services/             # tflite, storage, haptics
│   │   ├── services/api/         # client.ts, diseases.ts, guides.ts, mappers.ts
│   │   ├── services/cache/       # cacheManager.ts (AsyncStorage TTL)
│   │   ├── hooks/                # useDetection, useGameProgress, useHistory, useScanDetail, useDiseases, useGuides, useNetworkStatus
│   │   ├── navigation/           # RootNavigator, BottomTabNavigator
│   │   ├── i18n/                 # fr.json, en.json
│   │   ├── theme/                # colors, typography, spacing
│   │   ├── data/                 # diseases.ts, guides.ts
│   │   ├── types/                # detection, gamification, navigation
│   │   └── utils/                # cepages, achievements, dateGrouping, diseaseIcons, guideIcons
│   ├── app.json                  # Config Expo
│   └── package.json
│
├── vineye-admin/                 # Dashboard admin Next.js
│   ├── app/
│   │   ├── (admin)/              # Routes protegees (dashboard, diseases, guides, alerts, users)
│   │   ├── (auth)/login/         # Page de connexion
│   │   └── api/                  # Routes API REST
│   ├── components/               # UI admin (shadcn/ui)
│   ├── components/admin/         # disease-form.tsx, guide-form.tsx (formulaires enrichis)
│   ├── app/api/mobile/           # Endpoints publics pour l'app mobile
│   │   ├── diseases/             # route.ts, [slug]/route.ts
│   │   └── guides/               # route.ts, [slug]/route.ts
│   ├── lib/                      # auth.ts, prisma.ts, utils.ts, validations.ts
│   ├── prisma/schema.prisma      # Schema DB enrichi (Disease, Guide, DiseaseImage, GuideSection)
│   └── package.json
│
├── docs/images/                  # Documentation dataset
├── venv/                         # Environnement Python (training ML)
└── PROJECT_SUMMARY.md            # Ce fichier

---

Prochaines etapes prioritaires

1. Ameliorer le modele ML — Passer de ~30% a >80% de precision (transfer learning, dataset equilibre)
2. Integrer TFLite dans l'app — Remplacer le mock par le vrai modele
3. Stockage images — S3 ou Cloudinary pour les photos (remplacer les URLs manuelles)
4. Auth mobile + sync scans — Connecter les scans a l'API (auth mobile, queue offline)
5. Sync alertes — Connecter les alertes saisonnieres au backend
6. Push notifications — Firebase Cloud Messaging
7. Tests — Ajouter des tests unitaires et d'integration
8. Carte des maladies — Implementer la feature Map avec donnees geoloc reelles