This meeting thoroughly documented the step-by-step development of the Meet AI app, including setting up authentication, database integration, front-end UI, meetings and agents modules, video call features, OpenAI-powered agent integration, and background job processing.
Key decisions were made regarding technology stack (Next.js 15 / React 19 / tRPC / Drizzle ORM / Stream Video, among others) and best practices for security, workflow organization, and modularization.
Extensive implementation and configuration details for both front-end and back-end workflows were discussed, with frequent use of Git branches and automated PR reviews.
The discussion included robust error handling, responsive UI, database schema design, and integration of third-party services (OpenAI, Stream, Enro, Ingest).
Action Items
Ongoing – All Project Leads: Continue building and iterating using the described Git workflow and technology stack.
When adding new features – Developers: Follow the outlined workflow for schema changes, protected procedures, UI modules, and background jobs.
On branch merges – All Contributors: Always review and address actionable feedback from Code Rabbit AI reviews.
On integration of new third-party services – Engineers: Carefully follow official documentation and specify version numbers to ensure compatibility.
Before deploying to production – DevOps: Replace all placeholder secrets and keys, confirm environment variable configuration, and consider external storage for recordings.
Project Setup and Global Workflow
Outlined the full-stack engineering workflow for Meet AI, including system requirement checks, Next.js/React project setup, and use of a consistent package versioning strategy for reproducibility.
Emphasized using GitHub for version control, with atomic commits and feature branching for each significant change or chapter.
Highlighted the use of automated AI code review (Code Rabbit) to surface bugs, refactor suggestions, and ensure best practices.
Database, ORM, and Authentication Integration
Detailed creation of Postgres databases using Neon and database schema setup with Drizzle ORM.
Implemented environment variable management to secure sensitive data.
Integrated Better Auth for secure, extensible user authentication supporting email/password and social providers (Google/GitHub).
Auth flows were thoroughly tested, including login, registration, error handling, and protected API procedures.
UI Foundation and Reusability
Configured Tailwind CSS and Shadcn UI for styling, including custom themes and component overrides.
Built reusable UI modules (sidebar, navbar, command palette, responsive dialogs, loading/error/empty states) to standardize look/feel.
Demonstrated responsive/mobile-first design in all major interface elements.
Agents and Meetings Modules
Implemented extensible modules for Agents and Meetings, with clear separation of server and client logic, types, and schemas.
Developed reusable data table, filters (search, status, agent), and pagination components for CRUD operations and list navigation.
Used tRPC and React Query for efficient, type-safe communication and cache management, leveraging suspense and server-side data prefetching.
Video Call and AI Agent Integration
Integrated Stream Video SDK for real-time video call functionality, including secure server-side token generation and user management.
Leveraged OpenAI API and custom agent instructions to power real-time AI assistant agents (“math tutor” example), connecting agents as participants in the call.
Configured webhooks and background job processing (with Enro and Ingest) to handle real-time events, state changes (active, completed, processing), and automated post-call tasks (transcription, summarization).
Error Handling, Background Jobs, and Finalization
Implemented comprehensive error boundaries, client/server-side redirects for unauthorized access, and robust feedback (Sonner toasts, loading, error states).
Structured background job definitions and triggers for handling post-call transcription/recording cleanup, speaker attribution, and AI-driven meeting summaries.
Finalized completed state UI with markdown rendering of AI-generated summaries, recording playback, and tabbed interface for summary, transcript, recording, and Ask AI features.
Decisions
Commit to modular, type-safe, and version-controlled workflow — Ensures maintainability and upgradeability as the project grows.
Use AI-powered code review (Code Rabbit) at each PR — Catches bugs, enforces conventions, and streamlines peer review, justifying its inclusion.
Strict separation of client/server modules and careful environment variable handling — Rationale: Improved security, team scalability, and easier troubleshooting.
Adopt third-party SaaS dependencies (Stream Video, OpenAI, Enro/Ingest, etc.) with explicit version pinning — Ensures stability and reduces future integration risk.
Open Questions / Follow-Ups
Review and address any open Code Rabbit AI recommendations, especially regarding stricter error handling, security, and refactoring as the codebase evolves.
Decide on production storage solution for call recordings and transcripts (integrate with Amazon S3, Google Cloud, or Azure if retention policy requirements change).
Monitor compatibility updates for React Query, tRPC, and all third-party SDKs to address reported edge-case or beta-version issues on future upgrades.
Plan for feature enhancements (e.g., premium features, more granular agent capabilities, or analytics) as user feedback and requirements emerge.