From 68bfd09a899238aa87b418a99e8c4102c9d70753 Mon Sep 17 00:00:00 2001 From: Dominik Zborowski Date: Tue, 24 Oct 2023 13:44:06 +0200 Subject: [PATCH] feat: improve error handling (#119) --- components/AppLoader.vue | 7 +++ composables/useBrowserExtension.ts | 44 ++--------------- pages/[profileAddress]/index.vue | 7 +-- pages/[profileAddress]/lyx-details.vue | 7 +-- .../nft/[nftAddress]/tokenId/[tokenId].vue | 7 +-- pages/[profileAddress]/send.vue | 23 ++------- .../[profileAddress]/token/[tokenAddress].vue | 7 +-- pages/index.vue | 7 +-- translations/en_US.json | 1 + utils/getErrorMessage.ts | 49 +++++++++++++++++++ 10 files changed, 68 insertions(+), 91 deletions(-) create mode 100644 components/AppLoader.vue create mode 100644 utils/getErrorMessage.ts diff --git a/components/AppLoader.vue b/components/AppLoader.vue new file mode 100644 index 00000000..86d6a446 --- /dev/null +++ b/components/AppLoader.vue @@ -0,0 +1,7 @@ + diff --git a/composables/useBrowserExtension.ts b/composables/useBrowserExtension.ts index 8b4c7340..58efb613 100644 --- a/composables/useBrowserExtension.ts +++ b/composables/useBrowserExtension.ts @@ -50,51 +50,13 @@ const connect = async () => { setStatus('isConnected', true) setConnectionExpiry() await navigateTo(profileRoute(address)) - } catch (error: any) { + } catch (error: unknown) { console.error(error) disconnect() - // known errors - if (error instanceof EoAError) { - return showModal({ - title: formatMessage('web3_connect_error_title'), - message: formatMessage('web3_eoa_error_message'), - }) - } - - if (error instanceof InterfaceError) { - return showModal({ - title: formatMessage('web3_connect_error_title'), - message: formatMessage('web3_interface_error_message'), - }) - } - - // errors that have a code or message - if (error && error.code) { - switch (error.code) { - case 4001: - return showModal({ - title: formatMessage('web3_connect_error_title'), - message: formatMessage('web3_connect_error_rejected_request'), - }) - - case -32005: - return showModal({ - title: formatMessage('web3_connect_error_title'), - message: formatMessage('web3_connect_error_pending_request'), - }) - default: - return showModal({ - title: formatMessage('web3_connect_error_title'), - message: error.message, - }) - } - } - - // unknowns errors - return showModal({ + showModal({ title: formatMessage('web3_connect_error_title'), - message: formatMessage('web3_connect_error'), + message: getConnectionErrorMessage(error), }) } finally { setStatus('isConnecting', false) diff --git a/pages/[profileAddress]/index.vue b/pages/[profileAddress]/index.vue index 2358038b..187d64b0 100644 --- a/pages/[profileAddress]/index.vue +++ b/pages/[profileAddress]/index.vue @@ -98,11 +98,6 @@ const showProfileDetails = computed( - + diff --git a/pages/[profileAddress]/lyx-details.vue b/pages/[profileAddress]/lyx-details.vue index 9e04a063..9f76892e 100644 --- a/pages/[profileAddress]/lyx-details.vue +++ b/pages/[profileAddress]/lyx-details.vue @@ -86,11 +86,6 @@ const handleSendLyx = () => { /> - + diff --git a/pages/[profileAddress]/nft/[nftAddress]/tokenId/[tokenId].vue b/pages/[profileAddress]/nft/[nftAddress]/tokenId/[tokenId].vue index 24779f6e..5e79519a 100644 --- a/pages/[profileAddress]/nft/[nftAddress]/tokenId/[tokenId].vue +++ b/pages/[profileAddress]/nft/[nftAddress]/tokenId/[tokenId].vue @@ -105,11 +105,6 @@ const handleSendAsset = (event: Event) => { /> - + diff --git a/pages/[profileAddress]/send.vue b/pages/[profileAddress]/send.vue index 1a979faf..6e2986cc 100644 --- a/pages/[profileAddress]/send.vue +++ b/pages/[profileAddress]/send.vue @@ -143,30 +143,13 @@ const handleSend = async () => { } setStatus('success') - } catch (error: any) { + } catch (error: unknown) { console.error(error) setStatus('draft') - // errors that have a code or message - if (error && error.code) { - switch (error.code) { - case 4001: - return showModal({ - title: formatMessage('send_error_title'), - message: formatMessage('send_error_rejected_request'), - }) - default: - showModal({ - title: formatMessage('send_error_title'), - message: formatMessage('send_error_message'), - }) - } - } - - // unknowns errors showModal({ - title: formatMessage('send_error_title'), - message: formatMessage('send_error_message'), + title: formatMessage('web3_connect_error_title'), + message: getSendErrorMessage(error), }) } } diff --git a/pages/[profileAddress]/token/[tokenAddress].vue b/pages/[profileAddress]/token/[tokenAddress].vue index 4252e9fe..1f805e87 100644 --- a/pages/[profileAddress]/token/[tokenAddress].vue +++ b/pages/[profileAddress]/token/[tokenAddress].vue @@ -106,11 +106,6 @@ const handleSendAsset = (event: Event) => { /> - + diff --git a/pages/index.vue b/pages/index.vue index f7589db6..e4149ce1 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -80,11 +80,6 @@ watchEffect(() => { - + diff --git a/translations/en_US.json b/translations/en_US.json index adbf64ec..a1743b26 100644 --- a/translations/en_US.json +++ b/translations/en_US.json @@ -24,6 +24,7 @@ "token_details_token_id": "Token ID", "send_button": "Send {amount} {symbol}", "asset_supply_title": "Total Token Supply", + "send_error_same_address": "You cannot send {lyxSymbol} to yourself", "header_discovery": "Discovery", "not_found_text": "We can’t seem to find the page you’re looking for!", "asset_filter_owned_assets": "Owned assets", diff --git a/utils/getErrorMessage.ts b/utils/getErrorMessage.ts new file mode 100644 index 00000000..41ba627c --- /dev/null +++ b/utils/getErrorMessage.ts @@ -0,0 +1,49 @@ +export const getConnectionErrorMessage = (error: unknown) => { + const { formatMessage } = useIntl() + + // known error types + if (error instanceof EoAError) { + return formatMessage('web3_eoa_error_message') + } + + if (error instanceof InterfaceError) { + return formatMessage('web3_interface_error_message') + } + + // errors that have a code or message + if (error && typeof error === 'object' && 'code' in error) { + switch (error.code) { + case 4001: + return formatMessage('web3_connect_error_rejected_request') + case -32005: + return formatMessage('web3_connect_error_pending_request') + default: + break + } + } + + // generic message for unknowns errors + return formatMessage('web3_connect_error') +} + +export const getSendErrorMessage = (error: unknown): string => { + const { formatMessage } = useIntl() + const appStore = useAppStore() + + // errors that have a code or message + if (error && typeof error === 'object' && 'code' in error) { + switch (error.code) { + case 4001: + return formatMessage('send_error_rejected_request') + case -32602: + return formatMessage('send_error_same_address', { + lyxSymbol: appStore.currentNetwork.token.symbol, + }) + default: + break + } + } + + // generic message for unknowns errors + return formatMessage('send_error_message') +}