Throw error when server context can't be loaded (#2635)

src/App.tsx

@@ -41,9 +41,7 @@ const AppContexts: FunctionComponent<AdminClientProps> = ({
             <AccessContextProvider>
               <Help>
                 <AlertProvider>
-                  <ServerInfoProvider>
-                    <SubGroups>{children}</SubGroups>
-                  </ServerInfoProvider>
+                  <SubGroups>{children}</SubGroups>
                 </AlertProvider>
               </Help>
             </AccessContextProvider>
@@ -91,16 +89,18 @@ export const App = ({ adminClient }: AdminClientProps) => {
               window.location.origin + window.location.pathname)
           }
         >
-          <Switch>
-            {routes.map((route, i) => (
-              <Route
-                exact={route.matchOptions?.exact ?? true}
-                key={i}
-                path={route.path}
-                component={() => <SecuredRoute route={route} />}
-              />
-            ))}
-          </Switch>
+          <ServerInfoProvider>
+            <Switch>
+              {routes.map((route, i) => (
+                <Route
+                  exact={route.matchOptions?.exact ?? true}
+                  key={i}
+                  path={route.path}
+                  component={() => <SecuredRoute route={route} />}
+                />
+              ))}
+            </Switch>
+          </ServerInfoProvider>
         </ErrorBoundary>
       </Page>
     </AppContexts>

src/context/server-info/ServerInfoProvider.tsx

@@ -2,8 +2,8 @@ import React, { createContext, FunctionComponent, useState } from "react";
 
 import type { ServerInfoRepresentation } from "@keycloak/keycloak-admin-client/lib/defs/serverInfoRepesentation";
 import { sortProviders } from "../../util";
-import useRequiredContext from "../../utils/useRequiredContext";
 import { useAdminClient, useFetch } from "../auth/AdminClient";
+import useRequiredContext from "../../utils/useRequiredContext";
 
 export const ServerInfoContext = createContext<
   ServerInfoRepresentation | undefined
@@ -11,25 +11,14 @@ export const ServerInfoContext = createContext<
 
 export const useServerInfo = () => useRequiredContext(ServerInfoContext);
 
-export const useLoginProviders = () => {
-  return sortProviders(useServerInfo().providers!["login-protocol"].providers);
-};
+export const useLoginProviders = () =>
+  sortProviders(useServerInfo().providers!["login-protocol"].providers);
 
 export const ServerInfoProvider: FunctionComponent = ({ children }) => {
   const adminClient = useAdminClient();
   const [serverInfo, setServerInfo] = useState<ServerInfoRepresentation>({});
 
-  useFetch(
-    async () => {
-      try {
-        return await adminClient.serverInfo.find();
-      } catch (error) {
-        return {};
-      }
-    },
-    setServerInfo,
-    []
-  );
+  useFetch(adminClient.serverInfo.find, setServerInfo, []);
 
   return (
     <ServerInfoContext.Provider value={serverInfo}>

src/i18n.ts

@@ -77,7 +77,7 @@ const configuredI18n = i18n
       translator: any
     ) {
       const override: string =
-        translator.resourceStore.data[translator.language].overrides[key];
+        translator.resourceStore.data[translator.language].overrides?.[key];
       return override || value;
     },
   })