feat: updated docs and fixed docker runtime vars injection

- Modified Dockerfile to use placeholder values for frontend environment variables, allowing for runtime substitution.
- Enhanced entrypoint script to apply runtime environment variable configuration, replacing placeholders in JavaScript files with actual values.
- Updated documentation paths in MDX files for Google OAuth images and added detailed setup guides for Discord, Linear, Notion, and Slack OAuth integrations.

Dockerfile.allinone

@@ -37,14 +37,11 @@ COPY surfsense_web/ ./
 # Run fumadocs-mdx postinstall now that source files are available
 RUN pnpm fumadocs-mdx
 
-# Build args for frontend
-ARG NEXT_PUBLIC_FASTAPI_BACKEND_URL=http://localhost:8000
-ARG NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE=LOCAL
-ARG NEXT_PUBLIC_ETL_SERVICE=DOCLING
-
-ENV NEXT_PUBLIC_FASTAPI_BACKEND_URL=$NEXT_PUBLIC_FASTAPI_BACKEND_URL
-ENV NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE=$NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE
-ENV NEXT_PUBLIC_ETL_SERVICE=$NEXT_PUBLIC_ETL_SERVICE
+# Build with placeholder values that will be replaced at runtime
+# These unique strings allow runtime substitution via entrypoint script
+ENV NEXT_PUBLIC_FASTAPI_BACKEND_URL=__NEXT_PUBLIC_FASTAPI_BACKEND_URL__
+ENV NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE=__NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE__
+ENV NEXT_PUBLIC_ETL_SERVICE=__NEXT_PUBLIC_ETL_SERVICE__
 
 # Build
 RUN pnpm run build
@@ -233,6 +230,12 @@ ENV AUTH_TYPE=LOCAL
 ENV ETL_SERVICE=DOCLING
 ENV EMBEDDING_MODEL=sentence-transformers/all-MiniLM-L6-v2
 
+# Frontend configuration (can be overridden at runtime)
+# These are injected into the Next.js build at container startup
+ENV NEXT_PUBLIC_FASTAPI_BACKEND_URL=http://localhost:8000
+ENV NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE=LOCAL
+ENV NEXT_PUBLIC_ETL_SERVICE=DOCLING
+
 # Data volume
 VOLUME ["/data"]
 

scripts/docker/entrypoint-allinone.sh

@@ -96,6 +96,30 @@ if [ -d /app/frontend/.next/standalone ]; then
     cp -r /app/frontend/.next/static /app/frontend/.next/static 2>/dev/null || true
 fi
 
+# ================================================
+# Runtime Environment Variable Replacement
+# ================================================
+# Next.js NEXT_PUBLIC_* vars are baked in at build time.
+# This replaces placeholder values with actual runtime env vars.
+echo "🔧 Applying runtime environment configuration..."
+
+# Set defaults if not provided
+NEXT_PUBLIC_FASTAPI_BACKEND_URL="${NEXT_PUBLIC_FASTAPI_BACKEND_URL:-http://localhost:8000}"
+NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE="${NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE:-LOCAL}"
+NEXT_PUBLIC_ETL_SERVICE="${NEXT_PUBLIC_ETL_SERVICE:-DOCLING}"
+
+# Replace placeholders in all JS files
+find /app/frontend -type f \( -name "*.js" -o -name "*.json" \) -exec sed -i \
+    -e "s|__NEXT_PUBLIC_FASTAPI_BACKEND_URL__|${NEXT_PUBLIC_FASTAPI_BACKEND_URL}|g" \
+    -e "s|__NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE__|${NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE}|g" \
+    -e "s|__NEXT_PUBLIC_ETL_SERVICE__|${NEXT_PUBLIC_ETL_SERVICE}|g" \
+    {} +
+
+echo "✅ Environment configuration applied"
+echo "   Backend URL:  ${NEXT_PUBLIC_FASTAPI_BACKEND_URL}"
+echo "   Auth Type:    ${NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE}"
+echo "   ETL Service:  ${NEXT_PUBLIC_ETL_SERVICE}"
+
 # ================================================
 # Run database migrations
 # ================================================
@@ -135,10 +159,10 @@ echo "==========================================="
 echo "  📋 Configuration"
 echo "==========================================="
 echo "  Frontend URL:    http://localhost:3000"
-echo "  Backend API:     http://localhost:8000"
-echo "  API Docs:        http://localhost:8000/docs"
-echo "  Auth Type:       ${AUTH_TYPE:-LOCAL}"
-echo "  ETL Service:     ${ETL_SERVICE:-DOCLING}"
+echo "  Backend API:     ${NEXT_PUBLIC_FASTAPI_BACKEND_URL}"
+echo "  API Docs:        ${NEXT_PUBLIC_FASTAPI_BACKEND_URL}/docs"
+echo "  Auth Type:       ${NEXT_PUBLIC_FASTAPI_BACKEND_AUTH_TYPE}"
+echo "  ETL Service:     ${NEXT_PUBLIC_ETL_SERVICE}"
 echo "  TTS Service:     ${TTS_SERVICE}"
 echo "  STT Service:     ${STT_SERVICE}"
 echo "==========================================="

surfsense_web/content/docs/connectors/discord.mdx

@@ -3,30 +3,74 @@ title: Discord
 description: Connect your Discord servers to SurfSense
 ---
 
-# Discord Connector
+# Discord OAuth Integration Setup Guide
 
-Index your Discord server conversations and content.
+This guide walks you through setting up a Discord OAuth integration for SurfSense.
 
-## Prerequisites
+## Step 1: Create a New Discord Application
 
-- A Discord account
-- Server admin permissions
+1. Navigate to [discord.com/developers/applications](https://discord.com/developers/applications)
+2. Click **"New Application"**
+3. Enter the application name: `SurfSense`
+4. Click **"Create"**
 
-## Setup
+## Step 2: Configure General Information
 
-1. Navigate to your Search Space settings
-2. Click on **Add Connector**
-3. Select **Discord** from the list
-4. Authorize SurfSense to access your Discord server
-5. Select the channels you want to index
+On the **General Information** page, fill in the details:
 
-## What Gets Indexed
+| Field | Value |
+|-------|-------|
+| **App Icon** | Upload an icon (1024x1024px, PNG/GIF/JPG/WEBP, max 10MB) |
+| **Name** | `SurfSense` |
+| **Description** | Connect any LLM to your internal knowledge sources and chat with it in real time alongside your team. |
+| **Tags** | Add up to 5 tags (optional) |
 
-- Text channel messages
-- Thread messages
-- Shared files and links
+You'll also see your **Application ID** and **Public Key** on this page.
 
-## Sync Frequency
+![General Information](/docs/connectors/discord/discord-general-info.png)
 
-The Discord connector supports scheduled syncing to keep your content up to date.
+## Step 3: Configure OAuth2 Settings
 
+1. In the left sidebar, click **"OAuth2"**
+2. Copy your **Client ID** and **Client Secret** (click to reveal)
+3. Under **Redirects**, click **"Add Another"** and enter:
+   ```
+   http://localhost:8000/api/v1/auth/discord/connector/callback
+   ```
+
+> ⚠️ Keep **Public Client** disabled (off) since SurfSense uses a server to make requests.
+
+![OAuth2 Configuration](/docs/connectors/discord/discord-oauth2.png)
+
+## Step 4: Configure Bot Settings
+
+1. In the left sidebar, click **"Bot"**
+2. Configure the **Authorization Flow**:
+   - ✅ **Public Bot** - Enable to allow anyone to add the bot to servers
+
+3. Enable **Privileged Gateway Intents**:
+   - ✅ **Server Members Intent** - Required to receive GUILD_MEMBERS events
+   - ✅ **Message Content Intent** - Required to receive message content
+
+> ⚠️ Once your bot reaches 100+ servers, these intents will require verification and approval.
+
+![Bot Settings](/docs/connectors/discord/discord-bot-settings.png)
+
+---
+
+## Running SurfSense with Discord Connector
+
+Add the Discord environment variables to your Docker run command:
+
+```bash
+docker run -d -p 3000:3000 -p 8000:8000 \
+  -v surfsense-data:/data \
+  # Discord Connector
+  -e DISCORD_CLIENT_ID=your_discord_client_id \
+  -e DISCORD_CLIENT_SECRET=your_discord_client_secret \
+  -e DISCORD_REDIRECT_URI=http://localhost:8000/api/v1/auth/discord/connector/callback \
+  -e DISCORD_BOT_TOKEN=http://localhost:8000/api/v1/auth/discord/connector/callback \
+  --name surfsense \
+  --restart unless-stopped \
+  ghcr.io/modsetter/surfsense:latest
+```

surfsense_web/content/docs/connectors/linear.mdx

@@ -3,31 +3,65 @@ title: Linear
 description: Connect your Linear workspace to SurfSense
 ---
 
-# Linear Connector
+# Linear OAuth Integration Setup Guide
 
-Sync your Linear issues, projects, and documentation to SurfSense.
+This guide walks you through setting up a Linear OAuth integration for SurfSense.
 
-## Prerequisites
+## Step 1: Access Linear API Settings
 
-- A Linear account
-- Access to the teams you want to connect
+1. Navigate to your workspace's API settings at `linear.app/<your-workspace>/settings/api`
+2. Under **OAuth Applications**, click **"+ New OAuth application"**
 
-## Setup
+![Linear API Settings Page](/docs/connectors/linear/linear-api-settings.png)
 
-1. Navigate to your Search Space settings
-2. Click on **Add Connector**
-3. Select **Linear** from the list
-4. Authorize SurfSense to access your Linear workspace
-5. Select the teams and projects you want to index
+## Step 2: Create New Application
 
-## What Gets Indexed
+Fill in the application details:
 
-- Issues and sub-issues
-- Issue descriptions and comments
-- Project documentation
-- Roadmap items
+| Field | Value |
+|-------|-------|
+| **Application icon** | Upload an icon (at least 256x256px) |
+| **Application name** | `SurfSense` |
+| **Developer name** | `SurfSense` |
+| **Developer URL** | `https://www.surfsense.com/` |
+| **Description** | Connect any LLM to your internal knowledge sources and chat with it in real time alongside your team. |
+| **Callback URLs** | `http://localhost:8000/api/v1/auth/linear/connector/callback` |
+| **GitHub username** | Your GitHub username (optional) |
 
-## Sync Frequency
+### Settings
 
-The Linear connector supports scheduled syncing to keep your content up to date.
+- ✅ **Public** - Enable this to allow the application to be installed by other workspaces
+
+Click **Create** to create the application.
+
+![Create New Application Form](/docs/connectors/linear/linear-new-application.png)
+
+## Step 3: Get OAuth Credentials
+
+After creating the application, you'll see your OAuth credentials:
+
+1. Copy your **Client ID**
+2. Copy your **Client Secret**
+
+> ⚠️ Never share your client secret publicly.
+
+![OAuth Credentials](/docs/connectors/linear/linear-oauth-credentials.png)
+
+---
+
+## Running SurfSense with Linear Connector
+
+Add the Linear environment variables to your Docker run command:
+
+```bash
+docker run -d -p 3000:3000 -p 8000:8000 \
+  -v surfsense-data:/data \
+  # Linear Connector
+  -e LINEAR_CLIENT_ID=your_linear_client_id \
+  -e LINEAR_CLIENT_SECRET=your_linear_client_secret \
+  -e LINEAR_REDIRECT_URI=http://localhost:8000/api/v1/auth/linear/connector/callback \
+  --name surfsense \
+  --restart unless-stopped \
+  ghcr.io/modsetter/surfsense:latest
+```
 

surfsense_web/content/docs/connectors/notion.mdx

@@ -3,31 +3,82 @@ title: Notion
 description: Connect your Notion workspaces to SurfSense
 ---
 
-# Notion Connector
+# Notion OAuth Integration Setup Guide
 
-Connect your Notion workspaces to index pages, databases, and content.
+This guide walks you through setting up a Notion OAuth integration for SurfSense.
 
-## Prerequisites
+## Step 1: Access Notion Integrations
 
-- A Notion account
-- Access to the workspaces you want to connect
+1. Navigate to [notion.so/profile/integrations](https://notion.so/profile/integrations)
+2. Click the **"New integration"** button
 
-## Setup
+![Notion Integrations Page](/docs/connectors/notion/notion-integrations-page.png)
 
-1. Navigate to your Search Space settings
-2. Click on **Add Connector**
-3. Select **Notion** from the list
-4. Authorize SurfSense to access your Notion workspace
-5. Select the pages and databases you want to index
+## Step 2: Configure New Integration
 
-## What Gets Indexed
+Fill in the integration details:
 
-- Pages and subpages
-- Database entries
-- Comments and discussions
-- Embedded content
+| Field | Value |
+|-------|-------|
+| **Integration Name** | `SurfSense` |
+| **Associated workspace** | Select your workspace |
+| **Type** | `Public` |
+| **Company name** | Your company name |
+| **Website** | Your website URL |
+| **Tagline** | Brief description |
+| **Privacy Policy URL** | Your privacy policy URL |
+| **Terms of Use URL** | Your terms of use URL |
+| **Email** | Your developer email |
+| **Logo** | Upload a 512x512 logo |
 
-## Sync Frequency
+### OAuth Redirect URI
 
-The Notion connector supports scheduled syncing to keep your content up to date.
+Under **OAuth domains & URIs**, set the **Redirect URI** to:
 
+```
+http://localhost:8000/api/v1/auth/notion/connector/callback
+```
+
+Click **Save** to create the integration.
+
+![New Integration Form](/docs/connectors/notion/notion-new-integration-form.png)
+
+## Step 3: Get OAuth Credentials & Configure Capabilities
+
+After creating the integration, you'll see the configuration page with your credentials:
+
+1. Copy your **OAuth Client ID**
+2. Copy your **OAuth Client Secret** (click Refresh if needed)
+
+### Set Required Capabilities
+
+Under **Content Capabilities**, enable:
+- ✅ Read content
+
+Under **Comment Capabilities**, enable:
+- ✅ Read comments
+
+Under **User Capabilities**, select:
+- 🔘 Read user information including email addresses
+
+Click **Save** to apply the capabilities.
+
+![Integration Configuration](/docs/connectors/notion/notion-integration-config.png)
+
+---
+
+## Running SurfSense with Notion Connector
+
+Add the Notion environment variables to your Docker run command:
+
+```bash
+docker run -d -p 3000:3000 -p 8000:8000 \
+  -v surfsense-data:/data \
+  # Notion Connector
+  -e NOTION_OAUTH_CLIENT_ID=your_notion_client_id \
+  -e NOTION_OAUTH_CLIENT_SECRET=your_notion_client_secret \
+  -e NOTION_REDIRECT_URI=http://localhost:8000/api/v1/auth/notion/connector/callback \
+  --name surfsense \
+  --restart unless-stopped \
+  ghcr.io/modsetter/surfsense:latest
+```

surfsense_web/content/docs/connectors/slack.mdx

@@ -3,31 +3,89 @@ title: Slack
 description: Connect your Slack workspace to SurfSense
 ---
 
-# Slack Connector
+# Slack OAuth Integration Setup Guide
 
-Index your Slack conversations and make them searchable.
+This guide walks you through setting up a Slack OAuth integration for SurfSense.
 
-## Prerequisites
+## Step 1: Create a New Slack App
 
-- A Slack workspace
-- Admin permissions to install apps
+1. Navigate to [api.slack.com/apps](https://api.slack.com/apps)
+2. Click **"Create New App"**
+3. Select **"From scratch"** to manually configure your app
 
-## Setup
+![Create an App Dialog](/docs/connectors/slack/slack-create-app.png)
 
-1. Navigate to your Search Space settings
-2. Click on **Add Connector**
-3. Select **Slack** from the list
-4. Authorize SurfSense to access your Slack workspace
-5. Select the channels you want to index
+## Step 2: Name App & Choose Workspace
 
-## What Gets Indexed
+1. Enter **App Name**: `SurfSense`
+2. Select the workspace to develop your app in
+3. Click **"Create App"**
 
-- Public channel messages
-- Private channels (if authorized)
-- Thread replies
-- Shared files and links
+> ⚠️ You won't be able to change the workspace later. The workspace will control the app even if you leave it.
 
-## Sync Frequency
+![Name App & Choose Workspace](/docs/connectors/slack/slack-name-workspace.png)
 
-The Slack connector supports scheduled syncing to keep your conversations indexed.
+## Step 3: Get App Credentials
 
+After creating the app, you'll be taken to the **Basic Information** page. Here you'll find your credentials:
+
+1. Copy your **Client ID**
+2. Copy your **Client Secret** (click Show to reveal)
+
+> ⚠️ Never share your app credentials publicly or include them in code repositories.
+
+![Basic Information - App Credentials](/docs/connectors/slack/slack-app-credentials.png)
+
+## Step 4: Configure Redirect URLs
+
+1. In the left sidebar, click **"OAuth & Permissions"**
+2. Scroll down to **Redirect URLs**
+3. Click **"Add New Redirect URL"**
+4. Enter: `https://localhost:8000/api/v1/auth/slack/connector/callback`
+5. Click **"Add"**, then **"Save URLs"**
+
+![Redirect URLs Configuration](/docs/connectors/slack/slack-redirect-urls.png)
+
+## Step 5: Configure Bot Token Scopes
+
+On the same **OAuth & Permissions** page, scroll to **Scopes** and add the following **Bot Token Scopes**:
+
+| OAuth Scope | Description |
+|-------------|-------------|
+| `channels:history` | View messages and other content in public channels |
+| `channels:read` | View basic information about public channels |
+| `groups:history` | View messages and other content in private channels |
+| `groups:read` | View basic information about private channels |
+| `im:history` | View messages and other content in direct messages |
+| `mpim:history` | View messages and other content in group direct messages |
+| `users:read` | View people in a workspace |
+
+Click **"Add an OAuth Scope"** to add each scope.
+
+![Bot Token Scopes](/docs/connectors/slack/slack-scopes.png)
+
+## Step 6: Enable Public Distribution
+
+1. In the left sidebar, click **"Manage Distribution"**
+2. Under **Share Your App with Other Workspaces**, ensure distribution is enabled
+3. You can use the **"Add to Slack"** button or **Sharable URL** to install the app
+
+![Manage Distribution](/docs/connectors/slack/slack-distribution.png)
+
+---
+
+## Running SurfSense with Slack Connector
+
+Add the Slack environment variables to your Docker run command:
+
+```bash
+docker run -d -p 3000:3000 -p 8000:8000 \
+  -v surfsense-data:/data \
+  # Slack Connector
+  -e SLACK_CLIENT_ID=your_slack_client_id \
+  -e SLACK_CLIENT_SECRET=your_slack_client_secret \
+  -e SLACK_REDIRECT_URI=https://localhost:8000/api/v1/auth/slack/connector/callback \
+  --name surfsense \
+  --restart unless-stopped \
+  ghcr.io/modsetter/surfsense:latest
+```

surfsense_web/content/docs/index.mdx

@@ -17,13 +17,13 @@ To set up Google OAuth:
    - **People API** (required for basic Google OAuth)
    - **Gmail API** (required if you want to use the Gmail connector)
    - **Google Calendar API** (required if you want to use the Google Calendar connector)
-![Google Developer Console People API](/docs/google_oauth_people_api.png)
+![Google Developer Console People API](/docs/connectors/google/google_oauth_people_api.png)
 3. Set up OAuth consent screen.
-![Google Developer Console OAuth consent screen](/docs/google_oauth_screen.png)
+![Google Developer Console OAuth consent screen](/docs/connectors/google/google_oauth_screen.png)
 4. Create OAuth client ID and secret.
-![Google Developer Console OAuth client ID](/docs/google_oauth_client.png)
+![Google Developer Console OAuth client ID](/docs/connectors/google/google_oauth_client.png)
 5. It should look like this.
-![Google Developer Console Config](/docs/google_oauth_config.png)
+![Google Developer Console Config](/docs/connectors/google/google_oauth_config.png)
 
 ---
 

surfsense_web/mdx-components.tsx

@@ -7,12 +7,17 @@ import {
 	AccordionTrigger,
 } from "@/components/ui/accordion";
 import { cn } from "@/lib/utils";
+import Image, { type ImageProps } from "next/image";
 
 export function getMDXComponents(components?: MDXComponents): MDXComponents {
 	return {
 		...defaultMdxComponents,
-		img: ({ className, ...props }: React.ComponentProps<"img">) => (
-			<img className={cn("rounded-md border", className)} {...props} />
+		img: ({ className, alt, ...props }: React.ComponentProps<"img">) => (
+			<Image
+				className={cn("rounded-md border", className)}
+				alt={alt ?? ""}
+				{...(props as ImageProps)}
+			/>
 		),
 		Video: ({ className, ...props }: React.ComponentProps<"video">) => (
 			<video className={cn("rounded-md border", className)} controls loop {...props} />