Skip to content

Feature chat#5

Open
rooney011 wants to merge 9 commits intodevsForFun:mainfrom
rooney011:feature-chat
Open

Feature chat#5
rooney011 wants to merge 9 commits intodevsForFun:mainfrom
rooney011:feature-chat

Conversation

@rooney011
Copy link
Copy Markdown
Contributor

I created a new clean branch because the previous one became messy. This PR includes the updated chat UI, including changes to the sidebar components, chat layout, and route files.

@CharanMN7
Copy link
Copy Markdown
Contributor

So, @rooney011 here's the info:

I think you're stuck with the Vercel AI Gateway thing.

You can skip it by using the API keys obtained directly from the actual providers (Gemini, ChatGPT, Claude, etc.).

We're aiming for multiple models support in this chatbot anyway, so, incorporate all those models. But, for testing, stick to Gemini, use the Gemini API Key and the smallest gemini model (mayb 2.5 flash or flash lite if that's still available) for basic testing, and use the pro model only when you want to test longer wait times, visualize more complicated outputs from the model, etc.

Here's a perplexity doc I made for you to understand a little bit about AI SDK, and why we need to care about it:

https://www.perplexity.ai/search/tell-me-what-is-it-about-ai-sd-p3vvzaSoQgahCd7Un85XVA#0

Let me know if you have any doubts. Sorry for keeping you waiting too long.

@CharanMN7 CharanMN7 added documentation Improvements or additions to documentation enhancement New feature or request labels Nov 29, 2025
@rooney011
Copy link
Copy Markdown
Contributor Author

No issues at all. I’ll ask if anything comes up.

@rooney011
Copy link
Copy Markdown
Contributor Author

Fixed that gateway issue now the chat is working fine.I will update the sidebar next and what else do need to do.
chatbot

@rooney011
Copy link
Copy Markdown
Contributor Author

  1. Conversation & Session Management
    • Added /api/conversations API:
    o GET: Fetch all chat sessions for the authenticated user.
    o POST: Create a new chat session and return sessionId.
    o DELETE: Delete a session (ownership enforced).
    • Enforced strict user isolation using supabase.auth.getUser() for all queries.
    • chat_messages.session_id is a foreign key to chat_sessions.id with ON DELETE CASCADE.
  2. Reliable Chat Streaming & Persistence
    • Refactored /api/chat route:
    o Accepts sessionId in the request body.
    o Saves user messages before streaming.
    o Streams AI responses using streamText.
    o Saves assistant responses after streaming via onFinish.
    • Uses waitUntil to ensure database writes complete even if the client disconnects.
    • Supports saving partial responses if generation is interrupted.
  3. Context Hydration & Token Control
    • Chat pages fetch full message history from the database on load.
    • Messages are passed into useChat({ initialMessages }) to restore context.
    • Implemented sliding window context for LLM calls:
    o Always include system prompt.
    o Only send the last N messages to prevent token/cost overflows.
    o UI still displays the full conversation history.
  4. Session Persistence & Navigation
    • When a new chat starts without a sessionId:
    o Backend creates a session and returns the new sessionId immediately.
    o Frontend updates the URL to /chat/[sessionId] using router.replace / history.replaceState (no reload).
    • Sidebar navigation is URL-driven and highlights the active session correctly.
  5. Client-Side Improvements
    • Chat sidebar:
    o Fetches conversations from /api/conversations.
    o Supports navigation, deletion, and starting a new chat.
    • Chat page:
    o Dynamically loads messages based on sessionId.
    o Ensures all outgoing messages are correctly associated with the active session.
    Also fixed the route groups
chatbot_new

@CharanMN7
Copy link
Copy Markdown
Contributor

graph TB
    subgraph "Frontend Routing"
        A["/chat<br/>(New Chat State)"] -->|User sends first message| B[useChat Hook]
        C["/chat/[sessionId]<br/>(Active Chat State)"] -->|Load existing| D[Fetch DB Messages]
        D -->|Hydrate| B
        B -->|Session created| E[window.history.replaceState]
        E -->|Update URL| C
    end

    subgraph "UI Components"
        F[ChatHistorySidebar] -->|Display| G[Conversation List]
        F -->|Actions| H[New Chat Button]
        F -->|Actions| I[Delete Session]
        G -->|Click| C
    end

    subgraph "API Layer (/api/chat)"
        J["POST Request<br/>messages, sessionId"] -->|1. Validate Auth| K[supabase.auth.getUser]
        K -->|2. Save User Message| L[Insert to chat_messages]
        L -->|3. Start Streaming| M[streamText - Gemini Flash 001]
        M -->|4. Stream to Client| N[Real-time Response]
        M -->|5. onFinish Callback| O[Save AI Response]
        O -->|6. waitUntil| P[Ensure DB Write Completes]
    end

    subgraph "Database Schema (Supabase)"
        Q[(chat_sessions<br/>---<br/>id: uuid PK<br/>user_id: uuid FK<br/>title: text<br/>created_at: timestamptz)]
        R[(chat_messages<br/>---<br/>id: uuid PK<br/>session_id: uuid FK<br/>role: text<br/>content: text<br/>created_at: timestamptz)]
        
        Q -->|ON DELETE CASCADE| R
        Q -.->|RLS Policy| S[auth.users]
    end

    subgraph "Context Management"
        T["Full Message History<br/>Display Only"] -->|Frontend| U[Chat UI Shows All]
        V["Sliding Window<br/>Last 15-20 messages"] -->|Backend| M
        T -.->|Subset| V
    end

    subgraph "Security Layer"
        W[Row Level Security] -->|Enforce| Q
        W -->|Enforce| R
        K -->|Validates| S
    end

    B -->|API Call| J
    L -->|Write| R
    O -->|Write| R
    D -->|Read| R
    I -->|DELETE| Q

    classDef frontend fill:#e1f5ff,stroke:#01579b,stroke-width:2px
    classDef backend fill:#fff3e0,stroke:#e65100,stroke-width:2px
    classDef database fill:#f3e5f5,stroke:#4a148c,stroke-width:2px
    classDef security fill:#ffebee,stroke:#b71c1c,stroke-width:2px

    class A,B,C,D,E,F,G,H,I,U frontend
    class J,K,L,M,N,O,P,V backend
    class Q,R,T database
    class S,W security

    style M fill:#fff9c4,stroke:#f57f17,stroke-width:3px
    style P fill:#c8e6c9,stroke:#2e7d32,stroke-width:3px

Loading

@rooney011
Copy link
Copy Markdown
Contributor Author

  1. Dependencies Added
    mammoth: For extracting text from .docx files.
    pdf-parse: For extracting text from PDF files.
    react-dropzone: For file upload interactions.
  2. Database Changes
    Migration: Created supabase/migrations/20251217_add_rag_columns.sql which:
    Adds content column to chat_embeddings.
    Adds file_path to chat_sources.
    Creates the match_documents RPC function for vector search.
  3. Backend API
    New Route: app/api/process-document/route.ts
    Handles file upload and text extraction (PDF, DOCX, TXT, and Image via Gemini Vision). -Chunks text and generates embeddings (Google/OpenAI).
    Stores chunks in Supabase.
    Modified Route: app/api/chat/route.ts
    Added logic to generate embeddings for user queries.
    Performs vector search (match_documents) to retrieve relevant context.
    Injects retrieved context into the system prompt for RAG.
  4. Frontend
    Main Chat (page.tsx):
    Integrated file handling in handleSubmit.
    Automatically uploads and processes files against the new RAG API.
    Filters images for LLM vision vs. other docs for RAG.
    New Component: components/chat/file-uploader.tsx
    A standalone drag-and-drop uploader component (Note: This appears to be a separate component from the one currently used in the main chat interface).
  5. Documentation(Readme updated).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Improvements or additions to documentation enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants