midterm-submission

.gitignore

@@ -0,0 +1,42 @@
+# Python
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+.Python
+env/
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+*.egg-info/
+.installed.cfg
+*.egg
+
+# Node
+node_modules/
+npm-debug.log
+yarn-debug.log
+yarn-error.log
+
+# Environment variables
+.env
+.env.local
+.env.*.local
+
+# IDE
+.vscode/
+.idea/
+*.swp
+*.swo
+
+# OS
+.DS_Store
+Thumbs.db

Dockerfile

@@ -0,0 +1,37 @@
+# Build frontend
+FROM node:18-alpine as frontend-build
+
+WORKDIR /frontend
+COPY podcraft/package*.json ./
+RUN npm install
+COPY podcraft/ .
+RUN npm run build
+
+# Build backend
+FROM python:3.11-slim
+
+WORKDIR /app
+
+# Install system dependencies
+RUN apt-get update && apt-get install -y \
+    build-essential \
+    && rm -rf /var/lib/apt/lists/*
+
+# Copy and install Python dependencies
+COPY server/requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Copy backend code
+COPY server/ .
+
+# Create necessary directories
+RUN mkdir -p audio_storage transcripts
+
+# Copy frontend build to a static directory
+COPY --from=frontend-build /frontend/dist /app/static
+
+# Expose port
+EXPOSE 7860
+
+# Start FastAPI application
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860"] 

docker-compose.yml

@@ -0,0 +1,32 @@
+version: '3.8'
+
+services:
+  frontend:
+    build:
+      context: ./podcraft
+      dockerfile: Dockerfile
+    ports:
+      - "3000:80"
+    depends_on:
+      - backend
+    environment:
+      - VITE_API_URL=http://localhost:8000
+
+  backend:
+    build:
+      context: ./server
+      dockerfile: Dockerfile
+    ports:
+      - "8000:8000"
+    volumes:
+      - ./server/audio_storage:/app/audio_storage
+      - ./server/transcripts:/app/transcripts
+    environment:
+      - OPENAI_API_KEY=${OPENAI_API_KEY}
+      - ELEVEN_API_KEY=${ELEVEN_API_KEY}
+      - TAVILY_API_KEY=${TAVILY_API_KEY}
+    healthcheck:
+      test: ["CMD", "curl", "-f", "http://localhost:8000/health"]
+      interval: 30s
+      timeout: 10s
+      retries: 3 

podcraft/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

podcraft/Dockerfile

@@ -0,0 +1,34 @@
+# Build stage
+FROM node:18-alpine as build
+
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+
+# Install dependencies
+RUN npm install
+
+# Copy source code
+COPY . .
+
+# Build the application
+RUN npm run build
+
+# Production stage
+FROM nginx:alpine
+
+# Remove default nginx static assets
+RUN rm -rf /usr/share/nginx/html/*
+
+# Copy built files from build stage
+COPY --from=build /app/dist /usr/share/nginx/html
+
+# Copy nginx configuration
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# Expose port
+EXPOSE 80
+
+# Start Nginx
+CMD ["nginx", "-g", "daemon off;"] 

podcraft/README.md

@@ -0,0 +1,8 @@
+# React + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

podcraft/eslint.config.js

@@ -0,0 +1,38 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import react from 'eslint-plugin-react'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+
+export default [
+  { ignores: ['dist'] },
+  {
+    files: ['**/*.{js,jsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        ecmaFeatures: { jsx: true },
+        sourceType: 'module',
+      },
+    },
+    settings: { react: { version: '18.3' } },
+    plugins: {
+      react,
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...js.configs.recommended.rules,
+      ...react.configs.recommended.rules,
+      ...react.configs['jsx-runtime'].rules,
+      ...reactHooks.configs.recommended.rules,
+      'react/jsx-no-target-blank': 'off',
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+]

podcraft/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>

podcraft/nginx.conf

@@ -0,0 +1,45 @@
+server {
+    listen 80;
+    server_name localhost;
+
+    location / {
+        root /usr/share/nginx/html;
+        index index.html;
+        try_files $uri $uri/ /index.html;
+    }
+
+    location /api/ {
+        proxy_pass http://backend:8000/;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection 'upgrade';
+        proxy_set_header Host $host;
+        proxy_cache_bypass $http_upgrade;
+        
+        # CORS headers
+        add_header 'Access-Control-Allow-Origin' '*' always;
+        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
+        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;
+        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
+        
+        if ($request_method = 'OPTIONS') {
+            add_header 'Access-Control-Allow-Origin' '*';
+            add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
+            add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';
+            add_header 'Access-Control-Max-Age' 1728000;
+            add_header 'Content-Type' 'text/plain; charset=utf-8';
+            add_header 'Content-Length' 0;
+            return 204;
+        }
+    }
+
+    # Audio files proxy
+    location /audio-files/ {
+        proxy_pass http://backend:8000/audio-files/;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection 'upgrade';
+        proxy_set_header Host $host;
+        proxy_cache_bypass $http_upgrade;
+    }
+} 

podcraft/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "podcraft",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite --port 3000",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-router-dom": "^7.2.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.19.0",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "eslint": "^9.19.0",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-react-refresh": "^0.4.18",
+    "globals": "^15.14.0",
+    "vite": "^6.1.0"
+  }
+}

podcraft/src/App.css

@@ -0,0 +1,1084 @@
+/* Theme Variables */
+:root {
+  --bg-primary: #013135;  /* Dark teal for sidebar/main elements */
+  --bg-secondary: #AFDDE5;  /* Light teal for background */
+  --text-primary: #ffffff;  /* White text for contrast */
+  --text-secondary: #AFDDE5;  /* Light teal for secondary text */
+  --accent-primary: #12A3B0;  /* Bright teal for interactive elements */
+  --accent-secondary: #964834;  /* Rust color for secondary accents */
+  --border-color: #014951;  /* Medium teal for borders */
+  --card-bg: #014951;  /* Medium teal for cards */
+  --card-shadow: 0 4px 6px rgba(1, 49, 53, 0.2);  /* Teal-tinted shadow */
+  --hover-bg: #014951;  /* Medium teal for hover states */
+  --chat-bg: #AFDDE5;  /* Light teal for chat background */
+  --card-bg-rgb: 1, 73, 81;  /* RGB values for #014951 */
+}
+
+[data-theme='dark'] {
+  --bg-primary: #1a1a1a;
+  --bg-secondary: #2d2d2d;
+  --text-primary: #ffffff;
+  --text-secondary: #a3a3a3;
+  --accent-primary: #818cf8;
+  --accent-secondary: #6366f1;
+  --border-color: #404040;
+  --card-bg: #1a1a1a;
+  --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
+  --hover-bg: #404040;
+  --chat-bg: #141414;
+  --card-bg-rgb: 26, 26, 26;  /* RGB values for #1a1a1a */
+}
+
+/* Reset default margins and make app take full viewport */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body, html {
+  height: 100vh;
+  width: 100%;
+  overflow-x: hidden;
+  background-color: var(--bg-secondary);
+  color: var(--text-primary);
+  transition: background-color 0.3s, color 0.3s;
+}
+
+#root {
+  min-height: 100vh;
+  width: 100%;
+  display: flex;
+}
+
+.app {
+  display: flex;
+  flex: 1;
+  position: relative;
+}
+
+.wave-canvas {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  background-color: var(--bg-primary);
+}
+
+/* Left Navigation Styles */
+.leftnav {
+  width: 250px;
+  background-color: var(--bg-primary);
+  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
+  padding: 2rem 0;
+  height: 100vh;
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+}
+
+.nav-brand {
+  font-size: 1.75rem;
+  font-weight: bold;
+  padding: 0 2rem 2rem 2rem;
+  border-bottom: 1px solid var(--border-color);
+  background: linear-gradient(
+    135deg,
+    #12A3B0,
+    #AFDDE5,
+    #014951,
+    #013135,
+    #964834
+  );
+  -webkit-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  animation: gradient-shift 8s ease infinite;
+  background-size: 300% auto;
+}
+
+@keyframes gradient-shift {
+  0% {
+    background-position: 0% 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
+  }
+}
+
+.nav-links {
+  display: flex;
+  flex-direction: column;
+  padding: 2rem 0;
+  gap: 0.5rem;
+  flex: 1;
+}
+
+.nav-link {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  padding: 1rem 2rem;
+  text-decoration: none;
+  color: var(--text-secondary);
+  font-weight: 500;
+  transition: all 0.2s;
+}
+
+.nav-link:hover {
+  background-color: var(--hover-bg);
+  color: var(--accent-primary);
+}
+
+.nav-link.active {
+  background-color: var(--hover-bg);
+  color: var(--accent-primary);
+  border-right: 3px solid var(--accent-primary);
+}
+
+.nav-icon {
+  font-size: 1.25rem;
+}
+
+/* Theme Toggle Styles */
+.theme-toggle {
+  padding: 2rem;
+  border-top: 1px solid var(--border-color);
+}
+
+.theme-button {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  width: 100%;
+  padding: 1rem;
+  background-color: var(--bg-primary);
+  color: var(--text-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: 0.5rem;
+  cursor: pointer;
+  transition: all 0.2s;
+  font-size: 1rem;
+}
+
+.theme-button:hover {
+  background-color: var(--hover-bg);
+  color: var(--accent-primary);
+}
+
+/* Main Content Styles */
+.main-content {
+  flex: 1;
+  margin-left: 250px;
+  display: flex;
+  flex-direction: column;
+}
+
+/* Chat Interface Styles */
+.chat-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  background-color: var(--bg-secondary);
+  height: 90vh;
+  max-width: 800px;
+  margin: 2rem auto;
+  border-radius: 1rem;
+  background: var(--bg-primary);
+  overflow: hidden;
+  position: relative;
+  width: 95%;
+}
+
+.chat-container::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  border-radius: 1rem;
+  padding: 2px;
+  background: linear-gradient(
+    135deg,
+    #12A3B0,
+    #014951,
+    #964834
+  );
+  -webkit-mask: linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.8;
+  pointer-events: none;
+}
+
+.chat-messages {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 1.5rem;
+  gap: 0.75rem;
+  overflow-y: auto;
+  background-color: var(--chat-bg, var(--bg-secondary));
+  max-height: calc(90vh - 80px);
+  scrollbar-width: thin;
+  scrollbar-color: var(--accent-primary) var(--bg-primary);
+  padding-bottom: 2rem;
+  width: 100%;
+}
+
+/* Webkit scrollbar styles */
+.chat-messages::-webkit-scrollbar {
+  width: 8px;
+}
+
+.chat-messages::-webkit-scrollbar-track {
+  background: var(--bg-primary);
+  border-radius: 4px;
+}
+
+.chat-messages::-webkit-scrollbar-thumb {
+  background: var(--accent-primary);
+  border-radius: 4px;
+}
+
+.chat-messages::-webkit-scrollbar-thumb:hover {
+  background: var(--accent-secondary);
+}
+
+.message {
+  display: flex;
+  padding: 0.75rem 1rem;
+  border-radius: 0.75rem;
+  max-width: 95%;
+  word-wrap: break-word;
+  font-size: 0.95rem;
+  gap: 1rem;
+  align-items: flex-start;
+  overflow-wrap: break-word;
+  width: fit-content;
+}
+
+.message-content {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 0.75rem;
+  width: 100%;
+}
+
+.message-text-content {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  flex: 1;
+}
+
+.agent-icon {
+  font-size: 1.25rem;
+  min-width: 1.5rem;
+  text-align: center;
+}
+
+.agent-name {
+  font-size: 0.8rem;
+  text-transform: capitalize;
+  color: var(--text-secondary);
+  font-weight: 500;
+  margin-bottom: 0.25rem;
+}
+
+.message-text {
+  line-height: 1.5;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  max-width: 100%;
+}
+
+/* Agent-specific styles */
+.extractor-message {
+  background-color: var(--card-bg);
+  border: 1px solid var(--border-color);
+  color: var(--text-primary);
+}
+
+.skeptic-message {
+  background-color: var(--card-bg);
+  border: 1px solid var(--border-color);
+  color: var(--text-primary);
+}
+
+.believer-message {
+  background-color: var(--card-bg);
+  border: 1px solid var(--border-color);
+  color: var(--text-primary);
+}
+
+.supervisor-message {
+  background-color: var(--accent-primary);
+  color: white;
+  opacity: 0.9;
+}
+
+.system-message {
+  max-width: 100%;
+  width: 100%;
+  background-color: var(--bg-primary);
+  border: 1px dashed var(--border-color);
+  color: var(--text-secondary);
+  font-style: italic;
+  margin: 0.5rem 0;
+}
+
+.bot-message {
+  align-self: flex-start;
+  background-color: var(--card-bg);
+  color: var(--text-primary);
+  border-bottom-left-radius: 0.25rem;
+  box-shadow: var(--card-shadow);
+  border: 1px solid var(--border-color);
+}
+
+.user-message {
+  align-self: flex-end;
+  background-color: var(--accent-primary);
+  color: white;
+  border-bottom-right-radius: 0.25rem;
+  opacity: 0.9;
+}
+
+.message .agent-icon {
+  display: inline-block;
+  margin-right: 0.5rem;
+  font-size: 1.25rem;
+  vertical-align: middle;
+}
+
+.chat-input-form {
+  display: flex;
+  padding: 1rem;
+  gap: 0.75rem;
+  background-color: var(--bg-primary);
+  border-top: 1px solid var(--border-color);
+  min-height: 80px;  /* Fixed height for input form */
+}
+
+.chat-input {
+  flex: 1;
+  padding: 0.75rem 1rem;
+  border: 1px solid var(--border-color);
+  border-radius: 0.5rem;
+  font-size: 0.95rem;
+  outline: none;
+  transition: all 0.2s;
+  background-color: var(--bg-primary);
+  color: var(--text-primary);
+}
+
+.chat-input:focus {
+  border-color: var(--accent-primary);
+  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1);
+}
+
+.chat-send-button {
+  padding: 0 1.5rem;
+  background-color: var(--accent-primary);
+  color: white;
+  border: none;
+  border-radius: 0.5rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+  font-size: 0.95rem;
+}
+
+.chat-send-button:hover {
+  background-color: var(--accent-secondary);
+  transform: translateY(-1px);
+}
+
+/* Podcasts Page Styles */
+.podcasts-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 2rem;
+  position: relative;
+  z-index: 1;
+  background: transparent;
+}
+
+.podcasts-header {
+  text-align: center;
+  margin: 2rem 0 4rem 0;
+  width: 100%;
+  position: relative;
+  z-index: 2;
+}
+
+.podcasts-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2rem;
+  max-width: 1400px;
+  width: 100%;
+  padding: 0 2rem;
+  justify-content: center;
+  position: relative;
+  z-index: 2;
+}
+
+.podcast-card {
+  flex: 1;
+  min-width: 320px;
+  max-width: 400px;
+  background-color: var(--card-bg);
+  border-radius: 1.5rem;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  transition: all 0.3s ease;
+  overflow: hidden;
+  backdrop-filter: blur(10px);
+  background: rgba(var(--card-bg-rgb), 0.8);
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+
+.podcast-card::before {
+  content: '';
+  position: absolute;
+  inset: -2px;
+  border-radius: 1.5rem;
+  padding: 2px;
+  background: linear-gradient(
+    135deg,
+    rgb(147, 51, 234) 0%,     /* Start with Purple */
+    rgb(147, 51, 234) 20%,    /* Hold Purple */
+    rgb(103, 90, 240) 40%,    /* Mix Purple-Blue */
+    rgb(59, 130, 246) 60%,    /* Mix Purple-Blue */
+    rgb(59, 130, 246) 80%,    /* Hold Blue */
+    rgb(59, 130, 246) 100%    /* End with Blue */
+  );
+  -webkit-mask: linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 1;
+  transition: opacity 0.3s ease;
+}
+
+.podcast-card:hover {
+  transform: translateY(-8px);
+}
+
+.podcast-card:hover::before {
+  opacity: 1;
+}
+
+.podcast-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 2rem;
+  gap: 1.5rem;
+  background: linear-gradient(
+    to bottom,
+    var(--card-bg),
+    var(--bg-primary)
+  );
+}
+
+.podcast-title {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  color: var(--text-primary);
+  font-size: 1.5rem;
+  font-weight: 600;
+  line-height: 1.4;
+}
+
+.podcast-title::before {
+  content: '🎧';
+  font-size: 1.75rem;
+}
+
+.description {
+  color: var(--text-secondary);
+  line-height: 1.6;
+  font-size: 0.95rem;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+
+.listen-button {
+  padding: 0.75rem 1.5rem;
+  background-color: var(--accent-primary);
+  color: white;
+  border: none;
+  border-radius: 0.75rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+  font-size: 0.95rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  align-self: flex-start;
+}
+
+.listen-button::after {
+  content: '▶';
+  font-size: 0.8rem;
+}
+
+.listen-button:hover {
+  background-color: var(--accent-secondary);
+  transform: translateY(-2px);
+}
+
+/* Podcast Form Page Styles */
+.podcast-form-container {
+  display: flex;
+  padding: 2rem;
+  height: calc(100vh - 4rem);
+  max-width: 1200px;
+  margin: 0 auto;
+  width: 100%;
+}
+
+.chat-column {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+.podcast-chat-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  background: var(--bg-primary);
+  border-radius: 1.5rem;
+  overflow: hidden;
+  position: relative;
+}
+
+.podcast-chat-container::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  border-radius: 1.5rem;
+  padding: 2px;
+  background: linear-gradient(
+    135deg,
+    #12A3B0,
+    #014951,
+    #964834
+  );
+  -webkit-mask: linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 0.8;
+  pointer-events: none;
+}
+
+.podcast-chat-messages {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  padding: 1.5rem;
+  gap: 1rem;
+  overflow-y: auto;
+  background: var(--chat-bg, var(--bg-secondary));
+}
+
+.podcast-chat-input-form {
+  display: flex;
+  padding: 1rem;
+  gap: 0.75rem;
+  background: var(--bg-primary);
+  border-top: 1px solid var(--border-color);
+}
+
+.podcast-chat-input {
+  flex: 1;
+  padding: 0.75rem 1rem;
+  border: 1px solid var(--border-color);
+  border-radius: 0.75rem;
+  background: var(--bg-primary);
+  color: var(--text-primary);
+  font-size: 0.95rem;
+  transition: all 0.2s;
+}
+
+.podcast-chat-input:focus {
+  outline: none;
+  border-color: var(--accent-primary);
+  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1);
+}
+
+.podcast-chat-send-button {
+  padding: 0 1.5rem;
+  background: var(--accent-primary);
+  color: white;
+  border: none;
+  border-radius: 0.75rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.podcast-chat-send-button:hover {
+  background: var(--accent-secondary);
+  transform: translateY(-2px);
+}
+
+.podcast-chat-send-button::after {
+  content: '▶';
+  font-size: 0.8rem;
+}
+
+/* Responsive Design for Form Page */
+@media (max-width: 1024px) {
+  .podcast-form-container {
+    flex-direction: column;
+    height: auto;
+  }
+
+  .form-column,
+  .chat-column {
+    width: 100%;
+  }
+
+  .podcast-chat-container {
+    height: 500px;
+  }
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+  .leftnav {
+    width: 200px;
+  }
+  
+  .main-content {
+    margin-left: 200px;
+  }
+  
+  .nav-brand {
+    font-size: 1.5rem;
+    padding: 0 1.5rem 1.5rem 1.5rem;
+  }
+  
+  .nav-link {
+    padding: 0.75rem 1.5rem;
+  }
+  
+  .feature-card,
+  .podcast-card {
+    min-width: 250px;
+  }
+}
+
+.chat-header {
+  padding: 1rem;
+  background: var(--bg-primary);
+  border-bottom: 1px solid var(--border-color);
+  display: flex;
+  justify-content: center;
+}
+
+.agent-selector {
+  padding: 0.75rem 2.5rem 0.75rem 1rem;
+  border: 1px solid var(--border-color);
+  border-radius: 0.75rem;
+  background: var(--bg-primary);
+  color: var(--text-primary);
+  font-size: 0.95rem;
+  cursor: pointer;
+  transition: all 0.2s;
+  appearance: none;
+  -webkit-appearance: none;
+  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right 1rem center;
+  background-size: 1em;
+}
+
+.agent-selector:focus {
+  outline: none;
+  border-color: var(--accent-primary);
+  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1);
+}
+
+.agent-selector:hover {
+  border-color: var(--accent-primary);
+}
+
+.agent-selector option {
+  padding: 0.5rem;
+  background: var(--bg-primary);
+  color: var(--text-primary);
+}
+
+.loading-dots {
+  display: inline-block;
+  position: relative;
+  color: var(--text-secondary);
+}
+
+.loading-dots::after {
+  content: '...';
+  position: absolute;
+  animation: loading-dots 1.5s infinite;
+  width: 1.5em;
+  text-align: left;
+}
+
+@keyframes loading-dots {
+  0% { content: '.'; }
+  33% { content: '..'; }
+  66% { content: '...'; }
+  100% { content: '.'; }
+}
+
+.audio-player {
+  margin-top: 1rem;
+  width: 100%;
+  padding: 0.5rem;
+  background: var(--bg-primary);
+  border-radius: 0.5rem;
+  border: 1px solid var(--border-color);
+}
+
+.audio-player audio {
+  width: 100%;
+  height: 40px;
+  outline: none;
+}
+
+/* Customize audio player controls */
+.audio-player audio::-webkit-media-controls-panel {
+  background-color: var(--bg-primary);
+}
+
+.audio-player audio::-webkit-media-controls-current-time-display,
+.audio-player audio::-webkit-media-controls-time-remaining-display {
+  color: var(--text-primary);
+}
+
+.audio-player audio::-webkit-media-controls-play-button,
+.audio-player audio::-webkit-media-controls-timeline,
+.audio-player audio::-webkit-media-controls-volume-slider {
+  filter: invert(1);
+}
+
+/* Chat Message Podcast Card Styles */
+.chat-messages .podcast-card {
+  width: 100%;
+  max-width: 600px;
+  margin: 1rem auto;
+  background-color: var(--card-bg);
+  border-radius: 1rem;
+  overflow: hidden;
+  transition: all 0.3s ease;
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+
+.chat-messages .podcast-card::before {
+  content: '';
+  position: absolute;
+  inset: -2px;
+  border-radius: 1rem;
+  padding: 2px;
+  background: linear-gradient(
+    135deg,
+    rgb(147, 51, 234) 0%,     /* Start with Purple */
+    rgb(147, 51, 234) 20%,    /* Hold Purple */
+    rgb(103, 90, 240) 40%,    /* Mix Purple-Blue */
+    rgb(59, 130, 246) 60%,    /* Mix Purple-Blue */
+    rgb(59, 130, 246) 80%,    /* Hold Blue */
+    rgb(59, 130, 246) 100%    /* End with Blue */
+  );
+  -webkit-mask: linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  opacity: 1;
+  transition: opacity 0.3s ease;
+}
+
+.chat-messages .podcast-card:hover::before {
+  opacity: 1;
+}
+
+.chat-messages .podcast-content {
+  padding: 1.5rem;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.chat-messages .podcast-title {
+  font-size: 1.25rem;
+  color: var(--text-primary);
+  margin: 0;
+}
+
+.chat-messages .description {
+  font-size: 0.95rem;
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+.chat-messages .listen-button {
+  align-self: flex-start;
+  padding: 0.75rem 1.5rem;
+  background-color: var(--accent-primary);
+  color: white;
+  border: none;
+  border-radius: 0.5rem;
+  font-size: 0.9rem;
+  cursor: pointer;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  min-width: 120px;
+  justify-content: center;
+}
+
+.chat-messages .listen-button:hover {
+  background-color: var(--accent-secondary);
+  transform: translateY(-2px);
+}
+
+.chat-messages .listen-button:active {
+  transform: translateY(0);
+}
+
+.chat-messages .listen-button:focus {
+  outline: 2px solid var(--accent-secondary);
+  outline-offset: 2px;
+}
+
+/* Podcasts Page Messages */
+.loading-message,
+.error-message,
+.no-podcasts-message {
+  text-align: center;
+  padding: 2rem;
+  font-size: 1.2rem;
+  color: var(--text-primary);
+  background: var(--card-bg);
+  border-radius: 1rem;
+  border: 1px solid var(--border-color);
+  margin: 2rem;
+  width: 100%;
+  max-width: 600px;
+}
+
+.error-message {
+  color: #ef4444;
+  border-color: #ef4444;
+}
+
+.loading-message {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 1rem;
+}
+
+.loading-message::after {
+  content: '...';
+  animation: loading-dots 1.5s infinite;
+}
+
+/* Update podcast card styles for audio player */
+.podcast-card .audio-player {
+  width: 100%;
+  margin: 1rem 0;
+  padding: 0.5rem;
+  background: var(--bg-primary);
+  border-radius: 0.5rem;
+  border: 1px solid var(--border-color);
+}
+
+.podcast-card .audio-player audio {
+  width: 100%;
+  height: 40px;
+  outline: none;
+}
+
+.podcast-card .audio-player audio::-webkit-media-controls-panel {
+  background-color: var(--bg-primary);
+}
+
+.podcast-card .audio-player audio::-webkit-media-controls-current-time-display,
+.podcast-card .audio-player audio::-webkit-media-controls-time-remaining-display {
+  color: var(--text-primary);
+}
+
+.podcast-card .audio-player audio::-webkit-media-controls-play-button,
+.podcast-card .audio-player audio::-webkit-media-controls-timeline,
+.podcast-card .audio-player audio::-webkit-media-controls-volume-slider {
+  filter: invert(1);
+}
+
+.podcast-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  position: relative;
+  width: 100%;
+}
+
+.delete-button {
+  opacity: 0;
+  position: absolute;
+  top: -0.5rem;
+  right: -0.5rem;
+  width: 2rem;
+  height: 2rem;
+  border-radius: 0.25rem;
+  background-color: var(--accent-secondary);
+  color: white;
+  border: none;
+  cursor: pointer;
+  font-size: 1.5rem;
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s ease;
+  z-index: 1;
+}
+
+.podcast-card:hover .delete-button {
+  opacity: 1;
+}
+
+.delete-button:hover {
+  background-color: #ef4444;
+  transform: scale(1.1);
+}
+
+.delete-button:active {
+  transform: scale(0.95);
+}
+
+.podcast-player-header {
+  padding: 1.5rem;
+  background: var(--bg-primary);
+  border-bottom: 1px solid var(--border-color);
+}
+
+.podcast-player-header .podcast-title {
+  font-size: 1.25rem;
+  color: var(--text-primary);
+  margin-bottom: 1rem;
+}
+
+.podcast-player-header .audio-player {
+  width: 100%;
+  padding: 0.5rem;
+  background: var(--card-bg);
+  border-radius: 0.5rem;
+  border: 1px solid var(--border-color);
+}
+
+.podcast-player-header .audio-player audio {
+  width: 100%;
+  height: 40px;
+  outline: none;
+}
+
+.podcast-player-header .audio-player audio::-webkit-media-controls-panel {
+  background-color: var(--bg-primary);
+}
+
+.podcast-player-header .audio-player audio::-webkit-media-controls-current-time-display,
+.podcast-player-header .audio-player audio::-webkit-media-controls-time-remaining-display {
+  color: var(--text-primary);
+}
+
+.podcast-player-header .audio-player audio::-webkit-media-controls-play-button,
+.podcast-player-header .audio-player audio::-webkit-media-controls-timeline,
+.podcast-player-header .audio-player audio::-webkit-media-controls-volume-slider {
+  filter: invert(1);
+}
+
+.podcast-card .category-pill {
+  display: inline-block;
+  padding: 0.25rem 0.75rem;
+  background: var(--accent-primary);
+  color: white;
+  border-radius: 999px;
+  font-size: 0.8rem;
+  font-weight: 500;
+  text-transform: capitalize;
+  opacity: 0.9;
+  margin-bottom: 0.5rem;
+  transition: all 0.2s ease;
+}
+
+.podcast-card .category-pill:hover {
+  opacity: 1;
+  transform: translateY(-1px);
+}
+
+.relevant-chunks {
+  margin-top: 1rem;
+  padding: 1rem;
+  background: rgba(var(--card-bg-rgb), 0.5);
+  border-radius: 0.5rem;
+  font-size: 0.9rem;
+}
+
+.chunk-section {
+  margin-bottom: 1rem;
+}
+
+.chunk-section:last-child {
+  margin-bottom: 0;
+}
+
+.chunk-section h4 {
+  color: var(--accent-primary);
+  margin-bottom: 0.5rem;
+  font-size: 0.95rem;
+}
+
+.chunk-section ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.chunk-section li {
+  padding: 0.5rem;
+  margin-bottom: 0.5rem;
+  background: rgba(var(--card-bg-rgb), 0.3);
+  border-radius: 0.25rem;
+  color: var(--text-secondary);
+  font-size: 0.85rem;
+  line-height: 1.4;
+}
+
+.chunk-section li:last-child {
+  margin-bottom: 0;
+}

podcraft/src/App.jsx

@@ -0,0 +1,54 @@
+import React, { useState, useEffect } from 'react';
+import { BrowserRouter as Router, Routes, Route, NavLink } from 'react-router-dom';
+import './App.css';
+import Home from './pages/Home';
+import Podcasts from './pages/Podcasts';
+import PodcastForm from './pages/PodcastForm';
+import WaveCanvas from './components/WaveCanvas';
+
+function App() {
+  const [isDarkTheme, setIsDarkTheme] = useState(true);
+
+  useEffect(() => {
+    document.body.setAttribute('data-theme', isDarkTheme ? 'dark' : 'light');
+  }, [isDarkTheme]);
+
+  return (
+    <Router>
+      <div className="app">
+        <WaveCanvas />
+        <nav className="leftnav">
+          <div className="nav-brand">PodCraft</div>
+          <div className="nav-links">
+            <NavLink to="/" className={({ isActive }) => isActive ? 'nav-link active' : 'nav-link'}>
+              <span className="nav-icon">🏠</span>
+              Home
+            </NavLink>
+            <NavLink to="/podcasts" className={({ isActive }) => isActive ? 'nav-link active' : 'nav-link'}>
+              <span className="nav-icon">🎧</span>
+              Podcasts
+            </NavLink>
+          </div>
+          <div className="theme-toggle">
+            <button 
+              className="theme-button"
+              onClick={() => setIsDarkTheme(!isDarkTheme)}
+            >
+              <span className="nav-icon">{isDarkTheme ? '☀️' : '🌙'}</span>
+              {isDarkTheme ? 'Light Mode' : 'Dark Mode'}
+            </button>
+          </div>
+        </nav>
+        <main className="main-content">
+          <Routes>
+            <Route path="/" element={<Home />} />
+            <Route path="/podcasts" element={<Podcasts />} />
+            <Route path="/podcast/:id" element={<PodcastForm />} />
+          </Routes>
+        </main>
+      </div>
+    </Router>
+  );
+}
+
+export default App;

podcraft/src/components/WaveCanvas.jsx

@@ -0,0 +1,130 @@
+import React, { useEffect, useRef } from 'react';
+
+const WaveCanvas = () => {
+  const canvasRef = useRef(null);
+
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    
+    const ctx = canvas.getContext('2d');
+    if (!ctx) return;
+    
+    let animationFrameId;
+
+    // Set canvas size
+    const setCanvasSize = () => {
+      canvas.width = window.innerWidth;
+      canvas.height = window.innerHeight;
+    };
+
+    // Initial setup
+    setCanvasSize();
+
+    // Wave parameters
+    const waves = [
+      { amplitude: 120, frequency: 0.001, speed: 0.0005, phase: 0 },
+      { amplitude: 80, frequency: 0.002, speed: 0.0004, phase: 2 }
+    ];
+
+    // Get theme colors
+    const getColors = () => {
+      const isDarkTheme = document.body.getAttribute('data-theme') === 'dark';
+      return {
+        firstWave: isDarkTheme 
+          ? { r: 147, g: 51, b: 234 }  // Purple for dark theme
+          : { r: 18, g: 163, b: 176 },  // #12A3B0 Bright teal
+        secondWave: isDarkTheme
+          ? { r: 59, g: 130, b: 246 }   // Blue for dark theme
+          : { r: 1, g: 73, b: 81 }      // #014951 Medium teal
+      };
+    };
+
+    // Draw function
+    const draw = () => {
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+      
+      // Center the waves vertically
+      const centerY = canvas.height * 0.5;
+      const colors = getColors();
+
+      waves.forEach((wave, index) => {
+        // Update wave phase
+        wave.phase += wave.speed;
+
+        // Create gradient with theme-aware colors
+        const gradient = ctx.createLinearGradient(0, centerY - wave.amplitude, 0, centerY + wave.amplitude);
+        const color = index === 0 ? colors.firstWave : colors.secondWave;
+        
+        if (document.body.getAttribute('data-theme') === 'dark') {
+          gradient.addColorStop(0, `rgba(${color.r}, ${color.g}, ${color.b}, 0)`);
+          gradient.addColorStop(0.5, `rgba(${color.r}, ${color.g}, ${color.b}, 0.8)`);
+          gradient.addColorStop(1, `rgba(${color.r}, ${color.g}, ${color.b}, 0)`);
+        } else {
+          // Light theme gradient with additional color stops
+          gradient.addColorStop(0, `rgba(${color.r}, ${color.g}, ${color.b}, 0)`);
+          gradient.addColorStop(0.2, `rgba(1, 49, 53, 0.4)`);  // #013135
+          gradient.addColorStop(0.5, `rgba(${color.r}, ${color.g}, ${color.b}, 0.8)`);
+          gradient.addColorStop(0.8, `rgba(175, 221, 229, 0.4)`);  // #AFDDE5
+          gradient.addColorStop(1, `rgba(${color.r}, ${color.g}, ${color.b}, 0)`);
+        }
+
+        // Begin drawing wave
+        ctx.beginPath();
+        
+        // Start from bottom left
+        ctx.moveTo(0, canvas.height);
+        ctx.lineTo(0, centerY);
+
+        // Draw wave path
+        for (let x = 0; x <= canvas.width; x++) {
+          const y = centerY + 
+                   Math.sin(x * wave.frequency + wave.phase) * wave.amplitude;
+          ctx.lineTo(x, y);
+        }
+
+        // Complete the path to bottom right
+        ctx.lineTo(canvas.width, centerY);
+        ctx.lineTo(canvas.width, canvas.height);
+        ctx.closePath();
+
+        // Fill with gradient
+        ctx.fillStyle = gradient;
+        ctx.fill();
+      });
+
+      animationFrameId = requestAnimationFrame(draw);
+    };
+
+    // Start animation
+    draw();
+
+    // Handle resize and theme changes
+    const handleResize = () => {
+      setCanvasSize();
+    };
+
+    window.addEventListener('resize', handleResize);
+
+    // Watch for theme changes
+    const observer = new MutationObserver(() => {
+      draw(); // Redraw when theme changes
+    });
+    
+    observer.observe(document.body, {
+      attributes: true,
+      attributeFilter: ['data-theme']
+    });
+
+    // Cleanup
+    return () => {
+      window.removeEventListener('resize', handleResize);
+      cancelAnimationFrame(animationFrameId);
+      observer.disconnect();
+    };
+  }, []);
+
+  return <canvas ref={canvasRef} className="wave-canvas" />;
+};
+
+export default WaveCanvas; 

podcraft/src/index.css

@@ -0,0 +1,68 @@
+:root {
+  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}

podcraft/src/main.jsx

@@ -0,0 +1,10 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import './index.css'
+import App from './App.jsx'
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+)

podcraft/src/pages/Home.tsx

@@ -0,0 +1,214 @@
+import React, { useState, useEffect, useRef } from 'react';
+import '../App.css';
+
+interface Message {
+  id: number;
+  text: string;
+  agent: string;
+  audio_file?: string;
+  title?: string;
+  description?: string;
+  category?: string;
+}
+
+interface DebateEntry {
+  speaker: string;
+  content: string;
+}
+
+interface ChatResponse {
+  debate_history: DebateEntry[];
+  supervisor_notes: string[];
+  final_podcast?: {
+    content: string;
+    audio_file: string;
+    title: string;
+    description: string;
+  };
+}
+
+const API_URL = 'http://localhost:8000';
+
+const Home: React.FC = () => {
+  const [messages, setMessages] = useState<Message[]>([
+    { id: 1, text: "Welcome! I'll help you create your own podcast content by exploring topics through an AI debate. Enter any topic of choice.", agent: "system" },
+  ]);
+  const [inputMessage, setInputMessage] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+  const messagesEndRef = useRef<HTMLDivElement>(null);
+  const audioRef = useRef<HTMLAudioElement>(null);
+
+  useEffect(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+
+  const sendMessageToServer = async (message: string): Promise<ChatResponse> => {
+    try {
+      setMessages(prev => [...prev, {
+        id: prev.length + 1,
+        text: `Processing your request...`,
+        agent: "system"
+      }]);
+
+      const response = await fetch(`${API_URL}/chat`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          content: message,
+          agent_type: "believer",
+          context: {
+            podcast_id: null,
+            agent_chunks: [],
+            current_agent: "believer"
+          }
+        })
+      });
+
+      if (!response.ok) {
+        const errorData = await response.text();
+        throw new Error(`Server error: ${response.status} - ${errorData}`);
+      }
+
+      const data: ChatResponse = await response.json();
+      return data;
+    } catch (error) {
+      console.error('Error sending message:', error);
+      throw error;
+    }
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!inputMessage.trim()) return;
+
+    const userMessage: Message = {
+      id: messages.length + 1,
+      text: inputMessage,
+      agent: "user"
+    };
+
+    setMessages(prev => [...prev, userMessage]);
+    setInputMessage('');
+    setIsLoading(true);
+
+    try {
+      const response = await sendMessageToServer(inputMessage);
+      
+      if (response.debate_history) {
+        response.debate_history.forEach((entry) => {
+          if (entry.speaker && entry.content) {
+            const message: Message = {
+              id: messages.length + 1,
+              text: entry.content,
+              agent: entry.speaker
+            };
+            setMessages(prev => [...prev, message]);
+          }
+        });
+      }
+
+      if (response.supervisor_notes) {
+        response.supervisor_notes.forEach((note) => {
+          const supervisorMessage: Message = {
+            id: messages.length + 1,
+            text: note,
+            agent: "supervisor"
+          };
+          setMessages(prev => [...prev, supervisorMessage]);
+        });
+      }
+
+      if (response.final_podcast && response.final_podcast.audio_file) {
+        const filename = response.final_podcast.audio_file;
+        const [queryPart, descriptionPart, categoryWithExt] = filename.split('-');
+        const category = categoryWithExt.replace('.mp3', '');
+        
+        const podcastMessage: Message = {
+          id: messages.length + 1,
+          text: response.final_podcast.content || "Podcast generated successfully!",
+          agent: "system",
+          audio_file: `/audio-files/${filename}`,
+          title: descriptionPart.replace(/_/g, ' ').replace(/^\w/, c => c.toUpperCase()),
+          description: `A debate exploring ${queryPart.replace(/_/g, ' ')}`,
+          category: category.replace(/_/g, ' ')
+        };
+        setMessages(prev => [...prev, podcastMessage]);
+      }
+    } catch (error) {
+      setMessages(prev => [...prev, {
+        id: prev.length + 1,
+        text: `Error: ${error.message}`,
+        agent: "system"
+      }]);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <div className="chat-container">
+      <div className="chat-messages">
+        {messages.map((message) => (
+          <div key={message.id} className={`message ${message.agent}-message`}>
+            <div className="message-content">
+              <div className="agent-icon">
+                {message.agent === "user" ? "👤" : 
+                 message.agent === "system" ? "🤖" :
+                 message.agent === "believer" ? "💡" :
+                 message.agent === "skeptic" ? "🤔" :
+                 message.agent === "supervisor" ? "👀" :
+                 message.agent === "extractor" ? "🔍" : "💬"}
+              </div>
+              <div className="message-text-content">
+                <div className="agent-name">{message.agent}</div>
+                <div className="message-text">{message.text}</div>
+                {message.audio_file && (
+                  <div className="podcast-card">
+                    <div className="podcast-content">
+                      <h2 className="podcast-title">{message.title || "Generated Podcast"}</h2>
+                      {message.category && (
+                        <div className="category-pill">{message.category}</div>
+                      )}
+                      <p className="description">{message.description || "An AI-generated debate podcast exploring different perspectives"}</p>
+                      <div className="audio-player">
+                        <audio controls src={`${API_URL}${message.audio_file}`} ref={audioRef}>
+                          Your browser does not support the audio element.
+                        </audio>
+                      </div>
+                    </div>
+                  </div>
+                )}
+              </div>
+            </div>
+          </div>
+        ))}
+        {isLoading && (
+          <div className="message system-message">
+            <div className="message-content">
+              <div className="loading-dots">Debating</div>
+              <div className="loading-dots">This might take a few moments since 2 agents are fighting over getting the best insights for you</div>
+            </div>
+          </div>
+        )}
+        <div ref={messagesEndRef} />
+      </div>
+      <form onSubmit={handleSubmit} className="chat-input-form">
+        <input
+          type="text"
+          value={inputMessage}
+          onChange={(e) => setInputMessage(e.target.value)}
+          placeholder="Type your message..."
+          className="chat-input"
+          disabled={isLoading}
+        />
+        <button type="submit" className="chat-send-button" disabled={isLoading}>
+          Send
+        </button>
+      </form>
+    </div>
+  );
+};
+
+export default Home; 

podcraft/src/pages/PodcastForm.tsx

@@ -0,0 +1,209 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { useParams } from 'react-router-dom';
+import '../App.css';
+
+const API_URL = 'http://localhost:8000';
+
+interface Message {
+  id: number;
+  text: string;
+  agent: string;
+}
+
+interface Podcast {
+  id: number;
+  title: string;
+  description: string;
+  audio_file: string;
+}
+
+interface PodcastContext {
+  topic: string;
+  believer_chunks: string[];
+  skeptic_chunks: string[];
+}
+
+const PodcastForm: React.FC = () => {
+  const { id } = useParams<{ id: string }>();
+  const [podcast, setPodcast] = useState<Podcast | null>(null);
+  const [podcastContext, setPodcastContext] = useState<PodcastContext | null>(null);
+  const [messages, setMessages] = useState<Message[]>([]);
+  const [inputMessage, setInputMessage] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+  const messagesEndRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+
+  useEffect(() => {
+    const fetchPodcastAndContext = async () => {
+      try {
+        if (!id) return;
+
+        // Fetch podcast details
+        const response = await fetch(`${API_URL}/audio-list`);
+        if (!response.ok) {
+          throw new Error('Failed to fetch podcasts');
+        }
+        const files = await response.json();
+        
+        const podcastList = files.map((file: any, index: number) => ({
+          id: index + 1,
+          title: file.filename.split('-')[0].replace(/_/g, ' '),
+          description: "An AI-generated debate podcast exploring different perspectives",
+          audio_file: `${API_URL}/audio/${file.filename}`
+        }));
+
+        const selectedPodcast = podcastList.find(p => p.id === parseInt(id));
+        if (selectedPodcast) {
+          setPodcast(selectedPodcast);
+          
+          // Fetch podcast context
+          const contextResponse = await fetch(`${API_URL}/podcast/${id}/context`);
+          if (contextResponse.ok) {
+            const contextData: PodcastContext = await contextResponse.json();
+            setPodcastContext(contextData);
+          }
+        }
+      } catch (err) {
+        console.error('Error fetching podcast:', err);
+      }
+    };
+
+    fetchPodcastAndContext();
+  }, [id]);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!inputMessage.trim() || !id) return;
+
+    const userMessage: Message = {
+      id: messages.length + 1,
+      text: inputMessage,
+      agent: "user"
+    };
+
+    setMessages(prev => [...prev, userMessage]);
+    setInputMessage('');
+    setIsLoading(true);
+
+    try {
+      const response = await fetch(`${API_URL}/podcast-chat/${id}`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          message: inputMessage
+        })
+      });
+
+      if (!response.ok) {
+        throw new Error(`Server error: ${response.status}`);
+      }
+
+      const data = await response.json();
+      
+      const botMessage: Message = {
+        id: messages.length + 2,
+        text: data.response,
+        agent: "assistant"
+      };
+
+      setMessages(prev => [...prev, botMessage]);
+    } catch (error) {
+      console.error('Error sending message:', error);
+      setMessages(prev => [...prev, {
+        id: prev.length + 1,
+        text: `Error: ${error instanceof Error ? error.message : 'Failed to send message'}`,
+        agent: "system"
+      }]);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <div className="podcast-form-container">
+      <div className="chat-column">
+        <div className="podcast-chat-container">
+          {podcast && (
+            <div className="podcast-player-header">
+              <h2 className="podcast-title">{podcast.title}</h2>
+              {podcastContext && (
+                <p className="podcast-topic">Topic: {podcastContext.topic}</p>
+              )}
+              <div className="audio-player">
+                <audio 
+                  controls
+                  src={podcast.audio_file}
+                >
+                  Your browser does not support the audio element.
+                </audio>
+              </div>
+            </div>
+          )}
+          
+          <div className="podcast-chat-messages">
+            {messages.map((message) => (
+              <div key={message.id} className={`message ${message.agent}-message`}>
+                <div className="message-content">
+                  <div className="agent-icon">
+                    {message.agent === "user" ? "👤" : 
+                     message.agent === "system" ? "🤖" : 
+                     message.agent === "assistant" ? "🤖" : "💬"}
+                  </div>
+                  <div className="message-text-content">
+                    <div className="agent-name">{message.agent}</div>
+                    <div className="message-text">{message.text}</div>
+                  </div>
+                </div>
+              </div>
+            ))}
+            {isLoading && (
+              <div className="message system-message">
+                <div className="message-content">
+                  <div className="loading-dots">Processing</div>
+                </div>
+              </div>
+            )}
+            <div ref={messagesEndRef} />
+          </div>
+
+          <form onSubmit={handleSubmit} className="podcast-chat-input-form">
+            <input
+              type="text"
+              value={inputMessage}
+              onChange={(e) => setInputMessage(e.target.value)}
+              placeholder="Ask a question about this podcast..."
+              className="podcast-chat-input"
+              disabled={isLoading}
+            />
+            <button type="submit" className="podcast-chat-send-button" disabled={isLoading}>
+              Send
+            </button>
+          </form>
+          
+          {podcastContext && (
+            <div className="relevant-chunks">
+              <div className="chunk-section">
+                <h4>Key Points</h4>
+                <ul>
+                  {podcastContext.believer_chunks.map((chunk, i) => (
+                    <li key={`believer-${i}`}>{chunk}</li>
+                  ))}
+                  {podcastContext.skeptic_chunks.map((chunk, i) => (
+                    <li key={`skeptic-${i}`}>{chunk}</li>
+                  ))}
+                </ul>
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default PodcastForm; 

podcraft/src/pages/Podcasts.tsx

@@ -0,0 +1,152 @@
+import React, { useState, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import '../App.css';
+
+const API_URL = 'http://localhost:8000';
+
+interface Podcast {
+  id: number;
+  title: string;
+  description: string;
+  audio_file: string;
+  filename: string;
+  category: string;
+}
+
+const Podcasts: React.FC = () => {
+  const navigate = useNavigate();
+  const [podcasts, setPodcasts] = useState<Podcast[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState("");
+
+  useEffect(() => {
+    fetchPodcasts();
+  }, []);
+
+  const handleDelete = async (podcast: Podcast) => {
+    try {
+      const response = await fetch(`${API_URL}/audio/${podcast.filename}`, {
+        method: 'DELETE',
+        headers: {
+          'Content-Type': 'application/json',
+        }
+      });
+      
+      if (!response.ok) {
+        const errorData = await response.text();
+        throw new Error(
+          `Failed to delete podcast (${response.status}): ${errorData}`
+        );
+      }
+      
+      setPodcasts(prev => prev.filter(p => p.filename !== podcast.filename));
+      
+    } catch (err) {
+      console.error('Delete error:', err);
+      setError(err instanceof Error ? err.message : 'Failed to delete podcast');
+      
+      setTimeout(() => setError(""), 5000);
+    }
+  };
+
+  const fetchPodcasts = async () => {
+    try {
+      const response = await fetch(`${API_URL}/audio-list`);
+      if (!response.ok) {
+        throw new Error('Failed to fetch podcasts');
+      }
+      
+      const files = await response.json();
+      
+      const podcastList: Podcast[] = files.map((file: any, index: number) => {
+        const filename = file.filename;
+        const [queryPart, descriptionPart, categoryWithExt] = filename.split('-');
+        const category = categoryWithExt.replace('.mp3', '');
+        
+        return {
+          id: index + 1,
+          title: `${descriptionPart.replace(/_/g, ' ').replace(/^\w/, c => c.toUpperCase())}`,
+          description: `A debate exploring ${queryPart.replace(/_/g, ' ')}`,
+          audio_file: `${API_URL}${file.path}`,
+          filename: filename,
+          category: category.replace(/_/g, ' ')
+        };
+      });
+
+      setPodcasts(podcastList);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'An error occurred');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="podcasts-container">
+        <div className="loading-message">Loading podcasts...</div>
+      </div>
+    );
+  }
+
+  if (error !== "") {
+    return (
+      <div className="podcasts-container">
+        <div className="error-message">Error: {error}</div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="podcasts-container">
+      <header className="podcasts-header">
+        <h1>Your Generated Podcasts</h1>
+        <p>Listen to AI-generated debate podcasts on various topics</p>
+      </header>
+
+      <div className="podcasts-grid">
+        {podcasts.map(podcast => (
+          <div 
+            key={podcast.id} 
+            className="podcast-card"
+            onClick={() => navigate(`/podcast/${podcast.id}`)}
+            style={{ cursor: 'pointer' }}
+          >
+            <div className="podcast-content">
+              <div className="podcast-header">
+                <h2 className="podcast-title">{podcast.title}</h2>
+                <button 
+                  className="delete-button"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    handleDelete(podcast);
+                  }}
+                  aria-label="Delete podcast"
+                >
+                  ×
+                </button>
+              </div>
+              <div className="category-pill">{podcast.category}</div>
+              <p className="description">{podcast.description}</p>
+              <div className="audio-player" onClick={e => e.stopPropagation()}>
+                <audio 
+                  controls
+                  src={podcast.audio_file}
+                >
+                  Your browser does not support the audio element.
+                </audio>
+              </div>
+            </div>
+          </div>
+        ))}
+        {podcasts.length === 0 && (
+          <div className="no-podcasts-message">
+            No podcasts found. Generate your first podcast from the home page!
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default Podcasts; 

podcraft/src/types/index.ts

@@ -0,0 +1,34 @@
+export interface Message {
+  id: number;
+  text: string;
+  agent: string;
+  audio_file?: string;
+  title?: string;
+  description?: string;
+}
+
+export interface DebateEntry {
+  speaker: string;
+  content: string;
+}
+
+export interface PodcastData {
+  content: string;
+  audio_file: string;
+  title: string;
+  description: string;
+  category: string;
+}
+
+export interface ChatResponse {
+  debate_history: DebateEntry[];
+  supervisor_notes: string[];
+  supervisor_chunks: {
+    [key: string]: string[];
+  }[];
+  extractor_data: {
+    content: string;
+    raw_results: any;
+  };
+  final_podcast: PodcastData;
+} 

podcraft/vite.config.js

@@ -0,0 +1,26 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+  server: {
+    port: 80,
+    proxy: {
+      '/api': {
+        target: 'http://backend:8000',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, '')
+      },
+      '/audio-files': {
+        target: 'http://backend:8000',
+        changeOrigin: true
+      }
+    }
+  },
+  build: {
+    outDir: 'dist',
+    assetsDir: 'assets',
+    emptyOutDir: true
+  }
+})

server/Dockerfile

@@ -1,24 +1,26 @@
-FROM python:3.10-slim
+FROM python:3.11-slim
 
-WORKDIR /code
+WORKDIR /app
 
 # Install system dependencies
 RUN apt-get update && apt-get install -y \
     build-essential \
     && rm -rf /var/lib/apt/lists/*
 
-# Copy requirements first for better caching
+# Copy requirements file
 COPY requirements.txt .
+
+# Install Python dependencies
 RUN pip install --no-cache-dir -r requirements.txt
 
-# Copy the rest of the application
+# Copy server code
 COPY . .
 
 # Create necessary directories
-RUN mkdir -p audio_storage context_storage transcripts
+RUN mkdir -p audio_storage transcripts
 
-# Expose the port
-EXPOSE 7860
+# Expose port
+EXPOSE 8000
 
 # Command to run the application
-CMD ["python", "app.py"] 
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] 

server/README.md

@@ -1,59 +0,0 @@
-# Podcast Discussion Server
-
-This is a FastAPI-based server that provides podcast discussion and analysis capabilities.
-
-## Environment Variables
-
-The following environment variables need to be set in the Hugging Face Space:
-
-- `OPENAI_API_KEY`: Your OpenAI API key
-- `ALLOWED_ORIGINS`: Comma-separated list of allowed origins (optional, defaults to Vercel domains and localhost)
-
-## API Endpoints
-
-- `/chat`: Main chat endpoint for podcast discussions
-- `/podcast-chat/{podcast_id}`: Chat endpoint for specific podcast discussions
-- `/audio-list`: List available audio files
-- `/audio/{filename}`: Get specific audio file
-- `/podcast/{podcast_id}/context`: Get podcast context
-
-## Stack
-
-- FastAPI
-- OpenAI
-- Langchain
-- Qdrant
-- GTTS
-
-## Deployment
-
-### Backend (Hugging Face Spaces)
-
-This server is deployed on Hugging Face Spaces using their Docker deployment feature.
-
-### Frontend (Vercel)
-
-When deploying the frontend to Vercel:
-
-1. Set the API base URL in your frontend environment:
-
-   ```
-   VITE_API_BASE_URL=https://your-username-your-space-name.hf.space
-   ```
-
-2. The server is already configured to accept requests from:
-
-   - All Vercel domains (\*.vercel.app)
-   - Local development servers (localhost:3000, localhost:5173)
-
-3. If you're using a custom domain, add it to the `ALLOWED_ORIGINS` environment variable in your Hugging Face Space:
-   ```
-   ALLOWED_ORIGINS=https://your-custom-domain.com,https://www.your-custom-domain.com
-   ```
-
-## Security Features
-
-- CORS protection with specific origin allowlist
-- Security headers (HSTS, XSS Protection, etc.)
-- Rate limiting
-- SSL/TLS encryption (provided by Hugging Face Spaces)

server/app.py

@@ -1,5 +0,0 @@
-import uvicorn
-from main import app
-
-if __name__ == "__main__":
-    uvicorn.run(app, host="0.0.0.0", port=7860) 

server/generate_test_dataset.py

@@ -0,0 +1,241 @@
+import json
+import os
+from uuid import uuid4
+from datetime import datetime
+
+# Define the path for the golden dataset
+GOLDEN_DATASET_DIR = os.path.join(os.path.dirname(__file__), "test_data")
+os.makedirs(GOLDEN_DATASET_DIR, exist_ok=True)
+
+def create_test_case(query, agent_type="believer", context=None):
+    """Helper function to create a test case with standard structure."""
+    return {
+        "id": str(uuid4()),
+        "input": {
+            "query": query,
+            "agent_type": agent_type,
+            "context": context
+        },
+        "expected_output": {
+            "debate_structure": {
+                "min_turns": 2,
+                "max_turns": 4,
+                "required_agents": ["extractor", "believer", "skeptic", "supervisor"]
+            },
+            "transcript_requirements": {
+                "required_fields": ["id", "podcastScript", "topic"],
+                "topic_match": True,
+                "min_script_length": 500
+            },
+            "podcast_requirements": {
+                "required_fields": ["content", "audio_file", "title", "description", "category"],
+                "audio_format": "mp3",
+                "min_file_size": 1000
+            }
+        }
+    }
+
+def generate_test_cases():
+    """Generate 50 diverse test cases."""
+    test_cases = []
+    
+    # Technology Topics (10 cases)
+    tech_topics = [
+        ("Are electric vehicles better for the environment?", "believer"),
+        ("Should artificial intelligence be regulated?", "skeptic"),
+        ("Is blockchain technology revolutionizing finance?", "believer"),
+        ("Are smart homes making us too dependent on technology?", "skeptic"),
+        ("Should social media platforms be responsible for content moderation?", "believer"),
+        ("Is 5G technology safe for public health?", "skeptic"),
+        ("Will quantum computing make current encryption obsolete?", "believer"),
+        ("Should facial recognition be used in public spaces?", "skeptic"),
+        ("Are autonomous vehicles ready for widespread adoption?", "believer"),
+        ("Does virtual reality have practical applications beyond gaming?", "skeptic")
+    ]
+    
+    # Society and Culture (10 cases)
+    society_topics = [
+        ("Is remote work the future of employment?", "believer"),
+        ("Should universal basic income be implemented globally?", "skeptic"),
+        ("Are social media platforms harming mental health?", "believer"),
+        ("Should voting be mandatory?", "skeptic"),
+        ("Is cancel culture beneficial for society?", "believer"),
+        ("Should there be limits on free speech online?", "skeptic"),
+        ("Are gender quotas effective in achieving equality?", "believer"),
+        ("Should religious education be part of public schools?", "skeptic"),
+        ("Is multiculturalism strengthening or weakening societies?", "believer"),
+        ("Should citizenship be available for purchase?", "skeptic")
+    ]
+    
+    # Environment and Sustainability (10 cases)
+    environment_topics = [
+        ("Can renewable energy completely replace fossil fuels?", "believer"),
+        ("Should nuclear power be part of climate change solution?", "skeptic"),
+        ("Is carbon pricing effective in reducing emissions?", "believer"),
+        ("Should single-use plastics be completely banned?", "skeptic"),
+        ("Are vertical farms the future of agriculture?", "believer"),
+        ("Should meat consumption be regulated for environmental reasons?", "skeptic"),
+        ("Is geoengineering a viable solution to climate change?", "believer"),
+        ("Should private companies be allowed to exploit space resources?", "skeptic"),
+        ("Are carbon offsets an effective environmental solution?", "believer"),
+        ("Should environmental protection override economic growth?", "skeptic")
+    ]
+    
+    # Health and Wellness (10 cases)
+    health_topics = [
+        ("Should healthcare be completely free?", "believer"),
+        ("Is telemedicine as effective as traditional healthcare?", "skeptic"),
+        ("Should vaccines be mandatory?", "believer"),
+        ("Is genetic engineering of humans ethical?", "skeptic"),
+        ("Should alternative medicine be covered by insurance?", "believer"),
+        ("Is human enhancement technology ethical?", "skeptic"),
+        ("Should organ donation be opt-out rather than opt-in?", "believer"),
+        ("Are fitness trackers improving public health?", "skeptic"),
+        ("Should sugar be regulated like tobacco?", "believer"),
+        ("Is meditation effective as mental health treatment?", "skeptic")
+    ]
+    
+    # Education and Career (10 cases)
+    education_topics = [
+        ("Should college education be free?", "believer"),
+        ("Is standardized testing effective?", "skeptic"),
+        ("Should coding be mandatory in schools?", "believer"),
+        ("Are traditional degrees becoming obsolete?", "skeptic"),
+        ("Should student debt be forgiven?", "believer"),
+        ("Is homeschooling as effective as traditional schooling?", "skeptic"),
+        ("Should arts education be mandatory?", "believer"),
+        ("Are gap years beneficial for students?", "skeptic"),
+        ("Should schools teach financial literacy?", "believer"),
+        ("Is year-round schooling better for learning?", "skeptic")
+    ]
+    
+    # Add all topics to test cases
+    for topics in [tech_topics, society_topics, environment_topics, health_topics, education_topics]:
+        for query, agent_type in topics:
+            test_cases.append(create_test_case(query, agent_type))
+    
+    return test_cases
+
+def generate_golden_dataset():
+    """Generate a golden dataset for testing the podcast debate system."""
+    
+    # Get test cases
+    test_cases = generate_test_cases()
+    
+    # Create sample transcripts
+    sample_transcripts = [
+        {
+            "id": str(uuid4()),
+            "podcastScript": """**Podcast Script: Electric Vehicles and the Environment**
+
+Host: Welcome to our debate on the environmental impact of electric vehicles...
+
+Skeptic: While EVs reduce direct emissions, we must consider the environmental cost of battery production...
+
+Believer: The long-term benefits of EVs in reducing carbon emissions far outweigh the initial production impact...""",
+            "topic": "Are electric vehicles better for the environment?"
+        },
+        {
+            "id": str(uuid4()),
+            "podcastScript": """**Podcast Script: AI Regulation Debate**
+
+Host: Today we're exploring the complex topic of AI regulation...
+
+Skeptic: Without proper oversight, AI development could lead to serious societal risks...
+
+Believer: Smart regulation can help us harness AI's benefits while minimizing potential harm...""",
+            "topic": "Should artificial intelligence be regulated?"
+        }
+    ]
+
+    # Create the golden dataset structure
+    golden_dataset = {
+        "metadata": {
+            "created_at": datetime.now().isoformat(),
+            "version": "1.0",
+            "description": "Golden dataset for testing the podcast debate system",
+            "total_test_cases": len(test_cases),
+            "categories": [
+                "Technology",
+                "Society and Culture",
+                "Environment and Sustainability",
+                "Health and Wellness",
+                "Education and Career"
+            ]
+        },
+        "test_cases": test_cases,
+        "sample_transcripts": sample_transcripts,
+        "validation_rules": {
+            "debate": {
+                "required_agents": ["extractor", "believer", "skeptic", "supervisor"],
+                "min_debate_turns": 2,
+                "max_debate_turns": 4
+            },
+            "transcript": {
+                "required_fields": ["id", "podcastScript", "topic"],
+                "min_script_length": 500
+            },
+            "podcast": {
+                "required_fields": ["content", "audio_file", "title", "description", "category"],
+                "supported_audio_formats": ["mp3"],
+                "min_file_size": 1000
+            }
+        }
+    }
+
+    # Save the golden dataset
+    output_file = os.path.join(GOLDEN_DATASET_DIR, "golden_dataset.json")
+    with open(output_file, "w") as f:
+        json.dump(golden_dataset, f, indent=2)
+
+    print(f"Golden dataset generated successfully at: {output_file}")
+    return golden_dataset
+
+def validate_test_case(test_case, actual_output):
+    """Validate a test case against actual output."""
+    validation_results = {
+        "test_case_id": test_case["id"],
+        "query": test_case["input"]["query"],
+        "validations": []
+    }
+
+    # Validate debate structure
+    expected_structure = test_case["expected_output"]["debate_structure"]
+    debate_history = actual_output.get("debate_history", [])
+    
+    validation_results["validations"].append({
+        "check": "debate_turns",
+        "passed": expected_structure["min_turns"] <= len(debate_history) <= expected_structure["max_turns"],
+        "details": f"Expected {expected_structure['min_turns']}-{expected_structure['max_turns']} turns, got {len(debate_history)}"
+    })
+
+    # Validate transcript
+    transcript_reqs = test_case["expected_output"]["transcript_requirements"]
+    if "transcript" in actual_output:
+        transcript = actual_output["transcript"]
+        validation_results["validations"].append({
+            "check": "transcript_fields",
+            "passed": all(field in transcript for field in transcript_reqs["required_fields"]),
+            "details": "Transcript field validation"
+        })
+
+    # Validate podcast output
+    podcast_reqs = test_case["expected_output"]["podcast_requirements"]
+    if "final_podcast" in actual_output:
+        podcast = actual_output["final_podcast"]
+        validation_results["validations"].append({
+            "check": "podcast_fields",
+            "passed": all(field in podcast for field in podcast_reqs["required_fields"]),
+            "details": "Podcast field validation"
+        })
+
+    return validation_results
+
+if __name__ == "__main__":
+    # Generate the golden dataset
+    dataset = generate_golden_dataset()
+    print("\nGolden Dataset Summary:")
+    print(f"Number of test cases: {len(dataset['test_cases'])}")
+    print(f"Number of sample transcripts: {len(dataset['sample_transcripts'])}")
+    print(f"Categories covered: {dataset['metadata']['categories']}")
+    print(f"Validation rules defined: {list(dataset['validation_rules'].keys())}") 

server/main.py

@@ -42,36 +42,19 @@ chat_model = ChatOpenAI(
 # Initialize FastAPI app
 app = FastAPI()
 
-# Get allowed origins from environment variable or use default list
-ALLOWED_ORIGINS = os.getenv("ALLOWED_ORIGINS", "").split(",")
-if not ALLOWED_ORIGINS:
-    ALLOWED_ORIGINS = [
-        "http://localhost:5173",
-        "http://localhost:3000",
-        "https://*.vercel.app",  # Allow all Vercel preview and production domains
-    ]
-
-# Configure CORS for frontend servers
+# Configure CORS for frontend development server
 app.add_middleware(
     CORSMiddleware,
-    allow_origins=ALLOWED_ORIGINS,
-    allow_origin_regex=r"https://.*\.vercel\.app$",  # Allow all Vercel domains
+    allow_origins=["http://localhost:5173", "http://localhost:3000"],
     allow_credentials=True,
     allow_methods=["GET", "POST", "PUT", "DELETE", "OPTIONS", "HEAD"],
-    allow_headers=["*"],
-    expose_headers=["*"],
-    max_age=3600,
+    allow_headers=["Content-Type", "Authorization", "Accept"],
+    expose_headers=["Content-Type", "Content-Length"],
+    max_age=600,
 )
 
-# Add security headers middleware
-@app.middleware("http")
-async def add_security_headers(request, call_next):
-    response = await call_next(request)
-    response.headers["X-Content-Type-Options"] = "nosniff"
-    response.headers["X-Frame-Options"] = "DENY"
-    response.headers["X-XSS-Protection"] = "1; mode=block"
-    response.headers["Strict-Transport-Security"] = "max-age=31536000; includeSubDomains"
-    return response
+# Mount static files for React frontend
+app.mount("/", StaticFiles(directory="static", html=True), name="frontend")
 
 # Configure audio storage
 audio_dir = os.path.join(os.path.dirname(__file__), "audio_storage")

server/run_golden_tests.py

@@ -0,0 +1,108 @@
+import asyncio
+import json
+import os
+from datetime import datetime
+from test_workflow import run_workflow
+from workflow import create_workflow
+from generate_test_dataset import GOLDEN_DATASET_DIR, validate_test_case
+from dotenv import load_dotenv
+
+# Load environment variables
+load_dotenv()
+
+async def run_golden_tests():
+    """Run tests using the golden dataset."""
+    
+    # Load the golden dataset
+    dataset_path = os.path.join(GOLDEN_DATASET_DIR, "golden_dataset.json")
+    if not os.path.exists(dataset_path):
+        print("Golden dataset not found. Generating new dataset...")
+        from generate_test_dataset import generate_golden_dataset
+        generate_golden_dataset()
+    
+    with open(dataset_path, 'r') as f:
+        golden_dataset = json.load(f)
+    
+    # Initialize workflow
+    workflow = create_workflow(os.getenv("TAVILY_API_KEY"))
+    
+    # Store test results
+    test_results = {
+        "metadata": {
+            "timestamp": datetime.now().isoformat(),
+            "dataset_version": golden_dataset["metadata"]["version"]
+        },
+        "results": []
+    }
+    
+    # Run tests for each test case
+    for test_case in golden_dataset["test_cases"]:
+        print(f"\nRunning test case: {test_case['input']['query']}")
+        try:
+            # Run the workflow
+            result = await run_workflow(
+                workflow,
+                test_case["input"]["query"],
+                agent_type=test_case["input"]["agent_type"],
+                context=test_case["input"]["context"]
+            )
+            
+            # Validate the results
+            validation_result = validate_test_case(test_case, result)
+            
+            # Add results
+            test_results["results"].append({
+                "test_case_id": test_case["id"],
+                "query": test_case["input"]["query"],
+                "success": all(v["passed"] for v in validation_result["validations"]),
+                "validation_results": validation_result,
+                "workflow_output": result
+            })
+            
+            # Print progress
+            success = all(v["passed"] for v in validation_result["validations"])
+            status = "✅ Passed" if success else "❌ Failed"
+            print(f"{status} - {test_case['input']['query']}")
+            
+        except Exception as e:
+            print(f"❌ Error running test case: {str(e)}")
+            test_results["results"].append({
+                "test_case_id": test_case["id"],
+                "query": test_case["input"]["query"],
+                "success": False,
+                "error": str(e)
+            })
+    
+    # Save test results
+    results_dir = os.path.join(GOLDEN_DATASET_DIR, "results")
+    os.makedirs(results_dir, exist_ok=True)
+    
+    timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
+    output_file = os.path.join(results_dir, f"test_results_{timestamp}.json")
+    
+    with open(output_file, "w") as f:
+        json.dump(test_results, f, indent=2)
+    
+    # Print summary
+    total_tests = len(test_results["results"])
+    passed_tests = sum(1 for r in test_results["results"] if r.get("success", False))
+    
+    print("\n" + "="*50)
+    print("Test Summary:")
+    print(f"Total Tests: {total_tests}")
+    print(f"Passed: {passed_tests}")
+    print(f"Failed: {total_tests - passed_tests}")
+    print(f"Success Rate: {(passed_tests/total_tests)*100:.2f}%")
+    print("="*50)
+    print(f"\nDetailed results saved to: {output_file}")
+
+if __name__ == "__main__":
+    print("\n" + "="*50)
+    print("🧪 Running Golden Dataset Tests")
+    print("="*50)
+    
+    try:
+        asyncio.run(run_golden_tests())
+    except Exception as e:
+        print(f"\n❌ Critical error: {str(e)}")
+        raise 

server/test_data/golden_dataset.json

@@ -0,0 +1,183 @@
+{
+  "metadata": {
+    "created_at": "2025-02-23T19:40:05.819936",
+    "version": "1.0",
+    "description": "Golden dataset for testing the podcast debate system"
+  },
+  "test_cases": [
+    {
+      "id": "6e557a71-7ccf-497c-8b41-b47087dae3ce",
+      "input": {
+        "query": "Are electric vehicles better for the environment?",
+        "agent_type": "believer",
+        "context": null
+      },
+      "expected_output": {
+        "debate_structure": {
+          "min_turns": 2,
+          "max_turns": 4,
+          "required_agents": [
+            "extractor",
+            "believer",
+            "skeptic",
+            "supervisor"
+          ]
+        },
+        "transcript_requirements": {
+          "required_fields": [
+            "id",
+            "podcastScript",
+            "topic"
+          ],
+          "topic_match": true,
+          "min_script_length": 500
+        },
+        "podcast_requirements": {
+          "required_fields": [
+            "content",
+            "audio_file",
+            "title",
+            "description",
+            "category"
+          ],
+          "audio_format": "mp3",
+          "min_file_size": 1000
+        }
+      }
+    },
+    {
+      "id": "9c95f4df-fb84-4bc1-b80c-094998e58811",
+      "input": {
+        "query": "Should artificial intelligence be regulated?",
+        "agent_type": "skeptic",
+        "context": {
+          "believer_chunks": [
+            "AI can enhance productivity and innovation",
+            "AI systems can help solve complex problems"
+          ],
+          "skeptic_chunks": [
+            "AI poses risks to privacy and security",
+            "Unregulated AI could lead to job displacement"
+          ]
+        }
+      },
+      "expected_output": {
+        "debate_structure": {
+          "min_turns": 2,
+          "max_turns": 4,
+          "required_agents": [
+            "extractor",
+            "believer",
+            "skeptic",
+            "supervisor"
+          ]
+        },
+        "transcript_requirements": {
+          "required_fields": [
+            "id",
+            "podcastScript",
+            "topic"
+          ],
+          "topic_match": true,
+          "min_script_length": 500
+        },
+        "podcast_requirements": {
+          "required_fields": [
+            "content",
+            "audio_file",
+            "title",
+            "description",
+            "category"
+          ],
+          "audio_format": "mp3",
+          "min_file_size": 1000
+        }
+      }
+    },
+    {
+      "id": "a0233d38-9f22-4b6e-9c77-621dc7a2b637",
+      "input": {
+        "query": "What are the benefits and drawbacks of remote work?",
+        "agent_type": "believer",
+        "context": null
+      },
+      "expected_output": {
+        "debate_structure": {
+          "min_turns": 2,
+          "max_turns": 4,
+          "required_agents": [
+            "extractor",
+            "believer",
+            "skeptic",
+            "supervisor"
+          ]
+        },
+        "transcript_requirements": {
+          "required_fields": [
+            "id",
+            "podcastScript",
+            "topic"
+          ],
+          "topic_match": true,
+          "min_script_length": 500
+        },
+        "podcast_requirements": {
+          "required_fields": [
+            "content",
+            "audio_file",
+            "title",
+            "description",
+            "category"
+          ],
+          "audio_format": "mp3",
+          "min_file_size": 1000
+        }
+      }
+    }
+  ],
+  "sample_transcripts": [
+    {
+      "id": "4fb8bc46-dc2a-4e21-abfe-9cb3e1ca77ff",
+      "podcastScript": "**Podcast Script: Electric Vehicles and the Environment**\n\nHost: Welcome to our debate on the environmental impact of electric vehicles...\n\nSkeptic: While EVs reduce direct emissions, we must consider the environmental cost of battery production...\n\nBeliever: The long-term benefits of EVs in reducing carbon emissions far outweigh the initial production impact...",
+      "topic": "Are electric vehicles better for the environment?"
+    },
+    {
+      "id": "557a2b5c-8f59-46cc-930c-7d69818260d1",
+      "podcastScript": "**Podcast Script: AI Regulation Debate**\n\nHost: Today we're exploring the complex topic of AI regulation...\n\nSkeptic: Without proper oversight, AI development could lead to serious societal risks...\n\nBeliever: Smart regulation can help us harness AI's benefits while minimizing potential harm...",
+      "topic": "Should artificial intelligence be regulated?"
+    }
+  ],
+  "validation_rules": {
+    "debate": {
+      "required_agents": [
+        "extractor",
+        "believer",
+        "skeptic",
+        "supervisor"
+      ],
+      "min_debate_turns": 2,
+      "max_debate_turns": 4
+    },
+    "transcript": {
+      "required_fields": [
+        "id",
+        "podcastScript",
+        "topic"
+      ],
+      "min_script_length": 500
+    },
+    "podcast": {
+      "required_fields": [
+        "content",
+        "audio_file",
+        "title",
+        "description",
+        "category"
+      ],
+      "supported_audio_formats": [
+        "mp3"
+      ],
+      "min_file_size": 1000
+    }
+  }
+}

start.sh

@@ -0,0 +1,7 @@
+#!/bin/bash
+
+# Start nginx in background
+nginx
+
+# Start FastAPI application
+uvicorn main:app --host 0.0.0.0 --port 7860