Allow to reload extension from within error modal

.changelog/1860.bugfix.md

@@ -0,0 +1 @@
+Allow to reload extension from within error modal

src/app/components/FatalErrorHandler/index.tsx

@@ -16,13 +16,15 @@ import { TextArea } from 'grommet/es6/components/TextArea'
 import { Text } from 'grommet/es6/components/Text'
 import { Copy } from 'grommet-icons/es6/icons/Copy'
 import { Dashboard } from 'grommet-icons/es6/icons/Dashboard'
+import { Refresh } from 'grommet-icons/es6/icons/Refresh'
 import * as React from 'react'
 import { useContext, useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { normalizeColor } from 'grommet/es6/utils'
 import { ResponsiveLayer } from '../ResponsiveLayer'
 import logotype from '../../../../public/logo192.png'
+import { runtimeIs } from 'config'
 
 const StyledTextArea = styled(TextArea)`
   // Opacity is a workaround for browsers anti-aliasing issue triggered by border-radius.
@@ -116,6 +118,21 @@ export function FatalErrorHandler({ children }: Props) {
             size="large"
           />
         </Box>
+        <Box align={isMobile ? 'stretch' : 'end'} margin={{ bottom: isMobile ? 'xlarge' : 'large' }}>
+          {runtimeIs === 'extension' && (
+            <StyledButton
+              onClick={() => (window as any).chrome?.runtime?.reload()}
+              icon={<Refresh size="22px" color={normalizeColor('brand-white', theme)} />}
+              label={t('fatalError.reloadExtension', 'Reload extension')}
+              style={{
+                backgroundColor: normalizeColor('brand-blue', theme),
+                color: normalizeColor('brand-white', theme),
+                borderColor: normalizeColor('brand-blue', theme),
+              }}
+              size="large"
+            />
+          )}
+        </Box>
         <Text size="small">
           <Trans
             i18nKey="fatalError.instruction"

src/locales/en/translation.json

@@ -169,7 +169,8 @@
     "copy": "Copy error to clipboard",
     "description": "The error that has occurred triggers the wallet to stop. <strong>Your funds are safe.</strong><br/><br/>Please try refreshing the page and reopening your wallet to see if the issue persists. You can check the current status of the network below.",
     "heading": "An error occurred.",
-    "instruction": "If the issue is not resolved after refreshing, please email our support team at  <Email/> and attached the error report."
+    "instruction": "If the issue is not resolved after refreshing, please email our support team at  <Email/> and attached the error report.",
+    "reload": "Reload extension"
   },
   "fiatOnramp": {
     "astarFootnote": "It is hereby noted that AStar Technologies, a Cayman Islands exempted company is acting on behalf and for the purposes of Oasis, and is also the provider of the Oasis Wallet.",