JeremyMikaleff/Anderson-User_Interface_for_RAG

Anderson — Interface utilisateur pour RAG

Anderson est une interface Web permettant de gérer des collections documentaires et de tester un pipeline de recherche sémantique destiné à enrichir des prompts pour un système RAG.

Cette application constitue la partie front-end d’une démonstration publique déployée sur Hugging Face Spaces.

<br>

Fonctionnalités

L’interface permet de :

• —consulter les collections documentaires ;
• —créer, modifier et supprimer une collection ;
• —visualiser le nombre de documents présents dans chaque collection ;
• —consulter les documents d’une collection ;
• —importer un document avec un sélecteur de fichier ;
• —importer un document par glisser-déposer ;
• —supprimer un document et ses données associées ;
• —visualiser le nombre de chunks générés ;
• —envoyer un prompt à une collection ;
• —afficher le prompt enrichi par les résultats de la recherche vectorielle ;
• —consulter les chunks utilisés comme sources ;
• —afficher les scores de similarité retournés par l’API.

<br>

Démonstration

• —Interface Anderson
• —API Anderson
• —Documentation Swagger

<br>

Architecture de la démonstration

La démonstration utilise :

• —React pour construire l’interface ;
• —TypeScript pour typer les données et les échanges avec l’API ;
• —React Router pour gérer la navigation ;
• —Vite pour le développement et la compilation ;
• —ESLint pour contrôler la qualité du code ;
• —Docker pour construire l’application ;
• —Nginx pour servir les fichiers compilés ;
• —FastAPI pour l’API distante ;
• —PostgreSQL avec pgvector pour la recherche vectorielle ;
• —Hugging Face Spaces pour l’hébergement.

L’état de l’interface est géré localement avec les hooks React. Cette démonstration n’utilise pas Redux.

<br>

Parcours utilisateur

Gestion des collections

La page des collections permet de consulter les collections disponibles, d’en créer de nouvelles, de les modifier et de les supprimer.

Chaque collection indique également le nombre de documents qu’elle contient.

Gestion des documents

La page d’une collection affiche ses documents et leurs principales métadonnées :

• —titre ;
• —nom du fichier ;
• —type MIME ;
• —taille ;
• —date de création ;
• —nombre de chunks.

Les formats acceptés sont PDF, TXT, HTML et DOCX, avec une taille maximale de 5 Mo.

Test d’un prompt

La page de test permet de sélectionner une collection, de saisir une question et de choisir le nombre maximal de résultats à récupérer.

L’API retourne :

• —le prompt original ;
• —le prompt enrichi ;
• —le modèle d’embedding utilisé ;
• —les chunks documentaires sélectionnés ;
• —la distance et la similarité de chaque résultat.

Cette fonctionnalité réalise l’enrichissement documentaire du prompt. Elle ne génère pas directement une réponse avec un modèle de langage.

<br>

Routes de l’interface

Toute route inconnue redirige actuellement vers la page d’accueil.

<br>

Installation locale

Prérequis

• —Node.js ;
• —npm ;
• —une connexion à l’API Anderson.

Installation

npm install

Lancer l’application

npm run dev

L’application est généralement accessible sur :

http://localhost:5173

Vérifications

npm run lint
npm run build

<br>

Configuration de l’API

L’adresse de l’API peut être remplacée avec une variable d’environnement :

VITE_API_BASE_URL=https://adresse-de-api.example

Sans cette variable, l’application utilise automatiquement l’API publique Anderson.

<br>

Documentation technique

L’organisation des dossiers, le rôle des fichiers et la circulation des données sont décrits dans la documentation de l’architecture.

<br>

Limites de la démonstration

Cette interface réalise la gestion documentaire et l’enrichissement d’un prompt par recherche vectorielle.

Elle ne fait pas appel directement à un modèle de langage pour générer une réponse finale. Le résultat fourni correspond au prompt enrichi et aux sources documentaires sélectionnées.