diff --git a/apps/trading/pages/index.page.tsx b/apps/trading/pages/index.page.tsx index 6245e1005..f939a27f0 100644 --- a/apps/trading/pages/index.page.tsx +++ b/apps/trading/pages/index.page.tsx @@ -1,7 +1,7 @@ import { Callout, Button } from '@vegaprotocol/ui-toolkit'; export function Index() { - const vegaWallet = useVegaWallet(); + const { publicKey, publicKeys, selectPublicKey } = useVegaWallet(); return (
- 
{JSON.stringify(vegaWallet, null, 2)}
+

Vega wallet

+ {publicKey &&

Current: {publicKey.pub}

} + {publicKeys?.length && ( + + )} +

Public keys

+ 
{JSON.stringify(publicKeys, null, 2)}
); } diff --git a/libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx b/libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx index 07e99a055..1e6faeb40 100644 --- a/libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx +++ b/libs/react-helpers/src/lib/vega-wallet/connect-dialog.tsx @@ -42,7 +42,6 @@ export function VegaConnectDialog({ {selectedConnector instanceof RestConnector ? ( { connectAndClose(selectedConnector); }} @@ -57,19 +56,7 @@ export function VegaConnectDialog({ }} > {Object.entries(connectors).map(([key, connector]) => ( - ))} diff --git a/libs/react-helpers/src/lib/vega-wallet/connectors.ts b/libs/react-helpers/src/lib/vega-wallet/connectors.ts index 4e7bc5a56..0785b0547 100644 --- a/libs/react-helpers/src/lib/vega-wallet/connectors.ts +++ b/libs/react-helpers/src/lib/vega-wallet/connectors.ts @@ -20,27 +20,6 @@ export class RestConnector implements VegaConnector { authMethods: { bearer: `Bearer ${LocalStorage.getItem('vega_wallet_token')}`, }, - promiseMiddleware: [ - { - pre: async (requestContext) => { - const headers = requestContext.getHeaders(); - if ( - 'Authorization' in headers && - headers['Authorization'] === 'Bearer null' - ) { - console.log('first login: getting and setting auth header'); - requestContext.setHeaderParam( - 'Authorization', - `Bearer ${LocalStorage.getItem('vega_wallet_token')}` - ); - } - return requestContext; - }, - post: async (requestContext) => { - return requestContext; - }, - }, - ], }); this.service = new DefaultApi(this.apiConfig); } @@ -57,12 +36,28 @@ export class RestConnector implements VegaConnector { } async connect() { - const res = await this.service.keysGet(); + const res = await this.service.keysGet( + // Needs token passed in in case its the users first session and there was no + // token stored + createConfiguration({ + authMethods: { + bearer: `Bearer ${LocalStorage.getItem('vega_wallet_token')}`, + }, + }) + ); return res.keys; } async disconnect() { - await this.service.authTokenDelete(); + await this.service.authTokenDelete( + // Needs token passed in in case its the users first session and there was no + // token stored + createConfiguration({ + authMethods: { + bearer: `Bearer ${LocalStorage.getItem('vega_wallet_token')}`, + }, + }) + ); LocalStorage.removeItem('vega_wallet_token'); } } diff --git a/libs/react-helpers/src/lib/vega-wallet/context.ts b/libs/react-helpers/src/lib/vega-wallet/context.ts index cc6f0dd17..e57872e5a 100644 --- a/libs/react-helpers/src/lib/vega-wallet/context.ts +++ b/libs/react-helpers/src/lib/vega-wallet/context.ts @@ -2,11 +2,27 @@ import { VegaKey } from '@vegaprotocol/vegawallet-service-api-client'; import { createContext } from 'react'; import { VegaConnector } from './connectors'; -interface VegaWalletContextShape { - publicKey: VegaKey | null; - publicKeys: VegaKey[] | null; +export interface VegaKeyExtended extends VegaKey { + name: string; +} + +export interface VegaWalletContextShape { + /** The current select public key */ + publicKey: VegaKeyExtended | null; + + /** Public keys stored in users wallet */ + publicKeys: VegaKeyExtended[] | null; + + /** Calls connect on the supplied connector, storing the returned keys */ connect: (connector: VegaConnector) => Promise; + + /** Disconnects from the connector and clears public key state */ disconnect: () => Promise; + + /** Sets the current selected public key */ + selectPublicKey: (publicKey: string) => void; + + /** Reference to the connector */ connector: VegaConnector | null; } diff --git a/libs/react-helpers/src/lib/vega-wallet/provider.tsx b/libs/react-helpers/src/lib/vega-wallet/provider.tsx index 99dc78be0..4fe842230 100644 --- a/libs/react-helpers/src/lib/vega-wallet/provider.tsx +++ b/libs/react-helpers/src/lib/vega-wallet/provider.tsx @@ -1,5 +1,5 @@ -import { VegaKey } from '@vegaprotocol/vegawallet-service-api-client'; import { ReactNode, useCallback, useMemo, useRef, useState } from 'react'; +import { VegaKeyExtended, VegaWalletContextShape } from '.'; import { VegaConnector } from './connectors'; import { VegaWalletContext } from './context'; @@ -8,16 +8,23 @@ interface VegaWalletProviderProps { } export const VegaWalletProvider = ({ children }: VegaWalletProviderProps) => { - const [publicKey, setPublicKey] = useState(null); - const [publicKeys, setPublicKeys] = useState(null); + const [publicKey, setPublicKey] = useState(null); + const [publicKeys, setPublicKeys] = useState(null); const connector = useRef(null); const connect = useCallback(async (c: VegaConnector) => { connector.current = c; try { - const res = await c.connect(); - setPublicKeys(res); - setPublicKey(res[0]); + const res = await connector.current.connect(); + const publicKeysWithName = res.map((pk) => { + const nameMeta = pk.meta?.find((m) => m.key === 'name'); + return { + ...pk, + name: nameMeta?.value ? nameMeta.value : 'None', + }; + }); + setPublicKeys(publicKeysWithName); + setPublicKey(publicKeysWithName[0]); } catch (err) { console.log('connect failed'); } @@ -34,15 +41,33 @@ export const VegaWalletProvider = ({ children }: VegaWalletProviderProps) => { } }, []); - const contextValue = useMemo(() => { + const selectPublicKey = useCallback( + (key: string) => { + if (!publicKeys || !publicKeys.length) { + return; + } + + const selectedKey = publicKeys.find((k) => k.pub === key); + + if (!selectedKey) { + throw new Error('Public key doesnt exist'); + } + + setPublicKey(selectedKey); + }, + [publicKeys] + ); + + const contextValue = useMemo(() => { return { publicKey, publicKeys, + selectPublicKey, connect, disconnect, connector: connector.current, }; - }, [publicKey, publicKeys, connect, disconnect, connector]); + }, [publicKey, publicKeys, selectPublicKey, connect, disconnect, connector]); return ( diff --git a/libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx b/libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx index b48799b5a..c69849f4f 100644 --- a/libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx +++ b/libs/react-helpers/src/lib/vega-wallet/rest-connector-form.tsx @@ -8,13 +8,11 @@ interface FormFields { interface RestConnectorFormProps { connector: RestConnector; - setDialogOpen: (isOpen: boolean) => void; onAuthenticate: () => void; } export function RestConnectorForm({ connector, - setDialogOpen, onAuthenticate, }: RestConnectorFormProps) { const { @@ -41,7 +39,7 @@ export function RestConnectorForm({ } return ( -
+