$ show microsoft/sample-app-aoai-chatGPT
This is a sample application from Microsoft demonstrating how to build a chatbot with Azure OpenAI and your own data using Retrieval-Augmented Generation (RAG). It is a full-stack web application with a Python Quart async backend and a React/TypeScript frontend. The backend handles conversation orchestration, integrates with Azure OpenAI for chat completions, and supports multiple data sources (Azure Cognitive Search, CosmosDB, Elasticsearch, Pinecone, etc.) for grounding responses. It also includes a comprehensive data preparation pipeline (scripts) for chunking documents, generating embeddings, and indexing into search services. The frontend provides a modern chat interface with features like streaming responses, citation display, chat history, and file upload. The repository is primarily an application but has a strong data engineering component, making it a hybrid. It is actively maintained, well-structured with tests and CI/CD, but has some technical drift due to preview APIs and outdated dependencies.
The LLM identified 4 files worth highlighting for reuse:
Provides a centralized, extensible configuration system using Pydantic models. Each datasource implements a `DatasourcePayloadConstructor` abstract class, making it easy to add new backends. The pattern of separating settings by source and using environment variables is clean and reusable across projects.
Contains a well-designed parser factory for different document types (Markdown, HTML, PDF, Python, images) and text splitters (MarkdownTextSplitter, PythonCodeTextSplitter, PdfTextSplitter). The `PdfTextSplitter` is table-aware and uses PyMuPDF. The extraction of text splitting logic into a reusable module with a clear interface is a strong pattern for any data pipeline.
A self-contained React component for rendering chatbot answers with citations, intents, and a feedback dialog. It uses CSS modules for styling and is designed to be reusable. The component handles edge cases like missing citations and supports markdown rendering. It is a good example of a well-structured, accessible UI component.
Provides a clean abstraction for all backend API calls, including streaming responses via fetch. It handles authentication headers, error responses, and request cancellation. The pattern of centralizing API logic in a single module with typed request/response objects is a best practice for frontend applications.