Fail gracefully when Google auth is unavailable

Render the IDE instead of blocking on the OAuth client ID fetch, which left
the page stuck on "Loading Google authentication..." whenever GOOGLE_AUTH_URL
was unset or the auth backend was unreachable.

Skip the Google login button when no auth backend is configured: mounting
useGoogleLogin with an empty client ID throws and takes down the file tree
panel that hosts the widget.

Author: SaintSampo

src/main.tsx

@@ -14,30 +14,29 @@ initAiBuddyAccess();
 applyBlocklyLocale(i18n.language);
 
 function Root() {
-    const [googleClientId, setGoogleClientId] = useState<string | null>(null);
+    const [googleClientId, setGoogleClientId] = useState<string>('');
     const googleAuthBackendUrl = import.meta.env.GOOGLE_AUTH_URL;
 
     useEffect(() => {
+        if (!googleAuthBackendUrl) {
+            console.warn('GOOGLE_AUTH_URL is not set - Google sign-in is disabled.');
+            return;
+        }
         const fetchClientId = async () => {
             try {
                 const response = await fetch(`${googleAuthBackendUrl}/google-auth/client-id`);
                 if (!response.ok) {
                     throw new Error(`Failed to fetch client ID: ${response.statusText}`);
                 }
                 const data = await response.json();
-                setGoogleClientId(data.client_id);
+                setGoogleClientId(data.client_id ?? '');
             } catch (error) {
+                // The IDE stays usable without Google - only Drive sign-in is lost.
                 console.error('Error fetching Google Client ID:', error);
-                // Handle error appropriately, e.g., show an error message to the user
             }
         };
         fetchClientId();
-    }, []);
-
-    if (!googleClientId) {
-        // Optionally render a loading spinner or message
-        return <div>Loading Google authentication...</div>;
-    }
+    }, [googleAuthBackendUrl]);
 
     return (
         <StrictMode>

src/widgets/login.tsx

@@ -54,7 +54,10 @@ function mapDriveAboutUser(data: DriveAboutResponse): UserProfile | null {
     };
 }
 
-function Login({ logoutCallback, onSuccess }: LoginProps) {
+/** Without an auth backend there is no OAuth client ID to sign in with. */
+const isGoogleAuthConfigured = Boolean(import.meta.env.GOOGLE_AUTH_URL);
+
+function GoogleLoginButton({ logoutCallback, onSuccess }: LoginProps) {
     const { t } = useTranslation();
     const [isLogin, setIsLogin] = useState<boolean>(false);
     const [isSigningIn, setIsSigningIn] = useState<boolean>(false);
@@ -284,4 +287,13 @@ function Login({ logoutCallback, onSuccess }: LoginProps) {
     );
 }
 
+/**
+ * Google sign-in button. When Google auth is not configured the button is left
+ * out entirely - useGoogleLogin throws on an empty client ID, which would take
+ * down the file tree that hosts this widget.
+ */
+function Login(props: LoginProps) {
+    return isGoogleAuthConfigured ? <GoogleLoginButton {...props} /> : null;
+}
+
 export default Login;