UStackUStack
chat icon

chat

chat est un client IA polyvalent qui se connecte à un serveur MCP externe pour discuter en langage naturel, avec réponses en streaming et Markdown.

chat

Qu'est-ce que chat ?

chat est un client IA polyvalent conçu pour fonctionner avec le serveur MCP d'un service. Il fournit une interface en langage naturel qui peut se connecter à un serveur MCP externe et interagir avec ses outils, quel que soit le domaine (par exemple, livraison, réservation ou gestion de tâches).

Le projet est construit comme une application Next.js App Router et se concentre sur les détails pratiques d'UI et d'intégration nécessaires pour les expériences de chat : connexion d'outils via MCP, réponses en streaming, historique des messages, et prise en charge de contenus multimodaux tels que les entrées d'images et les sorties d'assistant basées sur Markdown.

Fonctionnalités principales

  • Intégration d'outils MCP via Streamable HTTP : se connecte à un serveur MCP externe, configuré via MCP_URL (n'importe quel backend) ou MCP_APPS_URL (TypeScript + UI intégrée) ; l'application rejette la présence des deux paramètres au runtime.
  • Réponses IA en streaming avec indicateurs de frappe en temps réel : la sortie de l'assistant est diffusée au fur et à mesure de sa génération plutôt que renvoyée en une fois.
  • Rendu Markdown pour les messages de l'assistant : les messages de l'assistant sont rendus en Markdown, y compris les tableaux, listes, blocs de code et liens.
  • Pièces jointes d'images avec recadrage avant envoi : les utilisateurs peuvent joindre des images, sont invités à les recadrer avant envoi, et l'image est compressée et téléversée uniquement au moment de l'envoi (pour éviter les téléversements prématurés).
  • Prise en charge des sorties d'images LLM : l'assistant peut inclure des images dans ses réponses via la syntaxe Markdown standard comme ![alt](url) ; les images s'affichent sous forme de cartes carrées avec squelettes de chargement différé et s'ouvrent en taille réelle au clic.
  • Historique des conversations avec pagination basée sur curseur : l'historique de chat persistant est récupéré par pages avec un comportement de défilement infini.
  • Prise en charge de l'authentification et de la localisation : email/mot de passe avec vérification, réinitialisation et Google OAuth ; détection de la langue via géolocalisation IP (IPinfo Lite) avec fallback sur Accept-Language, et un paramètre utilisateur modifiable.

Comment utiliser chat

  1. Lancez l'application (voir les prérequis) et créez un fichier .env.local à la racine du projet.
  2. Configurez les paramètres de connexion MCP en utilisant soit MCP_URL, soit MCP_APPS_URL (choisissez-en un). Optionnellement, définissez des variables de marque et de contexte persona comme NEXT_PUBLIC_APP_NAME et APP_PERSONA_CONTEXT.
  3. Connectez-vous avec les méthodes d'authentification prises en charge.
  4. Démarrez une conversation dans l'UI de chat. L'assistant peut diffuser des réponses en streaming et appeler les outils MCP exposés par votre serveur MCP.
  5. Si vous activez les limites de messages (WEEKLY_MESSAGE_LIMIT), l'UI affiche un avertissement quand le quota restant est faible et bloque les envois supplémentaires quand il est épuisé.

Cas d'usage

  • Assistant de livraison ou d'expédition : connectez-vous à un serveur MCP lié à la livraison pour aider les utilisateurs à coordonner les demandes et suivre via un flux conversationnel.
  • Réservation de bricoleur : connectez un serveur MCP de réservation de bricoleur pour que l'assistant guide les utilisateurs dans les tâches et collecte les détails requis via des appels d'outils.
  • Interface de gestion de tâches : utilisez un serveur MCP de gestion de tâches pour traduire le langage naturel en actions exécutées par votre backend.
  • Assistance multimodale avec images : téléversez une image (recadrez avant envoi) et demandez à l'assistant de l'analyser ou de l'intégrer dans un flux ; supporte aussi les réponses d'assistant incluant des cartes d'images.
  • Support multilingue pour équipes : fiez-vous à la détection de langue intégrée et au système i18n personnalisé pour localiser les chaînes d'UI et les invites système IA pour des langues comme EN, ID, KR, JP, ES, ZH, DE, NL, FR et IT.

FAQ

Quelle configuration MCP l'application supporte-t-elle ?

L'application supporte la connexion à un seul serveur MCP. Elle utilise soit MCP_URL, soit MCP_APPS_URL. La définition des deux est rejetée au runtime.

Comment les réponses IA sont-elles délivrées dans l'UI ?

Les réponses sont diffusées en temps réel, avec des indicateurs de frappe affichés pendant la génération.

Les utilisateurs peuvent-ils envoyer des images, et l'assistant peut-il en afficher ?

Oui. Les utilisateurs peuvent joindre des images via un flux de recadrage avant envoi ; les images sont compressées et téléversées uniquement lors de l'envoi du message. L'assistant peut aussi intégrer des images dans ses réponses via la syntaxe Markdown pour images.

L'historique de chat est-il sauvegardé ?

Oui. L'application maintient un historique de conversation persistant et utilise une pagination basée sur curseur avec défilement infini.

Y a-t-il des limites au nombre de messages envoyables ?

Optionnellement, une limite hebdomadaire par utilisateur peut être configurée avec WEEKLY_MESSAGE_LIMIT. Quand activée, l'UI avertit quand le nombre restant est faible et renvoie un blocage 429 quand épuisé.

Alternatives

  • Applications web de chat IA génériques sans intégration d’outils MCP : elles se concentrent sur le chat basé sur des prompts mais ne fournissent pas de connexion structurée au protocole d’outils vers le backend de votre service.
  • Implémentations personnalisées de clients MCP (UI/stack différent) : vous pouvez créer un autre client pour les appels d’outils MCP, mais le workflow et les fonctionnalités (gestion d’images, historique des messages, localisation) peuvent différer.
  • Solutions RAG/chat centrées sur la récupération plutôt que sur les appels d’outils : elles sont orientées vers la recherche de connaissances et l’ancrage documentaire au lieu d’orchestrer des actions via les outils MCP.
  • Interfaces de chat multimodales polyvalentes : elles prennent en charge les entrées/sorties d’images, mais peuvent ne pas inclure le même workflow piloté par MCP pour se connecter aux outils de services externes.
chat | UStack