Skip to content

haileyhuber8/chat-building-block

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Chat Building Block

Add Azure OpenAI chat completions to your existing Python FastAPI app. Run one script, deploy with azd up.

What It Does

This building block adds a fully working AI chat endpoint to an existing app:

  • Azure OpenAI provisioned via Bicep (gpt-4o-mini, 10K TPM)
  • Managed identity (keyless auth) -- no API keys to manage
  • Drop-in ChatClient for Python with streaming support
  • /chat API endpoint added to your FastAPI app
  • Chat UI widget with floating button and chat panel

Quick Start

Prerequisites

Two Commands

# 1. From your project root, run the script
c:\path\to\chat-building-block\add-chat.ps1

# 2. Deploy
azd up

That's it. Your app now has a /chat endpoint powered by Azure OpenAI.

What the Script Does

The add-chat.ps1 script makes 9 changes to your project:

Step File Change
1 infra/chat.bicep Copies in the Azure OpenAI Bicep module
2 infra/main.bicep Adds the chat module, RBAC, and outputs
3 infra/app-chat-role.bicep Creates managed identity role assignment
4 chat_client.py Copies the drop-in Azure OpenAI client
5 requirements.txt Adds openai and azure-identity
6 main.py Adds ChatClient init and /chat endpoint
7 azure.yaml Wires environment variables from azd outputs
8 static/chat.css, static/chat.js Copies chat UI assets
9 templates/base.html Injects floating chat widget

The script is idempotent -- running it again skips already-applied changes.

Usage Options

# Run from your project root (default -- uses the repo's own files)
c:\Users\hahuber\code\chat-building-block\add-chat.ps1

# Or specify a custom block source
.\add-chat.ps1 -BlockSource C:\path\to\chat-building-block

Repo Structure

chat-building-block/
  add-chat.ps1              # Automation script
  block.yaml                # Block manifest
  code/python/
    chat_client.py           # Drop-in Azure OpenAI client
    requirements.txt         # Python dependencies
  code/ui/
    chat-widget.html         # Floating chat widget HTML snippet
    chat.css                 # Chat widget styles
    chat.js                  # Chat widget client-side logic
  infra/
    chat.bicep               # Azure OpenAI infrastructure
    chat.parameters.json     # Bicep parameters
  hooks/
    postprovision.ps1        # Post-provision hook (Windows)
    postprovision.sh         # Post-provision hook (Linux/Mac)
  docs/
    integration-guide.md     # Detailed manual integration guide
  tests/python/
    test_chat_client.py      # Unit tests for ChatClient

Testing the Chat Endpoint

After deploying with azd up:

POST /chat
Content-Type: application/json

{"message": "Hello, how can you help me?"}

Look for the chat button in the bottom-right corner of your app.

Detailed Guide

For a step-by-step manual walkthrough (without the automation script), see docs/integration-guide.md.

About

Add Azure OpenAI chat to your existing app. Run one script, deploy with azd up.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors