Handle network disconnection

vscode/CHANGELOG.md

@@ -61,6 +61,7 @@ Starting from `0.2.0`, Cody is using `major.EVEN_NUMBER.patch` for release versi
 - Add suggested recipes to the new chat welcome message. [pull/54277](https://github.com/sourcegraph/sourcegraph/pull/54277)
 - Inline Chat: Added the option to collapse all inline chats from within the inline chat window. [pull/54675](https://github.com/sourcegraph/sourcegraph/pull/54675)
 - Inline Chat: We now stream messages rather than waiting for the response to be fully complete. This means you can read Cody's response as it is being generated. [pull/54665](https://github.com/sourcegraph/sourcegraph/pull/54665)
+- Show network error message in webview when connection is lost and a reload button to get back when network is restored. [pull/107](https://github.com/sourcegraph/cody/pull/107)
 
 ### Fixed
 

vscode/src/chat/ChatViewProvider.ts

@@ -278,9 +278,12 @@ export class ChatViewProvider implements vscode.WebviewViewProvider, vscode.Disp
                 // cody.auth.signin or cody.auth.signout
                 await vscode.commands.executeCommand(`cody.auth.${message.type}`)
                 break
-            case 'settings':
-                await this.authProvider.auth(message.serverEndpoint, message.accessToken, this.config.customHeaders)
+            case 'settings': {
+                const endpoint = message.serverEndpoint.length ? message.serverEndpoint : this.config.serverEndpoint
+                const token = message.accessToken.length ? message.accessToken : this.config.accessToken
+                await this.authProvider.auth(endpoint, token, this.config.customHeaders)
                 break
+            }
             case 'insert':
                 await this.insertAtCursor(message.text)
                 break
@@ -917,6 +920,7 @@ export class ChatViewProvider implements vscode.WebviewViewProvider, vscode.Disp
             return
         }
         const searchErrors = this.codebaseContext.getEmbeddingSearchErrors()
+
         // Display error message as assistant response for users with indexed codebase but getting search errors
         if (this.codebaseContext.checkEmbeddingsConnection() && searchErrors) {
             this.transcript.addErrorAsAssistantResponse(searchErrors)

vscode/src/chat/protocol.ts

@@ -96,6 +96,7 @@ export interface AuthStatus {
     siteHasCodyEnabled: boolean
     siteVersion: string
     configOverwrites?: CodyLLMSiteConfiguration
+    showNetworkError?: boolean
 }
 
 export const defaultAuthStatus = {
@@ -120,6 +121,17 @@ export const unauthenticatedStatus = {
     siteVersion: '',
 }
 
+export const networkErrorAuthStatus = {
+    showInvalidAccessTokenError: false,
+    authenticated: false,
+    isLoggedIn: false,
+    hasVerifiedEmail: false,
+    showNetworkError: true,
+    requiresVerifiedEmail: false,
+    siteHasCodyEnabled: false,
+    siteVersion: '',
+}
+
 /** The local environment of the editor. */
 export interface LocalEnv {
     // The operating system kind

vscode/src/services/AuthProvider.ts

@@ -13,6 +13,7 @@ import {
     isLoggedIn as isAuthed,
     isLocalApp,
     LOCAL_APP_URL,
+    networkErrorAuthStatus,
     unauthenticatedStatus,
 } from '../chat/protocol'
 import { newAuthStatus } from '../chat/utils'
@@ -188,6 +189,14 @@ export class AuthProvider {
         if (!isDotComOrApp) {
             const currentUserID = await this.client.getCurrentUserId()
             const hasVerifiedEmail = false
+
+            // check first if it's a network error
+            if (isError(currentUserID)) {
+                if (isNetworkError(currentUserID.message)) {
+                    return { ...networkErrorAuthStatus, endpoint }
+                }
+            }
+
             return newAuthStatus(
                 endpoint,
                 isDotComOrApp,
@@ -200,6 +209,14 @@ export class AuthProvider {
         }
         const userInfo = await this.client.getCurrentUserIdAndVerifiedEmail()
         const isCodyEnabled = true
+
+        // check first if it's a network error
+        if (isError(userInfo)) {
+            if (isNetworkError(userInfo.message)) {
+                return { ...networkErrorAuthStatus, endpoint }
+            }
+        }
+
         return isError(userInfo)
             ? { ...unauthenticatedStatus, endpoint }
             : newAuthStatus(
@@ -333,6 +350,15 @@ export class AuthProvider {
     }
 }
 
+export function isNetworkError(error: string): boolean {
+    return (
+        error.includes('ENOTFOUND') ||
+        error.includes('ECONNREFUSED') ||
+        error.includes('ECONNRESET') ||
+        error.includes('EHOSTUNREACH')
+    )
+}
+
 function formatURL(uri: string): string | null {
     if (!uri) {
         return null

vscode/webviews/Error.tsx

@@ -1,5 +1,9 @@
+import { VSCodeButton } from '@vscode/webview-ui-toolkit/react'
+
 import { AuthStatus, isLocalApp } from '../src/chat/protocol'
 
+import { getVSCodeAPI } from './utils/VSCodeApi'
+
 import styles from './Login.module.css'
 
 const AUTH_ERRORS = {
@@ -10,6 +14,8 @@ const AUTH_ERRORS = {
     EMAIL_NOT_VERIFIED: 'Email not verified. Please add a verified email to your Sourcegraph.com account.',
     APP_NOT_RUNNING: 'Cody App is not running. Please open the Cody App to continue.',
     INVALID_URL: 'Connection failed due to invalid URL. Please enter a valid Sourcegraph instance URL.',
+    NETWORK_ERROR:
+        'Due to network-related problems, Cody cannot be reached. Try again after checking it! Once your connection is restored, attempt a reload.',
 }
 export const ErrorContainer: React.FunctionComponent<{
     authStatus: AuthStatus
@@ -26,11 +32,12 @@ export const ErrorContainer: React.FunctionComponent<{
         requiresVerifiedEmail,
         hasVerifiedEmail,
         siteVersion,
+        showNetworkError,
     } = authStatus
     // Version is compatible if this is an insider build or version is 5.1.0 or above
     // Right now we assumes all insider builds have Cody enabled
     // NOTE: Insider build includes App builds but we should seperate them in the future
-    if (!authenticated && !showInvalidAccessTokenError) {
+    if (!authenticated && !showInvalidAccessTokenError && !showNetworkError) {
         return null
     }
     // Errors for app are handled in the ConnectApp component
@@ -45,6 +52,26 @@ export const ErrorContainer: React.FunctionComponent<{
     const isVersionCompatible = isInsiderBuild || siteVersion >= '5.1.0'
     const isVersionBeforeCody = !isVersionCompatible && siteVersion < '5.0.0'
     const prefix = `Failed: ${isApp.isRunning ? 'Cody App' : endpoint}`
+
+    const handleReload = (): void => {
+        getVSCodeAPI().postMessage({ command: 'settings', serverEndpoint: '', accessToken: '' })
+    }
+
+    // When there's a network error
+    if (showNetworkError) {
+        return (
+            <>
+                <div className={styles.error}>
+                    <p>Current endpoint: {endpoint}</p>
+                    <p>{AUTH_ERRORS.NETWORK_ERROR}</p>
+                    <VSCodeButton className={styles.button} type="button" onClick={handleReload}>
+                        Reload
+                    </VSCodeButton>
+                </div>
+            </>
+        )
+    }
+
     // When doesn't have a valid token
     if (showInvalidAccessTokenError) {
         return (

vscode/webviews/Login.module.css

@@ -70,6 +70,7 @@
     background-color: var(--vscode-inputValidation-errorBackground);
     padding: 0.5rem;
     margin-top: 1rem;
+    margin-bottom: 1rem;
 }
 
 .terms {
@@ -82,4 +83,4 @@
 
     width: 100%;
     gap: 1rem;
-}
+}