Supabase Auth with SSR + RAG + AI Web Search + Autonomous Document Search

Version 3.0.0

This project provides a complete authentication system with Supabase SSR, featuring an AI chat interface with autonomous document search and web search capabilities. The AI decides when to search your uploaded documents or the web based on the context of your questions.

Key Features in v3.0.0

• Autonomous Document Search: AI automatically decides when to search through your uploaded documents - no manual file selection needed
• Web Search Integration: Real-time web search using Tavily AI for up-to-date information
• Dashboard Route Groups: Clean separation between public pages and authenticated dashboard (/chat, /filer)
• Incremental Message Saving: Messages saved in real-time as AI responds
• Modern Navigation: shadcn NavigationMenu with dropdown menus

Project Showcase

Images

<div style="display: flex; justify-content: center; align-items: center; flex-wrap: wrap;"> <img src="public/images/image1.png" alt="Front Page 1" style="width: 45%; margin: 10px;"> <img src="public/images/image2.png" alt="Front Page 2" style="width: 45%; margin: 10px;"> <img src="public/images/image3.png" alt="Front Page 3" style="width: 45%; margin: 10px;"> <img src="public/images/image4.png" alt="Protected Page 1" style="width: 45%; margin: 10px;"> <img src="public/images/image6.png" alt="Sign In Page Password" style="width: 45%; margin: 10px;"> <img src="public/images/image7.png" alt="AI Chat Page" style="width: 45%; margin: 10px;"> <img src="public/images/image8.png" alt="RAG Chat" style="width: 45%; margin: 10px;"> <img src="public/images/image9.png" alt="RAG Chat" style="width: 45%; margin: 10px;"> </div>

Videos

You can find the videos located inside the public folder!

Table of Contents

• Features
• Getting Started
  • Prerequisites
  • Installation
  • Database Setup
  • Document Processing Setup
  • Storage Setup and RLS
  • Environment Variables
• Email Templates
  • Confirm Your Signup
  • Invite User Email
  • Magic Link Email
  • Confirm Email Change
  • Reset Password Email
• Code Structure and Philosophy
  • Code Organization Over Design Patterns
  • Intentional Code Duplication Examples
• License

Features

• Robust and easy authentication: Utilize Supabase's auth capabilities alongside SSR for security.
• Performance: Leverage server-side rendering for faster load times and improved user experience.
• Next.js Integration: Specifically designed for easy integration with Next.js 15 projects.

AI Chat Features

• Autonomous Document Search Tool: The AI automatically searches through your uploaded documents when relevant to your question. No need to manually select files - the tool fetches all user documents from the database and performs semantic search using Voyage AI embeddings.

• Website Search Tool: Real-time web search powered by Exa AI. The AI decides when to search the web for current information, returning sources with titles, URLs, and publication dates.

• Multi-Model Support: Switch between GPT-5, GPT-5 Mini, OpenAI O3, Claude 4.5 Sonnet, Gemini 2.5 Pro, and Gemini 2.5 Flash.

• Incremental Message Saving: Messages are saved to the database incrementally as each AI step completes, preserving the exact order of tools, reasoning, and text.

• Tool Output Display: Collapsible accordion UI showing search results with clickable links to documents and web sources.

Application Structure

The application uses Next.js route groups for clean separation:

app/
├── (dashboard)/          # Authenticated routes
│   ├── chat/            # AI chat interface
│   │   ├── [id]/        # Individual chat sessions
│   │   └── components/  # Chat UI components
│   └── filer/           # File management
├── (frontpage)/         # Public routes
│   └── components/      # Landing page components
└── api/
    └── chat/
        └── tools/       # AI tools (documentChat, websiteSearch)

Getting Started

Prerequisites

• A Supabase account

If you want to use the AI features the following keys are needed

• A LlamaCloud account LlamaCloud (for parsing pdf files into markdown)
• An OpenAI API key OpenAI API
• An Anthropic API key Anthropic
• A Voyage AI API key Voyage AI (for document embeddings with voyage-3-large model)
• An Exa API key Exa AI (for web search functionality)

Installation

1. Clone the Repository

   git clone https://github.com/ElectricCodeGuy/SupabaseAuthWithSSR.git
   

2. Navigate to the Project Directory

   cd SupabaseAuthWithSSR
   

3. Install Required Packages

   npm install
   

Database Setup

Before launching your application, you must configure the database schema within Supabase.

Quick Setup (Recommended)

Run the complete setup SQL file located at database/setup.sql in the Supabase SQL Editor. This file contains all tables, indexes, RLS policies, and functions needed for the application.

# The setup file is located at:
database/setup.sql

Manual Setup (Step by Step)

If you prefer to set up tables individually, follow these steps:

1. Create the Users Table

-- Create users table
create table users (
  id uuid references auth.users not null primary key,
  full_name text,
  email text
);

-- Enable Row Level Security (RLS)
alter table public.users enable row level security;

-- Create RLS policies for users table
create policy "Users can insert own data"
on public.users
for insert
to public
with check (id = auth.uid());

create policy "Users can update own data"
on public.users
for update
to public
using (id = auth.uid())
with check (id = auth.uid());

create policy "Users can view own data"
on public.users
for select
to public
using (id = auth.uid());

This SQL statement creates a users table with columns for storing user data such as id, full_name and email. The id column is a foreign key referencing the auth.users table. It also enables RLS for the users table allowing users to read, insert and update their own data

2. Create a Trigger Function

   create function public.handle_new_user()
   returns trigger as $$
   begin
    insert into public.users (id, full_name, email)
    values (
      new.id,
      new.raw_user_meta_data->>'full_name',
      new.email
    );
    return new;
   end;
   $$ language plpgsql security definer;
   

This SQL function is a trigger function that automatically inserts a new user entry into the public.users table when a new user signs up via Supabase Auth. It extracts the id, full_name and email from the auth.users table and inserts them into the corresponding columns in the public.users table.

3. Create a Trigger

   create trigger on_auth_user_created
     after insert on auth.users
     for each row execute procedure public.handle_new_user();
   

This SQL statement creates a trigger named on_auth_user_created that executes the public.handle_new_user() function after each new user is inserted into the auth.users table.

4. Sign Up for an Account

• Navigate to http://localhost:3000/signup in your web browser.
• Use the sign-up form to create an account. Ensure you use a valid email address that you have access to, as you'll need to verify it in the next step.

5. Verify Your Email

• After signing up, Supabase will send an email to the address you provided. Check your inbox for an email from Supabase or your application.
• Open the email and click on the verification link to confirm your email address. This step is crucial for activating your account and ensuring that you can log in and access the application's features.

6. Make the rest of the tables, RLS and RPC

  -- Chat Sessions Table
  create table
    public.chat_sessions (
      id uuid not null default extensions.uuid_generate_v4 (),
      user_id uuid not null,
      created_at timestamp with time zone not null default current_timestamp,
      updated_at timestamp with time zone not null default current_timestamp,
      chat_title null,
      constraint chat_sessions_pkey primary key (id),
      constraint chat_sessions_user_id_fkey foreign key (user_id) references users (id)
    ) tablespace pg_default;

  create index if not exists idx_chat_sessions_user_id on public.chat_sessions using btree (user_id) tablespace pg_default;

  create index if not exists chat_sessions_created_at_idx on public.chat_sessions using btree (created_at) tablespace pg_default;

  -- Message Parts Table (NEW - Replaces chat_messages for incremental saving)
  -- This table stores individual message parts (text, tools, reasoning, etc.)
  -- allowing for incremental saving and proper ordering of AI responses
  create table public.message_parts (
    id uuid NOT NULL DEFAULT gen_random_uuid(),
    chat_session_id uuid NOT NULL,
    message_id uuid NOT NULL,
    role text NOT NULL,
    type text NOT NULL,
    "order" integer NOT NULL DEFAULT 0,
    created_at timestamp with time zone NOT NULL DEFAULT CURRENT_TIMESTAMP,

    -- Text part fields
    text_text text NULL,
    text_state text NULL DEFAULT 'done',

    -- Reasoning part fields
    reasoning_text text NULL,
    reasoning_state text NULL DEFAULT 'done',