More experimentation

Author: D-K-P

claude-agent-github-wiki/.env.example

@@ -11,8 +11,10 @@ ANTHROPIC_API_KEY=your_anthropic_api_key
 # Get these from your Supabase project settings
 # https://app.supabase.com/project/_/settings/api
 SUPABASE_URL=your_supabase_project_url
-SUPABASE_PRIVATE_KEY=your_supabase_service_role_jwt  # Backend only - JWT token (starts with eyJ...) from "service_role" in API settings, NOT the database secret!
 
-# Public Supabase keys for frontend (safe to expose)
+# Public Supabase keys (safe to expose, used by both frontend and backend)
 NEXT_PUBLIC_SUPABASE_URL=your_supabase_project_url  # Same as SUPABASE_URL
-NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key  # Found under "anon public" in API settings
+NEXT_PUBLIC_SUPABASE_PUBLISHABLE_DEFAULT_KEY=your_supabase_publishable_key  # Publishable key for Realtime broadcasts (both client & server use this for listening)
+
+# Optional: Only needed if sending broadcasts FROM the backend (not used in this app)
+# SUPABASE_SECRET_KEY=your_secret_key  # Secret key - only for sending broadcasts from trusted server

claude-agent-github-wiki/README.md

@@ -60,7 +60,7 @@ ANTHROPIC_API_KEY=your_anthropic_api_key
 SUPABASE_URL=your_supabase_project_url
 SUPABASE_ANON_KEY=your_supabase_anon_key
 NEXT_PUBLIC_SUPABASE_URL=your_supabase_project_url
-NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
+NEXT_PUBLIC_SUPABASE_PUBLISHABLE_DEFAULT_KEY=your_supabase_anon_key
 ```
 
 ### Installation

claude-agent-github-wiki/app/chat/[runId]/page.tsx

@@ -100,32 +100,25 @@ export default function ChatPage({ params }: { params: { runId: string } }) {
 
     console.log("[Chat] Setting up Supabase channel for sessionId:", sessionId);
 
+    const channelName = `session:${sessionId}`;
+
     // Create channel for broadcasting questions
     // NOTE: Clean up console.logs after debugging
-    const channel = supabase.channel(`session:${sessionId}`, {
+    const channel = supabase.channel(channelName, {
       config: {
+        private: false, // Use private channel with RLS
         broadcast: {
           self: false,
-          ack: false, // Match backend configuration
+          ack: true,
         },
       },
     });
 
-    // Subscribe to channel (no need to listen, just for sending)
-    channel.subscribe((status) => {
-      console.log(`[Chat] Channel subscription status: ${status}`, {
-        sessionId,
-        channelName: `session:${sessionId}`,
-      });
-
-      if (status === "SUBSCRIBED") {
-        console.log("[Chat] ✅ Successfully subscribed to channel");
-        channelRef.current = channel;
-      } else if (status === "CHANNEL_ERROR") {
-        console.error("[Chat] ❌ Channel subscription error");
-        setError("Failed to connect to chat channel");
-      }
-    });
+    channel
+      .on("broadcast", { event: "question" }, (payload) => {
+        console.log(`[Chat] Channel received question: ${payload}`);
+      })
+      .subscribe();
 
     // Cleanup on unmount
     return () => {
@@ -171,15 +164,16 @@ export default function ChatPage({ params }: { params: { runId: string } }) {
 
       // Send question directly via Supabase broadcast
       // NOTE: Clean up console.logs after debugging
-      const result = await channelRef.current.send({
+      const result = await supabase.channel(`session:${sessionId}`).send({
         type: "broadcast",
         event: "question",
         payload: {
-          question,
+          question: question,
           timestamp: new Date().toISOString(),
           messageId: userMessage.id,
         },
       });
+      console.log("[Chat] result: ", result);
 
       if (result === "ok") {
         console.log("[Chat] ✅ Question broadcast successfully");

claude-agent-github-wiki/lib/supabase.ts

@@ -4,14 +4,17 @@ import { createClient } from "@supabase/supabase-js";
 // NOTE: Clean up console.logs after debugging
 export const supabase = createClient(
   process.env.NEXT_PUBLIC_SUPABASE_URL!,
-  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+  process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_DEFAULT_KEY!,
   {
     realtime: {
       params: {
         eventsPerSecond: 10,
       },
     },
-  }
+  },
 );
 
-console.log("[supabase.ts] Client initialized with URL:", process.env.NEXT_PUBLIC_SUPABASE_URL);
+console.log(
+  "[supabase.ts] Client initialized with URL:",
+  process.env.NEXT_PUBLIC_SUPABASE_URL,
+);

claude-agent-github-wiki/repo-wiki-chat.mdx

@@ -19,6 +19,7 @@ Developers can learn advanced Trigger.dev patterns (build extensions, long-runni
 ## Target Users
 
 Developers building production AI applications with Trigger.dev v4, especially those needing:
+
 - Long-running stateful tasks
 - Build extensions for system dependencies
 - Hybrid realtime architectures
@@ -31,12 +32,14 @@ Developers building production AI applications with Trigger.dev v4, especially t
 ### Two-Task System
 
 **Task 1: clone-repo**
+
 - Uses build extension to install git via apt-get
 - Performs shallow clone (depth=1)
 - Generates unique sessionId
 - Returns tempDir, sessionId, repoName
 
 **Task 2: repo-chat-session**
+
 - Long-running (60 minute timeout)
 - Maintains cloned repo in memory
 - Listens for questions via Supabase Broadcast (control plane)
@@ -51,6 +54,7 @@ Task 2 → Trigger.dev Streams v2 → Frontend (response)
 ```
 
 **Why this architecture?**
+
 - Repo stays in memory = no re-cloning
 - Supabase handles bidirectional communication
 - Trigger.dev Streams v2 handles main data flow
@@ -85,7 +89,9 @@ export const cloneRepo = schemaTask({
     const sessionId = generateSessionId();
 
     // Shallow clone with build extension git
-    await execAsync(`git clone --depth=1 --single-branch "${githubUrl}" "${tempDir}/repo"`);
+    await execAsync(
+      `git clone --depth=1 --single-branch "${githubUrl}" "${tempDir}/repo"`
+    );
 
     return { tempDir: join(tempDir, "repo"), sessionId, repoName };
   },
@@ -110,17 +116,19 @@ export const repoChatSession = schemaTask({
     // Supabase for receiving questions
     const channel = supabase.channel(`session:${sessionId}`);
 
-    channel.on('broadcast', { event: 'question' }, async ({ payload }) => {
-      const result = query({
-        prompt: payload.question,
-        options: { cwd: tempDir, /* Claude options */ }
-      });
+    channel
+      .on("broadcast", { event: "question" }, async ({ payload }) => {
+        const result = query({
+          prompt: payload.question,
+          options: { cwd: tempDir /* Claude options */ },
+        });
 
-      // Stream all responses via Trigger.dev
-      for await (const message of result) {
-        streamHandle.write(message);
-      }
-    }).subscribe();
+        // Stream all responses via Trigger.dev
+        for await (const message of result) {
+          streamHandle.write(message);
+        }
+      })
+      .subscribe();
 
     // Keep alive until abort
     await waitForAbort(signal);
@@ -158,9 +166,9 @@ const { parts } = useRealtimeStream(agentStream, chatRunId, { accessToken });
 // Send questions via Supabase
 const channel = supabase.channel(`session:${sessionId}`);
 channel.send({
-  type: 'broadcast',
-  event: 'question',
-  payload: { question, messageId }
+  type: "broadcast",
+  event: "question",
+  payload: { question, messageId },
 });
 ```
 
@@ -169,19 +177,22 @@ channel.send({
 ## Key Features Demonstrated
 
 ### Trigger.dev Features
+
 - **Build Extensions**: Install system dependencies (git) in containers
 - **Long-running Tasks**: 60-minute sessions with state persistence
 - **Realtime Streams v2**: Type-safe streaming with `streams.define<T>()`
 - **Task Composition**: Two-task pattern with data passing
 - **Abort Handling**: Graceful cleanup on cancellation
 
 ### Claude Agent SDK Features
+
 - **Extended Thinking**: 8192 tokens for complex reasoning
 - **Full Tool Suite**: Task, Bash, Glob, Grep, Read, Edit, Write
 - **Working Directory**: Operates within cloned repo
 - **Streaming Results**: AsyncIterable interface
 
 ### Architecture Patterns
+
 - **Control/Data Plane Separation**: Supabase for control, Trigger.dev for data
 - **No Re-cloning**: Repository persists in memory
 - **Session Management**: Unique IDs link tasks and channels
@@ -192,27 +203,32 @@ channel.send({
 ## Implementation Checklist
 
 - [x] **Phase 1: UI + Landing Page**
+
   - Landing page with GitHub URL input
   - Chat interface with message components
   - Tool cards with collapsible results
 
 - [x] **Phase 2: Trigger.dev Setup**
+
   - Initialize project with v4 SDK
   - Configure build extension for git
   - Define typed stream with SDKMessage
 
 - [x] **Phase 3: Two-Task Implementation**
+
   - Clone task with sessionId generation
   - Chat session task with 60-min timeout
   - Supabase Broadcast subscription
   - Trigger Streams v2 piping
 
 - [x] **Phase 4: API Routes**
+
   - Orchestration route (trigger both tasks)
   - Question sending via Supabase
   - Public token generation
 
 - [x] **Phase 5: Frontend Integration**
+
   - useRealtimeStream for responses
   - Supabase client for questions
   - Message transformation logic
@@ -239,7 +255,7 @@ ANTHROPIC_API_KEY=your_anthropic_api_key
 SUPABASE_URL=your_supabase_url
 SUPABASE_ANON_KEY=your_supabase_anon_key
 NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
-NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
+NEXT_PUBLIC_SUPABASE_PUBLISHABLE_DEFAULT_KEY=your_supabase_anon_key
 ```
 
 ---
@@ -264,16 +280,19 @@ NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
 ## Future Enhancements
 
 ### V1.1: Optimization
+
 - Redis caching for frequently accessed repos
 - Multiple concurrent questions
 - Persistent query history
 
 ### V1.2: Features
+
 - Private repo support (GitHub OAuth)
 - Full git history access
 - Repo comparison queries
 
 ### V2: Advanced
+
 - File tree navigation UI
 - Code generation capabilities
 - PR creation from chat
@@ -289,4 +308,4 @@ This demo showcases several advanced patterns:
 3. **Hybrid Architecture**: Combining platforms for optimal performance
 4. **No Re-cloning**: Solving a real performance problem in AI-powered dev tools
 
-The architecture prioritizes Trigger.dev's strengths (task orchestration, streaming) while using Supabase minimally for coordination, making it an excellent showcase of Trigger.dev v4 capabilities.
+The architecture prioritizes Trigger.dev's strengths (task orchestration, streaming) while using Supabase minimally for coordination, making it an excellent showcase of Trigger.dev v4 capabilities.

claude-agent-github-wiki/test-broadcast.js

@@ -7,8 +7,8 @@ async function test() {
   // Using environment variables
   const SUPABASE_URL =
     process.env.SUPABASE_URL || "https://rnxcjullrjwhgtdbpqbp.supabase.co";
-  const SERVICE_KEY = process.env.SUPABASE_PRIVATE_KEY;
-  const ANON_KEY = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY;
+  const SERVICE_KEY = process.env.SUPABASE_SECRET_KEY;
+  const ANON_KEY = process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
 
   if (!SERVICE_KEY || !ANON_KEY) {
     console.error("Missing keys in environment!");

claude-agent-github-wiki/test-supabase.mjs

@@ -9,15 +9,15 @@ async function testSupabase() {
 
   // Check environment variables
   const url = process.env.SUPABASE_URL;
-  const privateKey = process.env.SUPABASE_PRIVATE_KEY;
+  const privateKey = process.env.SUPABASE_SECRET_KEY;
 
   console.log("Environment Check:");
   console.log(
     "SUPABASE_URL:",
     url ? `✅ ${url.substring(0, 40)}...` : "❌ NOT SET"
   );
   console.log(
-    "SUPABASE_PRIVATE_KEY:",
+    "SUPABASE_SECRET_KEY:",
     privateKey ? `✅ ${privateKey.substring(0, 20)}...` : "❌ NOT SET"
   );
   console.log("");
@@ -26,7 +26,7 @@ async function testSupabase() {
     console.error("❌ Missing required environment variables!");
     console.log("\nMake sure your .env file contains:");
     console.log("SUPABASE_URL=https://YOUR_PROJECT.supabase.co");
-    console.log("SUPABASE_PRIVATE_KEY=your-service-role-key-here\n");
+    console.log("SUPABASE_SECRET_KEY=your-service-role-key-here\n");
     process.exit(1);
   }