fix(FR-2870): catch storage host fetch errors with session launcher boundary

Author: ironAiken2

packages/backend.ai-ui/src/hooks/index.ts

@@ -166,5 +166,8 @@ export {
 } from './useBAILogger';
 export type { LoggerPlugin, LogContext, BAILogger } from './useBAILogger';
 export { useEventNotStable } from './useEventNotStable';
-export { useProjectResourceGroups } from './useProjectResourceGroups';
+export {
+  useProjectResourceGroups,
+  StorageHostFetchError,
+} from './useProjectResourceGroups';
 export type { ScalingGroupItem } from './useProjectResourceGroups';

packages/backend.ai-ui/src/hooks/useProjectResourceGroups.ts

@@ -6,6 +6,27 @@ export interface ScalingGroupItem {
   name: string;
 }
 
+/**
+ * Thrown when the vfolder host info fetch (`/folders/_/hosts`) inside
+ * `useProjectResourceGroups` fails. Tagging the failure lets callers wrap
+ * the hook with a dedicated error boundary that can distinguish this
+ * specific case from unrelated render errors and surface a targeted
+ * message (and discriminate it from the parallel scaling-groups fetch
+ * failure, which is re-thrown as-is so an outer boundary handles it).
+ */
+export class StorageHostFetchError extends Error {
+  readonly originalError: unknown;
+  constructor(originalError: unknown) {
+    super(
+      originalError instanceof Error
+        ? originalError.message
+        : 'Failed to fetch storage host information.',
+    );
+    this.name = 'StorageHostFetchError';
+    this.originalError = originalError;
+  }
+}
+
 interface VolumeInfo {
   backend: string;
   capabilities: string[];
@@ -60,15 +81,21 @@ export const useProjectResourceGroups = (
 
   const { data } = useSuspenseTanQuery<ProjectResourceGroupsQueryResult>({
     queryKey: ['ResourceGroupSelectQuery', projectName],
-    queryFn: () => {
+    queryFn: async () => {
       // Short-circuit when there is no project context yet — avoids hitting
       // `/scaling-groups?group=` and `/folders/_/hosts` with an unscoped query.
       if (!projectName) {
-        return Promise.resolve(null);
+        return null;
       }
       const search = new URLSearchParams();
       search.set('group', projectName);
-      return Promise.all([
+      // Run both fetches concurrently but discriminate failures: a host-info
+      // failure is tagged with `StorageHostFetchError` so a dedicated boundary
+      // can surface it, while a scaling-groups failure is re-thrown as-is and
+      // bubbles up to the generic error boundary. Host-info failure takes
+      // precedence when both fail because SFTP filtering depends on it and
+      // the result is otherwise unusable.
+      const [scalingGroupsResult, hostsResult] = await Promise.allSettled([
         baiRequestWithPromise({
           method: 'GET',
           url: `/scaling-groups?${search.toString()}`,
@@ -78,6 +105,16 @@ export const useProjectResourceGroups = (
           url: `/folders/_/hosts`,
         }),
       ]);
+      if (hostsResult.status === 'rejected') {
+        throw new StorageHostFetchError(hostsResult.reason);
+      }
+      if (scalingGroupsResult.status === 'rejected') {
+        throw scalingGroupsResult.reason;
+      }
+      return [
+        scalingGroupsResult.value,
+        hostsResult.value,
+      ] as unknown as NonNullable<ProjectResourceGroupsQueryResult>;
     },
     staleTime: 1000 * 60 * 5, // Cache for 5 minutes
   });

react/src/components/StorageHostFetchErrorBoundary.tsx

@@ -0,0 +1,65 @@
+/**
+ @license
+ Copyright (c) 2015-2026 Lablup Inc. All rights reserved.
+ */
+import { Button, Result } from 'antd';
+import { BAIFlex, StorageHostFetchError } from 'backend.ai-ui';
+import React from 'react';
+import { ErrorBoundary, type FallbackProps } from 'react-error-boundary';
+import { useTranslation } from 'react-i18next';
+
+interface StorageHostFetchErrorBoundaryProps {
+  children: React.ReactNode;
+  style?: React.CSSProperties;
+}
+
+const Fallback: React.FC<FallbackProps & { style?: React.CSSProperties }> = ({
+  error,
+  style,
+}) => {
+  'use memo';
+  const { t } = useTranslation();
+  if (!(error instanceof StorageHostFetchError)) {
+    // Re-throw non-storage errors so the outer BAIErrorBoundary handles them.
+    throw error;
+  }
+  return (
+    <BAIFlex
+      style={{ margin: 'auto', ...style }}
+      justify="center"
+      align="center"
+    >
+      <Result
+        status="warning"
+        title={t('errorBoundary.StorageHostFetchFailedTitle')}
+        extra={
+          <BAIFlex direction="column" gap="md">
+            <Button
+              type="primary"
+              onClick={() => {
+                globalThis.history.back();
+              }}
+            >
+              {t('button.GoBackToPreviousPage')}
+            </Button>
+          </BAIFlex>
+        }
+      />
+    </BAIFlex>
+  );
+};
+
+const StorageHostFetchErrorBoundary: React.FC<
+  StorageHostFetchErrorBoundaryProps
+> = ({ children, style }) => {
+  'use memo';
+  return (
+    <ErrorBoundary
+      fallbackRender={(props) => <Fallback {...props} style={style} />}
+    >
+      {children}
+    </ErrorBoundary>
+  );
+};
+
+export default StorageHostFetchErrorBoundary;

react/src/routes.tsx

@@ -13,6 +13,7 @@ import LocationStateBreadCrumb from './components/LocationStateBreadCrumb';
 import LoginView from './components/LoginView';
 import MainLayout from './components/MainLayout/MainLayout';
 import { STokenLoginBoundary } from './components/STokenLoginBoundary';
+import StorageHostFetchErrorBoundary from './components/StorageHostFetchErrorBoundary';
 import WebUINavigate from './components/WebUINavigate';
 import { persistPostLoginState } from './helper/loginSessionAuth';
 import { useSuspendedBackendaiClient } from './hooks';
@@ -258,15 +259,17 @@ export const mainLayoutChildRoutes: RouteObject[] = [
               style={{ paddingBottom: token.paddingContentVerticalLG }}
             >
               <LocationStateBreadCrumb />
-              <Suspense
-                fallback={
-                  <BAIFlex direction="column" style={{ maxWidth: 700 }}>
-                    <Skeleton active />
-                  </BAIFlex>
-                }
-              >
-                <SessionLauncherPage />
-              </Suspense>
+              <StorageHostFetchErrorBoundary>
+                <Suspense
+                  fallback={
+                    <BAIFlex direction="column" style={{ maxWidth: 700 }}>
+                      <Skeleton active />
+                    </BAIFlex>
+                  }
+                >
+                  <SessionLauncherPage />
+                </Suspense>
+              </StorageHostFetchErrorBoundary>
             </BAIFlex>
           );
         },

resources/i18n/de.json

@@ -362,6 +362,7 @@
     "Finish": "Fertig",
     "ForceTerminate": "Beenden erzwingen",
     "Generate": "Generieren",
+    "GoBackToPreviousPage": "Zurück zur vorherigen Seite",
     "GoBackToStartPage": "Zurück zur Seite {{title}}",
     "Info": "Info",
     "More": "Mehr",
@@ -1357,6 +1358,7 @@
     "ReloadPage": "Laden Sie die Seite neu",
     "ResetErrorBoundary": "ErrorBoundary zurücksetzen",
     "StackTrace": "Stack-Trace:",
+    "StorageHostFetchFailedTitle": "Speicher-Host-Informationen konnten nicht abgerufen werden.",
     "Title": "Es ist ein Fehler aufgetreten."
   },
   "explorer": {

resources/i18n/el.json

@@ -362,6 +362,7 @@
     "Finish": "Φινίρισμα",
     "ForceTerminate": "Δύναμη τερματισμού",
     "Generate": "Παράγω",
+    "GoBackToPreviousPage": "Επιστροφή στην προηγούμενη σελίδα",
     "GoBackToStartPage": "Επιστροφή στη σελίδα {{title}}",
     "Info": "Πληροφορίες",
     "More": "Περισσότερα",
@@ -1357,6 +1358,7 @@
     "ReloadPage": "Επαναφόρτωση της σελίδας",
     "ResetErrorBoundary": "Επαναφορά ErrorBoundary",
     "StackTrace": "Ιχνη στοίβας:",
+    "StorageHostFetchFailedTitle": "Αποτυχία ανάκτησης πληροφοριών κεντρικού υπολογιστή αποθήκευσης.",
     "Title": "Εμφανίστηκε σφάλμα."
   },
   "explorer": {

resources/i18n/en.json

@@ -379,6 +379,7 @@
     "Finish": "Finish",
     "ForceTerminate": "Force Terminate",
     "Generate": "Generate",
+    "GoBackToPreviousPage": "Go back to the previous page",
     "GoBackToStartPage": "Go back to the {{title}} page",
     "Info": "Info",
     "More": "More",
@@ -1376,6 +1377,7 @@
     "ReloadPage": "Reload the page",
     "ResetErrorBoundary": "Reset ErrorBoundary",
     "StackTrace": "Stack Trace:",
+    "StorageHostFetchFailedTitle": "Failed to fetch storage host information.",
     "Title": "An error has occurred."
   },
   "explorer": {

resources/i18n/es.json

@@ -362,6 +362,7 @@
     "Finish": "Acabado",
     "ForceTerminate": "Forzar finalización",
     "Generate": "Genere",
+    "GoBackToPreviousPage": "Volver a la página anterior",
     "GoBackToStartPage": "Volver a la página {{title}}",
     "Info": "Info",
     "More": "Más",
@@ -1357,6 +1358,7 @@
     "ReloadPage": "Recargar la página",
     "ResetErrorBoundary": "Restablecer ErrorBoundary",
     "StackTrace": "Traza de pila:",
+    "StorageHostFetchFailedTitle": "No se pudo obtener la información del host de almacenamiento.",
     "Title": "Se ha producido un error."
   },
   "explorer": {

resources/i18n/fi.json

@@ -362,6 +362,7 @@
     "Finish": "Viimeistely",
     "ForceTerminate": "Pakota lopettamaan",
     "Generate": "Luo",
+    "GoBackToPreviousPage": "Palaa edelliselle sivulle",
     "GoBackToStartPage": "Palaa sivulle {{title}}",
     "Info": "Tiedot",
     "More": "Lisää",
@@ -1357,6 +1358,7 @@
     "ReloadPage": "Lataa sivu uudelleen",
     "ResetErrorBoundary": "Nollaa ErrorBoundary",
     "StackTrace": "Pinon jäljitys:",
+    "StorageHostFetchFailedTitle": "Tallennusisännän tietojen hakeminen epäonnistui.",
     "Title": "On tapahtunut virhe."
   },
   "explorer": {

resources/i18n/fr.json

@@ -362,6 +362,7 @@
     "Finish": "Finir",
     "ForceTerminate": "Forcer l'arrêt",
     "Generate": "produire",
+    "GoBackToPreviousPage": "Retour à la page précédente",
     "GoBackToStartPage": "Retour à la page {{title}}",
     "Info": "Info",
     "More": "Plus",
@@ -1358,6 +1359,7 @@
     "ReloadPage": "Recharger la page",
     "ResetErrorBoundary": "Réinitialisation de la limite d'erreur",
     "StackTrace": "Trace de la pile :",
+    "StorageHostFetchFailedTitle": "Échec de la récupération des informations sur l'hôte de stockage.",
     "Title": "Une erreur s'est produite."
   },
   "explorer": {