Skip to content

Frontend Configuration

Configuration options for the web application.

Environment Variables

Create .env.local in the frontend-agent directory:

# Microsoft Azure AD
NEXT_PUBLIC_AZURE_CLIENT_ID=your-azure-client-id
NEXT_PUBLIC_AZURE_TENANT_ID=your-azure-tenant-id
NEXT_PUBLIC_AZURE_REDIRECT_URI=http://localhost:3000

# LiveKit
LIVEKIT_API_KEY=your-livekit-api-key
LIVEKIT_API_SECRET=your-livekit-api-secret
NEXT_PUBLIC_LIVEKIT_URL=wss://your-livekit-url

# Optional
NEXT_PUBLIC_AGENT_BACKEND_URL=http://localhost:7880

App Configuration

Edit app-config.ts to customize branding and features:

export const APP_CONFIG_DEFAULTS: AppConfig = {
  companyName: 'Bayer',
  pageTitle: 'Bayer Voice Agent',
  pageDescription: 'A voice agent built by Team DHub',

  // Features
  supportsChatInput: true,
  supportsVideoInput: true,
  supportsScreenShare: true,
  isPreConnectBufferEnabled: true,

  // Branding
  logo: '/bayer.png',
  logoDark: '/bayerimg.svg',
  accent: '#002cf2',
  accentDark: '#1fd5f9',
  startButtonText: 'Start call',
};

Azure AD Setup

  1. Register app in Azure Portal (Azure AD > App registrations)
  2. Set redirect URI to your app URL
  3. Note Client ID and Tenant ID
  4. Add to environment variables

For production, update NEXT_PUBLIC_AZURE_REDIRECT_URI to your deployed URL.