Skip to content
All case studies

07 · PurpleTalk

GenAI chatbot frontend

Frontend for a GenAI chatbot (OpenAI & Hugging Face models) with document search and web-search fallback.

Context

A GenAI chatbot built on OpenAI and Hugging Face models. It answers from uploaded documents and falls back to web search when nothing matches. I built the frontend only.

My role

Frontend only. I did not work on model integration or the backend.

Architecture

Architecture, left to right. Users: User, Admin → Frontend (mine): React · MUI · SCSS → Backend and models: OpenAI & Hugging Face models, search, uploads.

My scope is the frontend. Models and backend are outside it. Dashed boxes are outside my scope.

Key decisions

  1. 01

    Document search first, web search as fallback

    The chatbot answers from documents and falls back to web search for unmatched queries. The frontend has a view for each and moves between them.

  2. 02

    A multi-turn flow that keeps context

    Follow-up questions build on earlier ones, so a conversation holds context across queries.

  3. 03

    An admin dashboard for document uploads

    Admins upload documents to widen what the chatbot can search, and a usage widget shows searches and successful responses.

Results

  • Shipped the model selector, conversation flow, document-search and web-search views, admin upload dashboard and usage stats widget.

Stack

  • React
  • MUI
  • SCSS