fix: github connection

Author: tomasz-stefaniak

extensions/vscode/src/extension/VsCodeMessenger.ts

@@ -371,9 +371,30 @@ export class VsCodeMessenger {
         console.error("Failed to create background agent:", e);
         const errorMessage =
           e instanceof Error ? e.message : "Unknown error occurred";
-        vscode.window.showErrorMessage(
-          `Failed to create background agent: ${errorMessage}`,
-        );
+
+        // Check if this is a GitHub authorization error
+        if (
+          errorMessage.includes("GitHub token") ||
+          errorMessage.includes("GitHub App")
+        ) {
+          const selection = await vscode.window.showErrorMessage(
+            "Background agents need GitHub access. Please connect your GitHub account to Continue.",
+            "Connect GitHub",
+            "Cancel",
+          );
+
+          if (selection === "Connect GitHub") {
+            vscode.env.openExternal(
+              vscode.Uri.parse(
+                "https://hub.continue.dev/settings/integrations",
+              ),
+            );
+          }
+        } else {
+          vscode.window.showErrorMessage(
+            `Failed to create background agent: ${errorMessage}`,
+          );
+        }
       }
     });
 

gui/src/components/BackgroundMode/BackgroundModeView.tsx

@@ -1,6 +1,10 @@
-import { RocketLaunchIcon } from "@heroicons/react/24/outline";
-import { useCallback, useState } from "react";
+import {
+  ExclamationTriangleIcon,
+  RocketLaunchIcon,
+} from "@heroicons/react/24/outline";
+import { useCallback, useContext, useEffect, useState } from "react";
 import { useAuth } from "../../context/Auth";
+import { IdeMessengerContext } from "../../context/IdeMessenger";
 import { AgentsList } from "./AgentsList";
 
 interface BackgroundModeViewProps {
@@ -9,7 +13,10 @@ interface BackgroundModeViewProps {
 
 export function BackgroundModeView({ onCreateAgent }: BackgroundModeViewProps) {
   const { session, login } = useAuth();
+  const ideMessenger = useContext(IdeMessengerContext);
   const [isLoggingIn, setIsLoggingIn] = useState(false);
+  const [showGitHubSetup, setShowGitHubSetup] = useState(false);
+  const [checkingGitHub, setCheckingGitHub] = useState(true);
 
   const handleSignIn = useCallback(async () => {
     setIsLoggingIn(true);
@@ -22,6 +29,48 @@ export function BackgroundModeView({ onCreateAgent }: BackgroundModeViewProps) {
     }
   }, [login]);
 
+  const handleOpenGitHubSettings = useCallback(() => {
+    // Open the hub settings page for GitHub integration
+    ideMessenger.post(
+      "openUrl",
+      "https://hub.continue.dev/settings/integrations/github",
+    );
+  }, [ideMessenger]);
+
+  // Check if user has GitHub installations when signed in
+  useEffect(() => {
+    async function checkGitHubAuth() {
+      if (!session) {
+        setCheckingGitHub(false);
+        return;
+      }
+
+      try {
+        setCheckingGitHub(true);
+        // Try to list agents - if this fails with GitHub token error,
+        // we know GitHub isn't connected
+        const agents = await ideMessenger.request("listBackgroundAgents", {});
+
+        // If we got here without error and have agents, GitHub is connected
+        // If we have no agents, we still don't know for sure, so we'll show
+        // the setup warning anyway (it will be dismissed after first agent creation)
+        setShowGitHubSetup(false);
+      } catch (error: any) {
+        // Check if error is related to GitHub token
+        if (
+          error?.message?.includes("GitHub token") ||
+          error?.message?.includes("GitHub App")
+        ) {
+          setShowGitHubSetup(true);
+        }
+      } finally {
+        setCheckingGitHub(false);
+      }
+    }
+
+    void checkGitHubAuth();
+  }, [session, ideMessenger]);
+
   if (!session) {
     return (
       <div className="flex flex-col items-center justify-center gap-4 px-4 py-8">
@@ -46,6 +95,28 @@ export function BackgroundModeView({ onCreateAgent }: BackgroundModeViewProps) {
 
   return (
     <div className="flex flex-col gap-4 py-4">
+      {!checkingGitHub && showGitHubSetup && (
+        <div className="mx-2 rounded-lg border border-yellow-200 bg-yellow-50 p-4">
+          <div className="flex items-start gap-3">
+            <ExclamationTriangleIcon className="h-5 w-5 flex-shrink-0 text-yellow-600" />
+            <div className="flex-1">
+              <h4 className="text-sm font-semibold text-yellow-900">
+                Connect GitHub
+              </h4>
+              <p className="mt-1 text-sm text-yellow-800">
+                Background agents need access to your GitHub repositories.
+                Connect your GitHub account to get started.
+              </p>
+              <button
+                onClick={handleOpenGitHubSettings}
+                className="mt-3 rounded-md bg-yellow-600 px-4 py-2 text-sm font-medium text-white hover:bg-yellow-700"
+              >
+                Connect GitHub Account
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
       <div className="px-2 text-sm text-gray-600">
         Agents you trigger will run in the background and appear below.
       </div>