LaconicNetwork/vega-frontend-monorepo
6
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

chore: improve handling wallet errors in connection dialog - display also WalletClientErrors

Browse Source
This commit is contained in:
maciek
2023-01-26 15:14:34 +01:00
parent 80e97535f2
commit efc1e18049
8 changed files with 55 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
libs/wallet/src/connect-dialog/json-rpc-connector-form.tsx
+11 -9
View File
@@ -156,17 +156,18 @@ const Error = ({
const { VEGA_DOCS_URL } = useEnvironment();
if (error) {
const errorData = Array.isArray(error.data)
? error.data
: error.data
? [error.data]
: [];
if (error.code === ClientErrors.NO_SERVICE.code) {
title = t('No wallet detected');
text = t(`No wallet application running at ${connectorUrl}`);
text = t(
'No wallet application running at %s',
connectorUrl || 'unknown host'
);
} else if (error.code === ClientErrors.WRONG_NETWORK.code) {
title = t('Wrong network');
text = `To complete your wallet connection, set your wallet network in your app to "${appChainId}".`;
text = t(
'To complete your wallet connection, set your wallet network in your app to "%s".',
appChainId
);
} else if (error.code === ServiceErrors.CONNECTION_DECLINED) {
title = t('Connection declined');
text = t('Your wallet connection was rejected');
@@ -174,7 +175,7 @@ const Error = ({
title = error.message;
text = (
<>
{capitalize(errorData.join(' '))}
{capitalize(error.data)}
{'. '}
{VEGA_DOCS_URL && (
<Link
@@ -199,6 +200,7 @@ const Error = ({
);
} else if (error.code === ClientErrors.INVALID_WALLET.code) {
title = error.message;
const errorData = error.data?.split('\n ') || [];
text = (
<span className="flex flex-col">
{errorData.map((str, i) => (
@@ -208,7 +210,7 @@ const Error = ({
);
} else {
title = error.message;
text = `${errorData.length ? errorData.join(' ') : text} (${error.code})`;
text = `${error.data || text} (${error.code})`;
}
}
libs/wallet/src/connectors/json-rpc-connector.ts
+25 -26
View File
@@ -8,8 +8,6 @@ const VERSION = 'v2';
export const ClientErrors = {
NO_SERVICE: new WalletError(t('No service'), 100),
NO_TOKEN: new WalletError(t('No token'), 101),
INVALID_RESPONSE: new WalletError(t('Something went wrong'), 102),
INVALID_WALLET: new WalletError(t('Wallet version invalid'), 103),
WRONG_NETWORK: new WalletError(
t('Wrong network'),
@@ -22,11 +20,6 @@ export const ClientErrors = {
t('Unknown error occurred')
),
NO_CLIENT: new WalletError(t('No client found.'), 106),
REQUEST_REJECTED: new WalletError(
t('Request rejected'),
107,
t('The request has been rejected by the user')
),
} as const;
export class JsonRpcConnector implements VegaConnector {
@@ -79,7 +72,11 @@ export class JsonRpcConnector implements VegaConnector {
const { result } = await this.client.GetChainId();
return result;
} catch (err) {
throw ClientErrors.INVALID_RESPONSE;
const {
code = ClientErrors.UNKNOWN.code,
message = ClientErrors.UNKNOWN.message,
} = err as WalletClientError;
throw new WalletError(message, code);
}
}
@@ -92,11 +89,11 @@ export class JsonRpcConnector implements VegaConnector {
await this.client.ConnectWallet();
return null;
} catch (err) {
const clientErr =
err instanceof WalletClientError && err.code === 3001
? ClientErrors.REQUEST_REJECTED
: ClientErrors.INVALID_RESPONSE;
throw clientErr;
const {
code = ClientErrors.UNKNOWN.code,
message = ClientErrors.UNKNOWN.message,
} = err as WalletClientError;
throw new WalletError(message, code);
}
}
@@ -111,7 +108,11 @@ export class JsonRpcConnector implements VegaConnector {
const { result } = await this.client.ListKeys();
return result.keys;
} catch (err) {
throw ClientErrors.INVALID_RESPONSE;
const {
code = ClientErrors.UNKNOWN.code,
message = ClientErrors.UNKNOWN.message,
} = err as WalletClientError;
throw new WalletError(message, code);
}
}
@@ -148,22 +149,20 @@ export class JsonRpcConnector implements VegaConnector {
const result = await fetch(`${this._url}/api/${this.version}/methods`);
if (!result.ok) {
const err = ClientErrors.INVALID_WALLET;
err.data = [
t(
'The version of the wallet service running at %s is not supported.',
this._url as string
),
t("It doesn't expose the API version %s.", this.version),
t(
'Update the wallet software to a version that expose the API version %s.',
this.version
),
];
const sent1 = t(
'The version of the wallet service running at %s is not supported.',
this._url as string
);
const sent2 = t(
'Update the wallet software to a version that expose the API version %s.',
this.version
);
err.data = `${sent1}\n ${sent2}`;
throw err;
}
return true;
} catch (err) {
if (err instanceof WalletError) {
if (err instanceof WalletClientError) {
throw err;
}
libs/wallet/src/connectors/vega-connector.ts
+6 -4
View File
@@ -1,3 +1,4 @@
import { WalletClientError } from '@vegaprotocol/wallet-client';
import type * as Schema from '@vegaprotocol/types';
export interface DelegateSubmissionBody {
@@ -329,12 +330,13 @@ export interface TransactionResponse {
receivedAt: string;
sentAt: string;
}
export class WalletError {
message: string;
code: number;
data?: string | string[];
export class WalletError extends WalletClientError {
override message: string;
override code: number;
data?: string;
constructor(message: string, code: number, data?: string) {
super({ code, message, data: data || '' });
this.message = message;
this.code = code;
this.data = data;
libs/wallet/src/provider.tsx
+2 -2
View File
@@ -1,6 +1,7 @@
import { LocalStorage } from '@vegaprotocol/react-helpers';
import type { ReactNode } from 'react';
import { useCallback, useMemo, useRef, useState } from 'react';
import { WalletClientError } from '@vegaprotocol/wallet-client';
import type { VegaWalletContextShape } from '.';
import type {
PubKey,
@@ -9,7 +10,6 @@ import type {
} from './connectors/vega-connector';
import { VegaWalletContext } from './context';
import { WALLET_KEY } from './storage';
import { WalletError } from './connectors/vega-connector';
import { ViewConnector } from './connectors';
interface VegaWalletProviderProps {
@@ -53,7 +53,7 @@ export const VegaWalletProvider = ({ children }: VegaWalletProviderProps) => {
return null;
}
} catch (err) {
if (err instanceof WalletError) {
if (err instanceof WalletClientError) {
throw err;
}
return null;
libs/wallet/src/use-json-rpc-connect.ts
+3 -3
View File
@@ -1,7 +1,7 @@
import { useCallback, useState } from 'react';
import { WalletClientError } from '@vegaprotocol/wallet-client';
import type { JsonRpcConnector } from './connectors';
import { ClientErrors } from './connectors';
import { WalletError } from './connectors';
import { useVegaWallet } from './use-vega-wallet';
export enum Status {
@@ -18,7 +18,7 @@ export enum Status {
export const useJsonRpcConnect = (onConnect: () => void) => {
const { connect } = useVegaWallet();
const [status, setStatus] = useState(Status.Idle);
const [error, setError] = useState<WalletError | null>(null);
const [error, setError] = useState<WalletClientError | null>(null);
const attemptConnect = useCallback(
async (connector: JsonRpcConnector, appChainId: string) => {
@@ -56,7 +56,7 @@ export const useJsonRpcConnect = (onConnect: () => void) => {
setStatus(Status.Connected);
onConnect();
} catch (err) {
if (err instanceof WalletError) {
if (err instanceof WalletClientError) {
setError(err);
}
setStatus(Status.Error);
libs/wallet/src/use-vega-transaction-manager.tsx
+1 -5
View File
@@ -1,7 +1,6 @@
import { useVegaWallet } from './use-vega-wallet';
import { useEffect, useRef } from 'react';
import { ClientErrors } from './connectors';
import { WalletError } from './connectors';
import { VegaTxStatus } from './use-vega-transaction';
import { useVegaTransactionStore } from './use-vega-transaction-store';
import { WalletClientError } from '@vegaprotocol/wallet-client';
@@ -40,10 +39,7 @@ export const useVegaTransactionManager = () => {
})
.catch((err) => {
update(transaction.id, {
error:
err instanceof WalletError || err instanceof WalletClientError
? err
: ClientErrors.UNKNOWN,
error: err instanceof WalletClientError ? err : ClientErrors.UNKNOWN,
status: VegaTxStatus.Error,
});
});
libs/wallet/src/use-vega-transaction.tsx
+2 -9
View File
@@ -6,8 +6,6 @@ import { VegaTransactionDialog } from './vega-transaction-dialog';
import type { Intent } from '@vegaprotocol/ui-toolkit';
import type { Transaction } from './connectors';
import { ClientErrors } from './connectors';
import { WalletError } from './connectors';
import type { WalletClientError } from '@vegaprotocol/wallet-client';
export interface DialogProps {
intent?: Intent;
@@ -26,7 +24,7 @@ export enum VegaTxStatus {
export interface VegaTxState {
status: VegaTxStatus;
error: WalletError | WalletClientError | Error | null;
error: Error | null;
txHash: string | null;
signature: string | null;
dialogOpen: boolean;
@@ -90,12 +88,7 @@ export const useVegaTransaction = () => {
return null;
} catch (err) {
const error =
err instanceof WalletError
? err
: err instanceof Error
? err
: ClientErrors.UNKNOWN;
const error = err instanceof Error ? err : ClientErrors.UNKNOWN;
setTransaction({
error: error,
status: VegaTxStatus.Error,
libs/wallet/src/vega-transaction-dialog/vega-transaction-dialog.tsx
+5 -6
View File
@@ -2,7 +2,8 @@ import { Networks, useEnvironment } from '@vegaprotocol/environment';
import { t } from '@vegaprotocol/react-helpers';
import { Dialog, Icon, Intent, Loader } from '@vegaprotocol/ui-toolkit';
import type { ReactNode } from 'react';
import { WalletError } from '../connectors';
import { WalletClientError } from '@vegaprotocol/wallet-client';
import type { WalletError } from '../connectors';
import type { VegaTxState } from '../use-vega-transaction';
import { VegaTxStatus } from '../use-vega-transaction';
@@ -109,14 +110,12 @@ export const VegaDialog = ({ transaction }: VegaDialogProps) => {
if (transaction.status === VegaTxStatus.Error) {
content = (
<div data-testid={transaction.status}>
{transaction.error instanceof WalletError && (
{transaction.error instanceof WalletClientError && (
<p>
{transaction.error.message}: {transaction.error.data}
{transaction.error.message}:{' '}
{(transaction.error as WalletError).data || ''}
</p>
)}
{transaction.error instanceof Error && (
<p>{transaction.error.message}</p>
)}
</div>
);
}