Handle DispatchError failures gracefully (#2182)

* Handle DispatchError failures gracefully * Also allow queue display failures
polkadot-js · Jan 23, 2020 · 09e974b · 09e974b
1 parent a54eef3
commit 09e974b
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 11 deletions.
diff --git a/packages/react-components/src/Status/Queue.tsx b/packages/react-components/src/Status/Queue.tsx
@@ -135,10 +135,14 @@ export default function Queue ({ children }: Props): React.ReactElement<Props> {
             let message = dispatchError.type;
 
             if (dispatchError.isModule) {
-              const mod = dispatchError.asModule;
-              const error = registry.findMetaError(new Uint8Array([mod.index.toNumber(), mod.error.toNumber()]));
-
-              message = `${error.section}.${error.name}`;
+              try {
+                const mod = dispatchError.asModule;
+                const error = registry.findMetaError(new Uint8Array([mod.index.toNumber(), mod.error.toNumber()]));
+
+                message = `${error.section}.${error.name}`;
+              } catch (error) {
+                // swallow
+              }
             }
 
             return {

diff --git a/packages/react-params/src/Param/DispatchError.tsx b/packages/react-params/src/Param/DispatchError.tsx
@@ -5,26 +5,46 @@
 import { DispatchError } from '@polkadot/types/interfaces';
 import { Props } from '../types';
 
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { registry } from '@polkadot/react-api';
 import { Input } from '@polkadot/react-components';
 
 import { useTranslation } from '../translate';
 import Static from './Static';
 import Unknown from './Unknown';
 
+interface Details {
+  details?: string | null;
+  type?: string;
+}
+
 export default function ErrorDisplay (props: Props): React.ReactElement<Props> {
   const { t } = useTranslation();
+  const [{ details, type }, setDetails] = useState<Details>({});
+
+  useEffect((): void => {
+    if (details !== null && props.defaultValue?.value?.isModule) {
+      try {
+        const mod = (props.defaultValue.value as DispatchError).asModule;
+        const error = registry.findMetaError(new Uint8Array([mod.index.toNumber(), mod.error.toNumber()]));
 
-  if (!props.isDisabled || !props.defaultValue?.value?.isModule) {
+        setDetails({
+          details: error.documentation.join(', '),
+          type: `${error.section}.${error.name}`
+        });
+      } catch (error) {
+        // Errors may not actually be exposed, in this case, just return the default representation
+        console.error(error);
+
+        setDetails({ details: null });
+      }
+    }
+  }, [props.defaultValue]);
+
+  if (!props.isDisabled || !details) {
     return <Unknown {...props} />;
   }
 
-  const mod = (props.defaultValue.value as DispatchError).asModule;
-  const error = registry.findMetaError(new Uint8Array([mod.index.toNumber(), mod.error.toNumber()]));
-  const type = `${error.section}.${error.name}`;
-  const details = error.documentation.join(', ');
-
   return (
     <Static {...props}>
       <Input