feat: add option to update the indexer url on error (#983)

anoma · Aug 8, 2024 · eac7ec8 · eac7ec8
1 parent d75da09
commit eac7ec8
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 17 deletions.
diff --git a/apps/namadillo/src/App/AppSetup.tsx b/apps/namadillo/src/App/AppSetup.tsx
@@ -12,6 +12,26 @@ import { ErrorBox } from "./Common/ErrorBox";
 import { PageLoader } from "./Common/PageLoader";
 import { Setup } from "./Common/Setup";
 
+const NiceError = ({
+  children,
+  onClickUpdate,
+}: {
+  children: string;
+  onClickUpdate: () => void;
+}): JSX.Element => {
+  return (
+    <>
+      <p>{children}</p>
+      <p className="mt-1">
+        If the problem persists, you can{" "}
+        <button className="text-yellow hover:text-cyan" onClick={onClickUpdate}>
+          update your indexer settings.
+        </button>
+      </p>
+    </>
+  );
+};
+
 type AppSetupProps = {
   children: ReactNode;
 };
@@ -56,21 +76,9 @@ export const AppSetup = ({ children }: AppSetupProps): JSX.Element => {
         result={indexerHeartbeat}
         containerProps={errorContainerProps}
         niceError={
-          <>
-            <p>
-              Unable to connect to indexer. Please check your internet
-              connection.
-            </p>
-            <p className="mt-1">
-              If the problem persists, you can{" "}
-              <button
-                className="text-yellow hover:text-cyan"
-                onClick={() => setChangeIndexerSettings(true)}
-              >
-                update your indexer settings.
-              </button>
-            </p>
-          </>
+          <NiceError onClickUpdate={() => setChangeIndexerSettings(true)}>
+            Unable to connect to indexer. Please check your internet connection.
+          </NiceError>
         }
       />
     );
@@ -107,7 +115,11 @@ export const AppSetup = ({ children }: AppSetupProps): JSX.Element => {
       <AtomErrorBoundary
         containerProps={errorContainerProps}
         result={chain}
-        niceError="Unable to load chain info. Please check your internet connection."
+        niceError={
+          <NiceError onClickUpdate={() => setChangeIndexerSettings(true)}>
+            Unable to load chain info. Please check your internet connection.
+          </NiceError>
+        }
       />
     );
   }

diff --git a/apps/namadillo/src/App/Common/ErrorBox.tsx b/apps/namadillo/src/App/Common/ErrorBox.tsx
@@ -26,7 +26,7 @@ export const ErrorBox = ({
       <i className="text-4xl text-yellow">
         <MdErrorOutline />
       </i>
-      <p className="leading-[1.2]">{niceError}</p>
+      <div className="leading-[1.2]">{niceError}</div>
       {children}
     </div>
   );