SDLC-CoPilot)— Project Story

Inspiration

We built LaunchPlan AI because we've all lived through it: the Monday standup where nobody knows what to build, the PM frantically updating a spreadsheet that nobody reads, the developer who's been blocked for three days but nobody noticed. Software projects fail not because teams lack talent, but because the gap between planning and execution is a chasm that tools like Jira, Notion, and Google Docs never bridge.

The spark came from watching a startup team spend six weeks — and $40,000 — defining an MVP that could have been scoped in an afternoon. The founder had a brilliant vision. The engineering team had the skills. But between them stood an ocean of miscommunication, rework, and missed deadlines.

We asked: What if AI could generate the roadmap, assign the tasks, and keep everyone aligned — all in one place?

What it does

LaunchPlan AI is an end-to-end software development lifecycle platform powered by large language models. It transforms a raw product idea into a fully executable project plan, then tracks that plan through to delivery.

Core Capabilities

  1. AI-Powered Plan Generation — Enter a product description (e.g., "a SaaS project management tool for remote teams") and receive a phased development plan with:

    • Technical architecture recommendations
    • Phase-wise task breakdown with estimated effort
    • Risk analysis and mitigation strategies
    • Resource requirements and cost estimates
  2. Team Execution Platform — Invite team members via secure token-based invites, track real-time presence and activity, and manage role-based access:

    • Product Manager / Project Manager — full control over plan creation, team management, and project oversight
    • Team Members — focused task views with AI-driven task assignments based on skills and workload
  3. Smart Task Assignment — AI recommends task assignments using confidence scores derived from:

    • Team member skills and historical performance
    • Current workload distribution
    • Task complexity and estimated effort
    • Team member availability
  4. Real-Time Presence & Notifications — See who's online, what they're working on, and receive instant notifications for task assignments, updates, and blockers — all delivered through a unified notification center.

  5. Interactive Documentation — Built-in guides, judge demo flows, and comprehensive documentation for onboarding and reference.

How we built it

Architecture

LaunchPlan AI follows a modern full-stack architecture:

Frontend (React + TypeScript + Vite)
├── shadcn/ui component system
├── Tailwind CSS for styling
├── Lucide icons
├── React Router for SPA navigation
└── Supabase client for data & auth

Backend-as-a-Service (Supabase)
├── PostgreSQL database with 31 tables
├── Row-Level Security (RLS) policies
├── Realtime subscriptions for live updates
├── Edge Functions (Deno) for serverless logic
└── Supabase Auth with username/email/invite flows

Database Schema Design

Our PostgreSQL schema models the complete SDLC domain:

$$\text{Schema} = { \text{profiles}, \text{projects}, \text{tasks}, \text{team_members}, \text{team_invites}, \text{user_presence}, \text{activity_logs}, \text{notifications}, \dots }$$

With 31 tables covering everything from user profiles to notification preferences, we implemented granular RLS policies ensuring data isolation — a team member can only see their own tasks, while a PM has full project visibility.

AI Integration

We integrated Gemini 2.5 Flash for content generation and analysis. The prompt engineering pipeline:

$$\text{User Input} \xrightarrow{\text{context enrichment}} \text{Structured Prompt} \xrightarrow{\text{LLM}} \text{JSON Response} \xrightarrow{\text{validation}} \text{Database Write}$$

Edge Functions

We deployed 11 serverless edge functions to handle sensitive operations:

  • create-team-invite — generates secure tokens, temporary passwords, and creates auth users
  • accept-team-invite — validates tokens, sets permanent passwords, logs acceptance
  • update-presence — heartbeat-based status updates with device info
  • log-activity — enriched activity logging for the timeline view
  • Plus 7 additional functions for plan generation, task management, and notification dispatch

Frontend Engineering

The React application consists of 31 pages, each a focused module:

$$\text{Pages} = 23_{\text{core}} + 5_{\text{new}} + 3_{\text{team execution}} = 31$$

Key frontend patterns:

  • Atomic design — components at atom/molecule/organism levels
  • Custom hooks — useAuth, usePresence, useNotifications for shared logic
  • Optimistic updates — UI updates before server confirmation for perceived performance
  • Error boundaries — graceful degradation when AI or network calls fail

Challenges we ran into

1. The Realtime Subscription Hell

Supabase Realtime channels are powerful but unforgiving. Our initial implementation:

$$\text{channel} = \text{supabase.channel}(\text{name}).\text{on}(\dots).\text{subscribe}()$$

Worked in production but crashed in development under React 18 Strict Mode, which double-invokes effects. Date.now() returned identical values within the same millisecond, causing Supabase to return an already-subscribed channel. Calling .on() on it threw:

"cannot add postgres_changes callbacks after subscribe()"

Solution: We switched to crypto.randomUUID() for guaranteed-unique channel names and added a channelRef guard that synchronously removes existing channels before creating new ones.

2. Context Collapse on Hot Module Reload

During development, useAuth would throw:

"useAuth must be used within an AuthProvider"

The root cause: createContext(undefined) returns undefined when the module is replaced during HMR, because the old AuthProvider in the tree holds the old context reference while useAuth() calls useContext with the new context object.

Solution: We provided a safe default context value with loading: true instead of undefined. During HMR transitions, components gracefully render loading states instead of crashing.

3. Dual Notification Channels

Our notification system needed to support both:

  • PM notifications (via recipient_user_id)
  • Team member notifications (via team_member_id)

But RLS policies were initially written for only one channel, causing team members to see empty notification lists.

Solution: We created a unified can_read_notification() SQL function and rewrote RLS policies to check both fields:

$$\text{can_read} = (\text{recipient_user_id} = \text{auth.uid}()) \lor (\text{team_member_user_id} = \text{auth.uid}())$$

4. Invite Token Lifecycle Management

Designing a secure, time-limited invite system required careful state modeling:

$$\text{Invite State Machine} = \text{Pending} \rightarrow \text{Sent} \rightarrow \text{Password Set} \rightarrow \text{Active}$$

Edge cases like token expiry (7 days), resending, and revocation had to be handled with atomic database operations via edge functions.

5. Mobile Responsiveness at Scale

With 31 pages, ensuring every view worked on mobile was a marathon, not a sprint. Tables became scrollable cards, sidebars became bottom nav bars, and complex forms were broken into steppers.

Accomplishments that we're proud of

  1. Zero-to-Plan in 5 Minutes — From a blank page to a complete, AI-generated development plan with resource estimates and risk analysis.

  2. Full Team Execution Loop — The only tool we know that generates the plan AND runs the team through it, from invite to task completion.

  3. 31 Pages, Zero Lint Errors — At v53, our codebase passes both ESLint and TypeScript strict checks with zero errors.

  4. Real-Time Presence Tracking — Heartbeat-based online/away/offline status with automatic cleanup, giving PMs true visibility into team activity.

  5. Dual-Channel Notification System — Unified notifications for both PMs and team members with real-time delivery via Supabase Realtime.

  6. Token-Based Security — Secure 7-day expiring invite tokens with temporary passwords, all managed server-side through Supabase Edge Functions.

What we learned

1. RLS is Non-Negotiable

Row-Level Security in PostgreSQL is not just a security feature — it's a data architecture feature. Designing tables with RLS in mind from day one prevents entire classes of bugs.

2. Effect Cleanup is Production Code

In development, useEffect cleanup functions are often treated as optional. But with Supabase Realtime, Firebase, or WebSockets, a missing cleanup is a memory leak that becomes a crash.

3. UUIDs Beat Timestamps for Uniqueness

Date.now() feels unique until React Strict Mode proves otherwise. crypto.randomUUID() is the correct default for any identifier that needs uniqueness guarantees.

4. Context Defaults Prevent Cascading Crashes

Providing a safe default to createContext rather than undefined turns a fatal error into a loading state. The user sees a spinner, not a white screen.

5. Edge Functions are the Right Abstraction

For operations that need both database access and external validation (like invite acceptance), edge functions are cleaner than client-side logic. They run close to the data and can enforce business rules atomically.

What's next for LaunchPlan AI

  1. AI-Powered Sprint Planning — Automatically generate sprint backlogs from the development plan based on team velocity and capacity.

  2. Integration Ecosystem — Connect with GitHub, GitLab, Slack, and Jira to sync tasks and push updates to existing workflows.

  3. Predictive Analytics — Use historical project data to predict delay probability and suggest course corrections:

$$P(\text{delay}) = f(\text{complexity}, \text{team_availability}, \text{historical_velocity})$$

  1. Mobile App — A React Native companion for on-the-go task management and notification triage.

  2. Multi-Project Portfolio View — For PMs managing multiple projects, a unified dashboard showing health metrics across all initiatives.

  3. Voice-to-Plan — Speak your product idea and receive a fully structured plan — no typing required.


Built with React, TypeScript, Supabase, Tailwind CSS, shadcn/ui, and a lot of coffee.

Built With

  • biome
  • canvas
  • deno
  • framer-motion
  • gemini-2.5-flash
  • groq
  • javascript
  • lucide-icons
  • mermaid
  • postgresql
  • radix-ui
  • react
  • react-beautiful-dnd
  • react-hook-form
  • react-router
  • recharts
  • rest-apis
  • shadcn/ui
  • sql
  • supabase
  • supabase-edge-functions
  • supabase-realtime
  • tailwind-css
  • typescript
  • vite
  • webhooks
  • zod
Share this project:

Updates

Submission history