fix(explorer): fix nesting for test mock

Co-authored-by: Matthew Russell <mattrussell36@gmail.com>

apps/explorer/src/app/routes/oracles/Oracles.graphql

@@ -1,4 +1,34 @@
+fragment ExplorerOracleDataConnection on OracleSpec {
+  dataConnection {
+    edges {
+      node {
+        externalData {
+          data {
+            signers {
+              signer {
+                ... on ETHAddress {
+                  address
+                }
+                ... on PubKey {
+                  key
+                }
+              }
+            }
+            data {
+              name
+              value
+            }
+            matchedSpecIds
+            broadcastAt
+          }
+        }
+      }
+    }
+  }
+}
+
 fragment ExplorerOracleDataSource on OracleSpec {
+  ...ExplorerOracleDataConnection
   dataSourceSpec {
     spec {
       id
@@ -34,6 +64,7 @@ fragment ExplorerOracleDataSource on OracleSpec {
                   key {
                     name
                     type
+                    numberDecimalPlaces
                   }
                   conditions {
                     value
@@ -49,38 +80,6 @@ fragment ExplorerOracleDataSource on OracleSpec {
   }
 }
 
-fragment ExplorerOracleDataConnection on OracleSpec {
-  dataConnection {
-    pageInfo {
-      hasNextPage
-    }
-    edges {
-      node {
-        externalData {
-          data {
-            signers {
-              signer {
-                ... on ETHAddress {
-                  address
-                }
-                ... on PubKey {
-                  key
-                }
-              }
-            }
-            data {
-              name
-              value
-            }
-            matchedSpecIds
-            broadcastAt
-          }
-        }
-      }
-    }
-  }
-}
-
 query ExplorerOracleSpecs {
   oracleSpecsConnection(pagination: { first: 50 }) {
     pageInfo {
@@ -97,6 +96,5 @@ query ExplorerOracleSpecs {
 query ExplorerOracleSpecById($id: ID!) {
   oracleSpec(oracleSpecId: $id) {
     ...ExplorerOracleDataSource
-    ...ExplorerOracleDataConnection
   }
 }

apps/explorer/src/app/routes/oracles/__generated__/Oracles.ts

@@ -3,24 +3,55 @@ import * as Types from '@vegaprotocol/types';
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
-export type ExplorerOracleDataSourceFragment = { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } } };
+export type ExplorerOracleDataConnectionFragment = { __typename?: 'OracleSpec', dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
 
-export type ExplorerOracleDataConnectionFragment = { __typename?: 'OracleSpec', dataConnection: { __typename?: 'OracleDataConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
+export type ExplorerOracleDataSourceFragment = { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
 
 export type ExplorerOracleSpecsQueryVariables = Types.Exact<{ [key: string]: never; }>;
 
 
-export type ExplorerOracleSpecsQuery = { __typename?: 'Query', oracleSpecsConnection?: { __typename?: 'OracleSpecsConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleSpecEdge', node: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } } } } | null> | null } | null };
+export type ExplorerOracleSpecsQuery = { __typename?: 'Query', oracleSpecsConnection?: { __typename?: 'OracleSpecsConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleSpecEdge', node: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } } | null> | null } | null };
 
 export type ExplorerOracleSpecByIdQueryVariables = Types.Exact<{
   id: Types.Scalars['ID'];
 }>;
 
 
-export type ExplorerOracleSpecByIdQuery = { __typename?: 'Query', oracleSpec?: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } | null };
+export type ExplorerOracleSpecByIdQuery = { __typename?: 'Query', oracleSpec?: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } | null };
 
+export const ExplorerOracleDataConnectionFragmentDoc = gql`
+    fragment ExplorerOracleDataConnection on OracleSpec {
+  dataConnection {
+    edges {
+      node {
+        externalData {
+          data {
+            signers {
+              signer {
+                ... on ETHAddress {
+                  address
+                }
+                ... on PubKey {
+                  key
+                }
+              }
+            }
+            data {
+              name
+              value
+            }
+            matchedSpecIds
+            broadcastAt
+          }
+        }
+      }
+    }
+  }
+}
+    `;
 export const ExplorerOracleDataSourceFragmentDoc = gql`
     fragment ExplorerOracleDataSource on OracleSpec {
+  ...ExplorerOracleDataConnection
   dataSourceSpec {
     spec {
       id
@@ -56,6 +87,7 @@ export const ExplorerOracleDataSourceFragmentDoc = gql`
                   key {
                     name
                     type
+                    numberDecimalPlaces
                   }
                   conditions {
                     value
@@ -70,40 +102,7 @@ export const ExplorerOracleDataSourceFragmentDoc = gql`
     }
   }
 }
-    `;
-export const ExplorerOracleDataConnectionFragmentDoc = gql`
-    fragment ExplorerOracleDataConnection on OracleSpec {
-  dataConnection {
-    pageInfo {
-      hasNextPage
-    }
-    edges {
-      node {
-        externalData {
-          data {
-            signers {
-              signer {
-                ... on ETHAddress {
-                  address
-                }
-                ... on PubKey {
-                  key
-                }
-              }
-            }
-            data {
-              name
-              value
-            }
-            matchedSpecIds
-            broadcastAt
-          }
-        }
-      }
-    }
-  }
-}
-    `;
+    ${ExplorerOracleDataConnectionFragmentDoc}`;
 export const ExplorerOracleSpecsDocument = gql`
     query ExplorerOracleSpecs {
   oracleSpecsConnection(pagination: {first: 50}) {
@@ -149,11 +148,9 @@ export const ExplorerOracleSpecByIdDocument = gql`
     query ExplorerOracleSpecById($id: ID!) {
   oracleSpec(oracleSpecId: $id) {
     ...ExplorerOracleDataSource
-    ...ExplorerOracleDataConnection
   }
 }
-    ${ExplorerOracleDataSourceFragmentDoc}
-${ExplorerOracleDataConnectionFragmentDoc}`;
+    ${ExplorerOracleDataSourceFragmentDoc}`;
 
 /**
  * __useExplorerOracleSpecByIdQuery__

apps/explorer/src/app/routes/oracles/components/oracle-data.spec.tsx

@@ -1,23 +1,23 @@
 import { render } from '@testing-library/react';
 import { OracleData } from './oracle-data';
-import type { ExplorerOracleDataConnectionFragment } from '../__generated__/Oracles';
+import { type ExplorerOracleDataConnectionFragment } from '../__generated__/Oracles';
 
-function renderComponent(data: ExplorerOracleDataConnectionFragment) {
+type DataConnection = ExplorerOracleDataConnectionFragment['dataConnection'];
+
+function renderComponent(
+  data: ExplorerOracleDataConnectionFragment['dataConnection']
+) {
   return <OracleData data={data} />;
 }
 
 describe('Oracle Data view', () => {
   it('Renders nothing when data is null', () => {
-    const res = render(
-      renderComponent(null as unknown as ExplorerOracleDataConnectionFragment)
-    );
+    const res = render(renderComponent(null as unknown as DataConnection));
     expect(res.container).toBeEmptyDOMElement();
   });
 
   it('Renders nothing when dataConnection is empty', () => {
-    const res = render(
-      renderComponent({} as ExplorerOracleDataConnectionFragment)
-    );
+    const res = render(renderComponent({} as DataConnection));
     expect(res.container).toBeEmptyDOMElement();
   });
   it('Renders nothing when dataConnection has no edges', () => {
@@ -26,7 +26,7 @@ describe('Oracle Data view', () => {
         dataConnection: {
           edges: null,
         },
-      } as ExplorerOracleDataConnectionFragment)
+      } as DataConnection)
     );
     expect(res.container).toBeEmptyDOMElement();
   });
@@ -37,7 +37,7 @@ describe('Oracle Data view', () => {
         dataConnection: {
           edges: [],
         },
-      } as unknown as ExplorerOracleDataConnectionFragment)
+      } as unknown as DataConnection)
     );
     expect(res.container).toBeEmptyDOMElement();
   });
@@ -47,20 +47,18 @@ describe('Oracle Data view', () => {
   it('Renders details component when there is data', () => {
     const res = render(
       renderComponent({
-        dataConnection: {
-          edges: [
-            {
-              node: {
-                externalData: {
-                  data: {
-                    broadcastAt: '2022-01-01',
-                  },
+        edges: [
+          {
+            node: {
+              externalData: {
+                data: {
+                  broadcastAt: '2022-01-01',
                 },
               },
             },
-          ],
-        },
-      } as ExplorerOracleDataConnectionFragment)
+          },
+        ],
+      } as DataConnection)
     );
     expect(res.getByText('Broadcast data')).toBeInTheDocument();
   });

apps/explorer/src/app/routes/oracles/components/oracle-data.tsx

@@ -4,7 +4,7 @@ import filter from 'recursive-key-filter';
 import type { ExplorerOracleDataConnectionFragment } from '../__generated__/Oracles';
 
 interface OracleDataTypeProps {
-  data: ExplorerOracleDataConnectionFragment;
+  data: ExplorerOracleDataConnectionFragment['dataConnection'];
 }
 
 /**
@@ -14,12 +14,7 @@ interface OracleDataTypeProps {
  * that Does The Job, rather than because it's good.
  */
 export function OracleData({ data }: OracleDataTypeProps) {
-  if (
-    !data ||
-    !data.dataConnection ||
-    !data.dataConnection.edges?.length ||
-    data.dataConnection.edges.length > 1
-  ) {
+  if (!data || !data.edges?.length || data.edges.length > 1) {
     return null;
   }
 
@@ -27,7 +22,7 @@ export function OracleData({ data }: OracleDataTypeProps) {
     <details data-testid="oracle-data">
       <summary>{t('Broadcast data')}</summary>
       <ul>
-        {data.dataConnection.edges.map((d) => {
+        {data.edges.map((d) => {
           if (!d) {
             return null;
           }

apps/explorer/src/app/routes/oracles/components/oracle-markets.tsx

@@ -27,8 +27,8 @@ export function OracleMarkets({ id }: OracleMarketsProps) {
     const m = markets.find((m) => {
       const p = m.tradableInstrument.instrument.product;
       if (
-        p.dataSourceSpecForSettlementData.id === id ||
-        p.dataSourceSpecForTradingTermination.id === id
+        p?.dataSourceSpecForSettlementData?.id === id ||
+        p?.dataSourceSpecForTradingTermination?.id === id
       ) {
         return true;
       }
@@ -36,15 +36,9 @@ export function OracleMarkets({ id }: OracleMarketsProps) {
     });
 
     if (m && m.id) {
-      const type =
-        id ===
-        m.tradableInstrument.instrument.product.dataSourceSpecForSettlementData
-          .id
-          ? 'Settlement for'
-          : 'Termination for';
       return (
         <TableRow modifier="bordered">
-          <TableHeader scope="row">{type}</TableHeader>
+          <TableHeader scope="row">{getLabel(id, m)}</TableHeader>
           <TableCell modifier="bordered" data-testid={`m-${m.id}`}>
             <MarketLink id={m.id} />
           </TableCell>
@@ -61,3 +55,14 @@ export function OracleMarkets({ id }: OracleMarketsProps) {
     </TableRow>
   );
 }
+
+export function getLabel(
+  id: string,
+  m: ExplorerOracleForMarketsMarketFragment | null
+): string {
+  const settlementId =
+    m?.tradableInstrument?.instrument?.product?.dataSourceSpecForSettlementData
+      ?.id || null;
+
+  return id === settlementId ? 'Settlement for' : 'Termination for';
+}

apps/explorer/src/app/routes/oracles/components/oracle.tsx

@@ -22,7 +22,7 @@ export type SourceType =
 interface OracleDetailsProps {
   id: string;
   dataSource: ExplorerOracleDataSourceFragment;
-  dataConnection?: ExplorerOracleDataConnectionFragment;
+  dataConnection: ExplorerOracleDataConnectionFragment['dataConnection'];
   // Defaults to false. Hides the count of 'broadcasts' this oracle has seen
   showBroadcasts?: boolean;
 }
@@ -41,8 +41,7 @@ export const OracleDetails = ({
   showBroadcasts = false,
 }: OracleDetailsProps) => {
   const sourceType = dataSource.dataSourceSpec.spec.data.sourceType;
-  const reportsCount: number =
-    dataConnection?.dataConnection.edges?.length || 0;
+  const reportsCount: number = dataConnection.edges?.length || 0;
 
   return (
     <div>

apps/explorer/src/app/routes/oracles/home/index.tsx

@@ -34,11 +34,15 @@ const Oracles = () => {
               if (!id) {
                 return null;
               }
+
+              const dataConnection = o?.node.dataConnection;
+
               return (
                 <div id={id} key={id} className="mb-10">
                   <OracleDetails
                     id={id}
                     dataSource={o?.node}
+                    dataConnection={dataConnection}
                     showBroadcasts={false}
                   />
                   <details>

apps/explorer/src/app/routes/oracles/id/index.tsx

@@ -39,7 +39,7 @@ export const Oracle = () => {
             <OracleDetails
               id={id || ''}
               dataSource={data?.oracleSpec}
-              dataConnection={data?.oracleSpec}
+              dataConnection={data?.oracleSpec.dataConnection}
               showBroadcasts={true}
             />
             <details>

apps/governance/.env

@@ -22,8 +22,6 @@ NX_VEGA_REST_URL=https://api.n00.stagnet1.vega.xyz/api/v2/
 NX_TENDERMINT_URL=https://tm.n01.stagnet1.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n01.stagnet1.vega.xyz/websocket
 
-NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false

apps/governance/.env.capsule

@@ -19,6 +19,9 @@ NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
 NX_VEGA_REST_URL=http://localhost:3008/api/v2/
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 NX_TENDERMINT_URL=http://localhost:26617
 NX_TENDERMINT_WEBSOCKET_URL=wss://localhost:26617/websocket
 
@@ -26,4 +29,4 @@ NX_TENDERMINT_WEBSOCKET_URL=wss://localhost:26617/websocket
 CYPRESS_FAIRGROUND=false
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=false

apps/governance/.env.devnet

@@ -14,8 +14,11 @@ NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/annou
 NX_VEGA_REST_URL=https://api.n00.devnet1.vega.xyz/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 NX_TENDERMINT_URL=https://tm.be.devnet1.vega.xyz/
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.devnet1.vega.xyz/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=true
+NX_SUCCESSOR_MARKETS=true

apps/governance/.env.mainnet

@@ -14,9 +14,11 @@ NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-mainnet-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_REST_URL=https://api.vega.community/api/v2/
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://be.vega.community
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.vega.community/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=false

apps/governance/.env.mainnet-mirror

@@ -13,9 +13,11 @@ NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-mainnet-mirror-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_REST_URL=https://api.mainnet-mirror.vega.rocks/api/v2/
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://be.mainnet-mirror.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.mainnet-mirror.vega.rocks/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=false

apps/governance/.env.stagnet1

@@ -10,8 +10,11 @@ NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_REST_URL=https://api.n00.stagnet1.vega.xyz/api/v2/
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 NX_TENDERMINT_URL=https://tm.n01.stagnet1.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n01.stagnet1.vega.xyz/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=true
+NX_SUCCESSOR_MARKETS=true

apps/governance/.env.testnet

@@ -15,8 +15,11 @@ NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/annou
 NX_VEGA_REST_URL=https://api.n07.testnet.vega.xyz/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 NX_TENDERMINT_URL=https://tm.be.testnet.vega.xyz
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=true
+NX_SUCCESSOR_MARKETS=true

apps/governance/.env.validators-testnet

@@ -12,8 +12,11 @@ NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/annou
 NX_VEGA_REST_URL=https://api-validators-testnet.vega.rocks/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 NX_TENDERMINT_URL=https://tm.be.validators-testnet.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.validators-testnet.vega.
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=false
+NX_SUCCESSOR_MARKETS=false

apps/trading-e2e/.env

@@ -36,4 +36,4 @@ CYPRESS_VEGA_WALLET_API_TOKEN=
 
 # Cosmic elevator flags (MUST be doubled with CYPRESS_ prefix)
 NX_SUCCESSOR_MARKETS=true
-CYPRESS_NX_SUCCESSOR_MARKETS=true
+CYPRESS_NX_SUCCESSOR_MARKETS=true

apps/trading-e2e/src/integration/trading-deal-ticket-basics.cy.ts

@@ -23,7 +23,7 @@ describe('deal ticket basics', { tags: '@smoke' }, () => {
     // 0003-WTXN-001
     cy.getByTestId('connect-vega-wallet'); // Not connected
     cy.getByTestId(placeOrderBtn).should('exist');
-    cy.getByTestId('get-started-button').should('exist');
+    cy.getByTestId('order-connect-wallet').should('exist');
   });
 
   it('must be able to select order direction - long/short', function () {
@@ -44,7 +44,7 @@ describe('deal ticket basics', { tags: '@smoke' }, () => {
     mockConnectWallet();
     cy.getByTestId(toggleLimit).click();
     cy.getByTestId(orderPriceField).clear().type('101');
-    cy.getByTestId('get-started-button').click();
+    cy.getByTestId('order-connect-wallet').click();
     cy.getByTestId('dialog-content').should('be.visible');
     cy.getByTestId('connectors-list')
       .find('[data-testid="connector-jsonRpc"]')

apps/trading/.env

@@ -12,8 +12,7 @@ NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/main/announcements.json
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72
-NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true

apps/trading/.env.capsule

@@ -12,6 +12,8 @@ NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/test/announcements.json
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_ETH_LOCAL_PROVIDER_URL=http://localhost:8545/
 NX_ETH_WALLET_MNEMONIC="ozone access unlock valid olympic save include omit supply green clown session"

apps/trading/.env.devnet

@@ -13,6 +13,8 @@ NX_VEGA_DOCS_URL=#
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega-dev-releases/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true

apps/trading/.env.mainnet

@@ -13,6 +13,8 @@ NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
 NX_VEGA_CONSOLE_URL=https://console.vega.xyz
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-mainnet/codfcglpplgmmlokgilfkpcjnmkbfiel
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet-mainnet
 # TAG name of the current app version - TODO: bump to the latest upon release
 NX_APP_VERSION=v0.20.21-core-0.71.6
 

apps/trading/.env.mainnet-mirror

@@ -13,6 +13,8 @@ NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
 NX_VEGA_CONSOLE_URL=https://console.mainnet-mirror.vega.rocks
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-mainnet/codfcglpplgmmlokgilfkpcjnmkbfiel
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet-mainnet
 # TAG name of the current app version - TODO: bump to the latest upon release
 NX_APP_VERSION=v0.20.19-core-0.71.6
 

apps/trading/.env.stagnet1

@@ -13,9 +13,11 @@ NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true
 NX_STOP_ORDERS=true
 # NX_ICEBERG_ORDERS
-# NX_PRODUCT_PERPETUALS
+# NX_PRODUCT_PERPETUALS

apps/trading/.env.testnet

@@ -14,6 +14,8 @@ NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
 NX_VEGA_CONSOLE_URL=https://console.fairground.wtf
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true
@@ -22,4 +24,4 @@ NX_ICEBERG_ORDERS=true
 # NX_PRODUCT_PERPETUALS
 
 NX_TENDERMINT_URL=https://tm.be.testnet.vega.xyz
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket

apps/trading/.env.validators-testnet

@@ -15,6 +15,9 @@ NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/annou
 NX_VEGA_INCIDENT_URL=https://blog.vega.xyz/tagged/vega-incident-reports
 NX_VEGA_CONSOLE_URL=https://trading.validators-testnet.vega.rocks
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=false
 NX_STOP_ORDERS=false

apps/trading/components/constants.ts

@@ -1,10 +1,2 @@
-import { t } from '@vegaprotocol/i18n';
-
 export const THROTTLE_UPDATE_TIME = 500;
 export const ONBOARDING_VIEWED_KEY = 'vega_onboarding_viewed';
-export const MAINNET_WELCOME_HEADER = t(
-  'Trade cash settled futures on the fully decentralised Vega network.'
-);
-export const TESTNET_WELCOME_HEADER = t(
-  'Try out trading cash settled futures on the fully decentralised Vega network (Testnet).'
-);

apps/trading/components/market-banner/market-successor-proposal-banner.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { Fragment, useState } from 'react';
 import type {
   SuccessorProposalListFieldsFragment,
   NewMarketSuccessorFieldsFragment,
@@ -52,7 +52,7 @@ export const MarketSuccessorProposalBanner = ({
               TOKEN_PROPOSAL.replace(':id', item.id || '')
             );
             return (
-              <>
+              <Fragment key={i}>
                 <ExternalLink href={externalLink} key={i}>
                   {
                     (item.terms?.change as NewMarketSuccessorFieldsFragment)
@@ -60,7 +60,7 @@ export const MarketSuccessorProposalBanner = ({
                   }
                 </ExternalLink>
                 {i < successors.length - 1 && ', '}
-              </>
+              </Fragment>
             );
           })}
         </div>

apps/trading/components/market-header/market-header.tsx

@@ -3,7 +3,7 @@ import { Header, HeaderTitle } from '../header';
 import { useParams } from 'react-router-dom';
 import { MarketSelector } from '../../components/market-selector/market-selector';
 import { MarketHeaderStats } from '../../client-pages/market/market-header-stats';
-import { useMarket } from '@vegaprotocol/markets';
+import { useMarket, useMarketList } from '@vegaprotocol/markets';
 import { useState } from 'react';
 
 export const MarketHeader = () => {
@@ -11,6 +11,10 @@ export const MarketHeader = () => {
   const { data } = useMarket(marketId);
   const [open, setOpen] = useState(false);
 
+  // Ensure that markets are kept cached so opening the list
+  // shows all markets instantly
+  useMarketList();
+
   if (!data) return null;
 
   return (

apps/trading/components/market-selector/market-selector.spec.tsx

@@ -132,6 +132,7 @@ describe('MarketSelector', () => {
     data: markets,
     loading: false,
     error: undefined,
+    reload: jest.fn(),
   });
 
   it('Button "All" should be selected by default', () => {

apps/trading/components/market-selector/market-selector.tsx

@@ -1,6 +1,6 @@
 import { t } from '@vegaprotocol/i18n';
 import uniqBy from 'lodash/uniqBy';
-import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/markets';
+import { type MarketMaybeWithDataAndCandles } from '@vegaprotocol/markets';
 import {
   TradingInput,
   TinyScroll,
@@ -8,7 +8,7 @@ import {
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
 import type { CSSProperties } from 'react';
-import { useCallback, useState, useMemo, useRef } from 'react';
+import { useCallback, useState, useMemo, useRef, useEffect } from 'react';
 import { FixedSizeList } from 'react-window';
 import { useMarketSelectorList } from './use-market-selector-list';
 import type { ProductType } from './product-selector';
@@ -44,7 +44,12 @@ export const MarketSelector = ({
     assets: [],
   });
   const allProducts = filter.product === Product.All;
-  const { markets, data, loading, error } = useMarketSelectorList(filter);
+  const { markets, data, loading, error, reload } =
+    useMarketSelectorList(filter);
+
+  useEffect(() => {
+    reload();
+  }, [reload]);
 
   return (
     <div data-testid="market-selector">

apps/trading/components/market-selector/sort-dropdown.tsx

@@ -15,6 +15,7 @@ export const Sort = {
   Gained: 'Gained',
   Lost: 'Lost',
   New: 'New',
+  TopTraded: 'TopTraded',
 } as const;
 
 export type SortType = keyof typeof Sort;
@@ -26,6 +27,7 @@ export const SortTypeMapping: {
   [Sort.Gained]: 'Top gaining',
   [Sort.Lost]: 'Top losing',
   [Sort.New]: 'New markets',
+  [Sort.TopTraded]: 'Top traded',
 };
 
 const SortIconMapping: {
@@ -35,6 +37,7 @@ const SortIconMapping: {
   [Sort.Gained]: VegaIconNames.TREND_UP,
   [Sort.Lost]: VegaIconNames.TREND_DOWN,
   [Sort.New]: VegaIconNames.STAR,
+  [Sort.TopTraded]: VegaIconNames.ARROW_UP,
 };
 
 export const SortDropdown = ({

apps/trading/components/market-selector/use-market-selector-list.ts

@@ -1,7 +1,11 @@
 import { useMemo } from 'react';
 import orderBy from 'lodash/orderBy';
 import { MarketState } from '@vegaprotocol/types';
-import { calcCandleVolume, useMarketList } from '@vegaprotocol/markets';
+import {
+  calcCandleVolume,
+  calcTradedFactor,
+  useMarketList,
+} from '@vegaprotocol/markets';
 import { priceChangePercentage } from '@vegaprotocol/utils';
 import type { Filter } from '../../components/market-selector/market-selector';
 import { Sort } from './sort-dropdown';
@@ -20,7 +24,7 @@ export const useMarketSelectorList = ({
   sort,
   searchTerm,
 }: Filter) => {
-  const { data, loading, error } = useMarketList();
+  const { data, loading, error, reload } = useMarketList();
 
   const markets = useMemo(() => {
     if (!data?.length) return [];
@@ -94,10 +98,14 @@ export const useMarketSelectorList = ({
       );
     }
 
+    if (sort === Sort.TopTraded) {
+      return orderBy(markets, [(m) => calcTradedFactor(m)], ['desc']);
+    }
+
     return markets;
   }, [data, product, searchTerm, assets, sort]);
 
-  return { markets, data, loading, error };
+  return { markets, data, loading, error, reload };
 };
 
 export const isMarketActive = (state: MarketState) => {

apps/trading/components/navbar/nav-header.tsx

@@ -1,6 +1,6 @@
 import { VegaIcon, VegaIconNames } from '@vegaprotocol/ui-toolkit';
 import { MarketSelector } from '../market-selector';
-import { useMarket } from '@vegaprotocol/markets';
+import { useMarket, useMarketList } from '@vegaprotocol/markets';
 import { t } from '@vegaprotocol/i18n';
 import { useParams } from 'react-router-dom';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
@@ -14,6 +14,10 @@ export const NavHeader = () => {
   const { data } = useMarket(marketId);
   const [open, setOpen] = useState(false);
 
+  // Ensure that markets are kept cached so opening the list
+  // shows all markets instantly
+  useMarketList();
+
   if (!marketId) return null;
 
   return (

apps/trading/components/welcome-dialog/get-started.spec.tsx

@@ -1,16 +1,36 @@
+import { MemoryRouter } from 'react-router-dom';
 import type { VegaWalletContextShape } from '@vegaprotocol/wallet';
 import { VegaWalletContext } from '@vegaprotocol/wallet';
 import { GetStarted } from './get-started';
 import { render, screen } from '@testing-library/react';
 
+let mockStep = 1;
+jest.mock('./use-get-onboarding-step', () => ({
+  ...jest.requireActual('./use-get-onboarding-step'),
+  useGetOnboardingStep: jest.fn(() => mockStep),
+}));
+
 describe('GetStarted', () => {
   const renderComponent = (context: Partial<VegaWalletContextShape> = {}) => {
     return render(
-      <VegaWalletContext.Provider value={context as VegaWalletContextShape}>
-        <GetStarted />
-      </VegaWalletContext.Provider>
+      <MemoryRouter>
+        <VegaWalletContext.Provider value={context as VegaWalletContextShape}>
+          <GetStarted />
+        </VegaWalletContext.Provider>
+      </MemoryRouter>
     );
   };
+  const checkTicks = (elements: Element[]) => {
+    elements.forEach((item, i) => {
+      if (i + 1 < mockStep) {
+        expect(item.querySelector('[data-testid="icon-tick"]')).toBeTruthy();
+      }
+    });
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
 
   it('renders full get started content if not connected and no browser wallet detected', () => {
     renderComponent();
@@ -20,12 +40,71 @@ describe('GetStarted', () => {
   it('renders connect prompt if no pubKey but wallet installed', () => {
     globalThis.window.vega = {} as Vega;
     renderComponent();
-    expect(screen.getByTestId('order-connect-wallet')).toBeInTheDocument();
+    expect(screen.getByTestId('get-started-banner')).toBeInTheDocument();
     globalThis.window.vega = undefined as unknown as Vega;
   });
 
   it('renders nothing if connected', () => {
+    mockStep = 0;
     const { container } = renderComponent({ pubKey: 'my-pubkey' });
     expect(container).toBeEmptyDOMElement();
   });
+
+  it('steps should be ticked', () => {
+    const navigatorGetter: jest.SpyInstance = jest.spyOn(
+      window.navigator,
+      'userAgent',
+      'get'
+    );
+    navigatorGetter.mockReturnValue('Chrome');
+    mockStep = 1;
+    const { rerender, container } = renderComponent();
+    expect(screen.queryByTestId('icon-tick')).not.toBeInTheDocument();
+    expect(screen.getByTestId('get-wallet-button')).toBeInTheDocument();
+
+    mockStep = 2;
+    rerender(
+      <MemoryRouter>
+        <VegaWalletContext.Provider value={{} as VegaWalletContextShape}>
+          <GetStarted />
+        </VegaWalletContext.Provider>
+      </MemoryRouter>
+    );
+    checkTicks(screen.getAllByRole('listitem'));
+    expect(screen.getByRole('button', { name: 'Connect' })).toBeInTheDocument();
+
+    mockStep = 3;
+    rerender(
+      <MemoryRouter>
+        <VegaWalletContext.Provider value={{} as VegaWalletContextShape}>
+          <GetStarted />
+        </VegaWalletContext.Provider>
+      </MemoryRouter>
+    );
+    checkTicks(screen.getAllByRole('listitem'));
+    expect(screen.getByRole('button', { name: 'Deposit' })).toBeInTheDocument();
+
+    mockStep = 4;
+    rerender(
+      <MemoryRouter>
+        <VegaWalletContext.Provider value={{} as VegaWalletContextShape}>
+          <GetStarted />
+        </VegaWalletContext.Provider>
+      </MemoryRouter>
+    );
+    checkTicks(screen.getAllByRole('listitem'));
+    expect(screen.getByRole('button', { name: 'Dismiss' })).toBeInTheDocument();
+
+    mockStep = 5;
+    rerender(
+      <MemoryRouter>
+        <VegaWalletContext.Provider
+          value={{ pubKey: 'my-pubkey' } as VegaWalletContextShape}
+        >
+          <GetStarted />
+        </VegaWalletContext.Provider>
+      </MemoryRouter>
+    );
+    expect(container).toBeEmptyDOMElement();
+  });
 });

apps/trading/components/welcome-dialog/get-started.tsx

@@ -1,36 +1,96 @@
 import classNames from 'classnames';
 import { t } from '@vegaprotocol/i18n';
-import { ExternalLink, Intent, TradingButton } from '@vegaprotocol/ui-toolkit';
 import {
+  ExternalLink,
+  Intent,
+  TradingButton,
+  VegaIcon,
+  VegaIconNames,
+} from '@vegaprotocol/ui-toolkit';
+import {
+  GetWalletButton,
   useVegaWallet,
   useVegaWalletDialogStore,
-  isBrowserWalletInstalled,
 } from '@vegaprotocol/wallet';
 import { Networks, useEnvironment } from '@vegaprotocol/environment';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
+import { useNavigate } from 'react-router-dom';
+import {
+  OnboardingStep,
+  useGetOnboardingStep,
+} from './use-get-onboarding-step';
+import { Links, Routes } from '../../pages/client-router';
+import { useGlobalStore } from '../../stores';
+import { useSidebar, ViewType } from '../sidebar';
 import * as constants from '../constants';
 
 interface Props {
   lead?: string;
 }
 
-export const GetStarted = ({ lead }: Props) => {
-  const { pubKey } = useVegaWallet();
-  const { VEGA_ENV, VEGA_NETWORKS } = useEnvironment();
-  const CANONICAL_URL = VEGA_NETWORKS[VEGA_ENV] || 'https://console.vega.xyz';
-
+const GetStartedButton = ({ step }: { step: OnboardingStep }) => {
+  const navigate = useNavigate();
   const [, setOnboardingViewed] = useLocalStorage(
     constants.ONBOARDING_VIEWED_KEY
   );
 
+  const update = useGlobalStore((store) => store.update);
+  const marketId = useGlobalStore((store) => store.marketId);
+  const link = marketId ? Links[Routes.MARKET](marketId) : Links[Routes.HOME]();
+  const openVegaWalletDialog = useVegaWalletDialogStore(
+    (store) => store.openVegaWalletDialog
+  );
+  const setView = useSidebar((store) => store.setView);
+  let buttonText = t('Get started');
+  let onClickHandle = () => {
+    openVegaWalletDialog();
+  };
+  if (step === OnboardingStep.ONBOARDING_WALLET_STEP) {
+    return <GetWalletButton className="justify-between" />;
+  } else if (step === OnboardingStep.ONBOARDING_CONNECT_STEP) {
+    buttonText = t('Connect');
+  } else if (step === OnboardingStep.ONBOARDING_DEPOSIT_STEP) {
+    buttonText = t('Deposit');
+    onClickHandle = () => {
+      navigate(link);
+      setView({ type: ViewType.Deposit });
+      update({ onBoardingDismissed: true });
+    };
+  } else if (step === OnboardingStep.ONBOARDING_ORDER_STEP) {
+    buttonText = t('Dismiss');
+    onClickHandle = () => {
+      navigate(link);
+      setView({ type: ViewType.Order });
+      setOnboardingViewed('true');
+    };
+  }
+
+  return (
+    <TradingButton
+      onClick={onClickHandle}
+      size="small"
+      data-testid="get-started-button"
+      intent={Intent.Info}
+    >
+      {buttonText}
+    </TradingButton>
+  );
+};
+
+export const GetStarted = ({ lead }: Props) => {
+  const { pubKey } = useVegaWallet();
+  const { VEGA_ENV, VEGA_NETWORKS } = useEnvironment();
+  const CANONICAL_URL = VEGA_NETWORKS[VEGA_ENV] || 'https://console.vega.xyz';
+  const [onBoardingViewed] = useLocalStorage(constants.ONBOARDING_VIEWED_KEY);
+  const currentStep = useGetOnboardingStep();
   const openVegaWalletDialog = useVegaWalletDialogStore(
     (store) => store.openVegaWalletDialog
   );
 
-  const onButtonClick = () => {
-    openVegaWalletDialog();
-    setOnboardingViewed('true');
-  };
+  const getStartedNeeded =
+    onBoardingViewed !== 'true' &&
+    currentStep &&
+    currentStep < OnboardingStep.ONBOARDING_COMPLETE_STEP;
 
   const wrapperClasses = classNames(
     'flex flex-col py-4 px-6 gap-4 rounded',
@@ -39,27 +99,48 @@ export const GetStarted = ({ lead }: Props) => {
     { 'mt-8': !lead }
   );
 
-  if (!pubKey && !isBrowserWalletInstalled()) {
+  if (getStartedNeeded) {
     return (
       <div className={wrapperClasses} data-testid="get-started-banner">
         {lead && <h2>{lead}</h2>}
         <h3 className="text-lg">{t('Get started')}</h3>
         <div>
-          <ul className="list-decimal list-inside">
-            <li>{t('Get a Vega wallet')}</li>
-            <li>{t('Connect')}</li>
-            <li>{t('Deposit funds')}</li>
-            <li>{t('Open a position')}</li>
+          <ul className="list-inside -ml-5" role="list">
+            <li className="flex">
+              <div className="w-5">
+                {currentStep > OnboardingStep.ONBOARDING_WALLET_STEP && (
+                  <VegaIcon name={VegaIconNames.TICK} size={20} />
+                )}
+              </div>
+              <div className="ml-1">1. {t('Get a Vega wallet')}</div>
+            </li>
+            <li className="flex">
+              <div className="w-5">
+                {(currentStep > OnboardingStep.ONBOARDING_CONNECT_STEP ||
+                  pubKey) && <VegaIcon name={VegaIconNames.TICK} size={20} />}
+              </div>
+              <div className="ml-1">2. {t('Connect')}</div>
+            </li>
+            <li className="flex">
+              <div className="w-5">
+                {currentStep > OnboardingStep.ONBOARDING_DEPOSIT_STEP && (
+                  <VegaIcon name={VegaIconNames.TICK} size={20} />
+                )}
+              </div>
+              <div className="ml-1">3. {t('Deposit funds')}</div>
+            </li>
+            <li className="flex">
+              <div className="w-5">
+                {currentStep > OnboardingStep.ONBOARDING_ORDER_STEP && (
+                  <VegaIcon name={VegaIconNames.TICK} size={20} />
+                )}
+              </div>
+              <div className="ml-1">4. {t('Open a position')}</div>
+            </li>
           </ul>
         </div>
         <div>
-          <TradingButton
-            intent={Intent.Info}
-            onClick={onButtonClick}
-            data-testid="get-started-button"
-          >
-            {t('Get started')}
-          </TradingButton>
+          <GetStartedButton step={currentStep} />
         </div>
         {VEGA_ENV === Networks.MAINNET && (
           <p className="text-sm">

apps/trading/components/welcome-dialog/use-get-onboarding-step.spec.tsx

@@ -0,0 +1,97 @@
+import type { ReactNode } from 'react';
+import { renderHook } from '@testing-library/react';
+import {
+  useGetOnboardingStep,
+  OnboardingStep,
+} from './use-get-onboarding-step';
+import type { VegaWalletContextShape } from '@vegaprotocol/wallet';
+import { VegaWalletContext } from '@vegaprotocol/wallet';
+import { useDataProvider } from '@vegaprotocol/data-provider';
+import { depositsProvider } from '@vegaprotocol/deposits';
+import { aggregatedAccountsDataProvider } from '@vegaprotocol/accounts';
+import { ordersWithMarketProvider } from '@vegaprotocol/orders';
+import { positionsDataProvider } from '@vegaprotocol/positions';
+
+let mockData: object[] | null = [{ id: 'item-id' }];
+jest.mock('@vegaprotocol/data-provider', () => ({
+  ...jest.requireActual('@vegaprotocol/data-provider'),
+  useDataProvider: jest.fn(() => ({ data: mockData })),
+}));
+
+let mockContext: Partial<VegaWalletContextShape> = { pubKey: 'test-pubkey' };
+
+describe('useGetOnboardingStep', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockData = [{ id: 'item-id' }];
+    mockContext = { pubKey: 'test-pubkey' };
+    globalThis.window.vega = {} as Vega;
+  });
+
+  const wrapper = ({ children }: { children: ReactNode }) => (
+    <VegaWalletContext.Provider
+      value={mockContext as unknown as VegaWalletContextShape}
+    >
+      {children}
+    </VegaWalletContext.Provider>
+  );
+
+  it('should return properly ONBOARDING_UNKNOWN_STEP', () => {
+    mockData = null;
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    expect(result.current).toEqual(OnboardingStep.ONBOARDING_UNKNOWN_STEP);
+  });
+
+  it('should return properly ONBOARDING_WALLET_STEP', () => {
+    // @ts-ignore test only purpose
+    globalThis.window.vega = undefined;
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    expect(result.current).toEqual(OnboardingStep.ONBOARDING_WALLET_STEP);
+  });
+
+  it('should return properly ONBOARDING_CONNECT_STEP', () => {
+    mockContext = { pubKey: null };
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    expect(result.current).toEqual(OnboardingStep.ONBOARDING_CONNECT_STEP);
+  });
+
+  it('should return properly ONBOARDING_DEPOSIT_STEP', async () => {
+    (useDataProvider as jest.Mock).mockImplementation((args) => {
+      if (
+        args.dataProvider === depositsProvider ||
+        args.dataProvider === aggregatedAccountsDataProvider
+      ) {
+        return { data: [] };
+      }
+      return { data: mockData };
+    });
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    await expect(result.current).toEqual(
+      OnboardingStep.ONBOARDING_DEPOSIT_STEP
+    );
+  });
+
+  it('should return properly ONBOARDING_ORDER_STEP', async () => {
+    (useDataProvider as jest.Mock).mockImplementation((args) => {
+      if (
+        args.dataProvider === ordersWithMarketProvider ||
+        args.dataProvider === positionsDataProvider
+      ) {
+        return { data: [] };
+      }
+      return { data: mockData };
+    });
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    await expect(result.current).toEqual(OnboardingStep.ONBOARDING_ORDER_STEP);
+  });
+
+  it('should return properly ONBOARDING_COMPLETE_STEP', async () => {
+    (useDataProvider as jest.Mock).mockImplementation(() => {
+      return { data: mockData };
+    });
+    const { result } = renderHook(() => useGetOnboardingStep(), { wrapper });
+    await expect(result.current).toEqual(
+      OnboardingStep.ONBOARDING_COMPLETE_STEP
+    );
+  });
+});

apps/trading/components/welcome-dialog/use-get-onboarding-step.ts

@@ -0,0 +1,82 @@
+import { isBrowserWalletInstalled, useVegaWallet } from '@vegaprotocol/wallet';
+import { depositsProvider } from '@vegaprotocol/deposits';
+import { useDataProvider } from '@vegaprotocol/data-provider';
+import { ordersWithMarketProvider } from '@vegaprotocol/orders';
+import * as Types from '@vegaprotocol/types';
+import { aggregatedAccountsDataProvider } from '@vegaprotocol/accounts';
+import { positionsDataProvider } from '@vegaprotocol/positions';
+import { useGlobalStore } from '../../stores';
+
+export enum OnboardingStep {
+  ONBOARDING_UNKNOWN_STEP,
+  ONBOARDING_WALLET_STEP,
+  ONBOARDING_CONNECT_STEP,
+  ONBOARDING_DEPOSIT_STEP,
+  ONBOARDING_ORDER_STEP,
+  ONBOARDING_COMPLETE_STEP,
+}
+
+export const useGetOnboardingStep = () => {
+  const connecting = useGlobalStore((store) => store.eagerConnecting);
+  const { pubKey = '', pubKeys } = useVegaWallet();
+  const { data: depositsData } = useDataProvider({
+    dataProvider: depositsProvider,
+    variables: { partyId: pubKey || '' },
+    skip: !pubKey,
+  });
+  const { data: collateralData } = useDataProvider({
+    dataProvider: aggregatedAccountsDataProvider,
+    variables: { partyId: pubKey || '' },
+    skip: !pubKey,
+  });
+  const collaterals = Boolean(collateralData?.length);
+  const deposits =
+    depositsData?.some(
+      (item) => item.status === Types.DepositStatus.STATUS_FINALIZED
+    ) || false;
+  const { data: ordersData } = useDataProvider({
+    dataProvider: ordersWithMarketProvider,
+    variables: {
+      partyId: pubKey || '',
+      pagination: {
+        first: 1,
+      },
+    },
+    skip: !pubKey,
+  });
+  const orders = Boolean(ordersData?.length);
+
+  const partyIds = pubKeys?.map((item) => item.publicKey) || [];
+  const { data: positionsData } = useDataProvider({
+    dataProvider: positionsDataProvider,
+    variables: {
+      partyIds,
+    },
+    skip: !partyIds?.length,
+  });
+  const positions = Boolean(positionsData?.length);
+
+  const isLoading = Boolean(
+    (connecting || pubKey) &&
+      (depositsData === null ||
+        ordersData === null ||
+        collateralData === null ||
+        positionsData === null)
+  );
+  if (isLoading) {
+    return OnboardingStep.ONBOARDING_UNKNOWN_STEP;
+  }
+  if (!isBrowserWalletInstalled()) {
+    return OnboardingStep.ONBOARDING_WALLET_STEP;
+  }
+  if (!pubKey) {
+    return OnboardingStep.ONBOARDING_CONNECT_STEP;
+  }
+  if (!deposits && !collaterals) {
+    return OnboardingStep.ONBOARDING_DEPOSIT_STEP;
+  }
+  if (!orders && !positions) {
+    return OnboardingStep.ONBOARDING_ORDER_STEP;
+  }
+  return OnboardingStep.ONBOARDING_COMPLETE_STEP;
+};

apps/trading/components/welcome-dialog/welcome-dialog-content.tsx

@@ -3,21 +3,19 @@ import { GetStarted } from './get-started';
 import { TradingButton } from '@vegaprotocol/ui-toolkit';
 import { useNavigate } from 'react-router-dom';
 import { Links, Routes } from '../../pages/client-router';
-import { useLocalStorage } from '@vegaprotocol/react-helpers';
-import * as constants from '../constants';
 import { Networks, useEnvironment } from '@vegaprotocol/environment';
 import type { ReactNode } from 'react';
+import { useGlobalStore } from '../../stores';
 
 export const WelcomeDialogContent = () => {
   const { VEGA_ENV } = useEnvironment();
-  const [, setOnboardingViewed] = useLocalStorage(
-    constants.ONBOARDING_VIEWED_KEY
-  );
+
+  const update = useGlobalStore((store) => store.update);
   const navigate = useNavigate();
   const browseMarkets = () => {
     const link = Links[Routes.MARKETS]();
     navigate(link);
-    setOnboardingViewed('true');
+    update({ onBoardingDismissed: true });
   };
   const lead =
     VEGA_ENV === Networks.MAINNET
@@ -57,7 +55,7 @@ export const WelcomeDialogContent = () => {
           {t('Browse the markets')}
         </TradingButton>
       </div>
-      <div className="sm:w-1/2">
+      <div className="sm:w-1/2 flex grow">
         <GetStarted lead={lead} />
       </div>
     </div>

apps/trading/components/welcome-dialog/welcome-dialog.tsx

@@ -2,31 +2,38 @@ import React from 'react';
 import { useNavigate } from 'react-router-dom';
 import { Dialog, Intent } from '@vegaprotocol/ui-toolkit';
 import { t } from '@vegaprotocol/i18n';
-import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import { useEnvironment } from '@vegaprotocol/environment';
-import { isBrowserWalletInstalled } from '@vegaprotocol/wallet';
-import * as constants from '../constants';
+import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import { WelcomeDialogContent } from './welcome-dialog-content';
-import { getConfig } from '@vegaprotocol/wallet';
 import { Links, Routes } from '../../pages/client-router';
 import { useGlobalStore } from '../../stores';
+import {
+  useGetOnboardingStep,
+  OnboardingStep,
+} from './use-get-onboarding-step';
+import * as constants from '../constants';
 
 export const WelcomeDialog = () => {
   const { VEGA_ENV } = useEnvironment();
-  const [onBoardingViewed, setOnboardingViewed] = useLocalStorage(
-    constants.ONBOARDING_VIEWED_KEY
-  );
+  const [onBoardingViewed] = useLocalStorage(constants.ONBOARDING_VIEWED_KEY);
+  const update = useGlobalStore((store) => store.update);
+  const dismissed = useGlobalStore((store) => store.onBoardingDismissed);
+  const currentStep = useGetOnboardingStep();
+
   const navigate = useNavigate();
   const isOnboardingDialogNeeded =
-    onBoardingViewed !== 'true' && !isBrowserWalletInstalled() && !getConfig();
+    onBoardingViewed !== 'true' &&
+    currentStep &&
+    currentStep < OnboardingStep.ONBOARDING_COMPLETE_STEP &&
+    !dismissed;
   const marketId = useGlobalStore((store) => store.marketId);
 
   const onClose = () => {
-    setOnboardingViewed('true');
     const link = marketId
       ? Links[Routes.MARKET](marketId)
       : Links[Routes.HOME]();
     navigate(link);
+    update({ onBoardingDismissed: true });
   };
   const title = (
     <span className="font-alpha calt" data-testid="welcome-title">

apps/trading/pages/_app.page.tsx

@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import Head from 'next/head';
 import type { AppProps } from 'next/app';
 import { t } from '@vegaprotocol/i18n';
@@ -23,7 +23,7 @@ import {
   useNodeSwitcherStore,
 } from '@vegaprotocol/environment';
 import './styles.css';
-import { usePageTitleStore } from '../stores';
+import { useGlobalStore, usePageTitleStore } from '../stores';
 import DialogsContainer from './dialogs-container';
 import ToastsManager from './toasts-manager';
 import {
@@ -170,7 +170,8 @@ const PartyData = () => {
 
 const MaybeConnectEagerly = () => {
   const { VEGA_ENV, SENTRY_DSN } = useEnvironment();
-  useVegaEagerConnect(Connectors);
+  const update = useGlobalStore((store) => store.update);
+  const eagerConnecting = useVegaEagerConnect(Connectors);
   const [isTelemetryApproved] = useTelemetryApproval();
   useEthereumEagerConnect(
     isTelemetryApproved ? { dsn: SENTRY_DSN, env: VEGA_ENV } : {}
@@ -182,5 +183,8 @@ const MaybeConnectEagerly = () => {
   if (query && !pubKey) {
     connect(Connectors['view']);
   }
+  useEffect(() => {
+    update({ eagerConnecting });
+  }, [update, eagerConnecting]);
   return null;
 };

apps/trading/stores/global.ts

@@ -4,6 +4,8 @@ import produce from 'immer';
 
 interface GlobalStore {
   marketId: string | null;
+  onBoardingDismissed: boolean;
+  eagerConnecting: boolean;
   update: (store: Partial<Omit<GlobalStore, 'update'>>) => void;
 }
 
@@ -14,6 +16,8 @@ interface PageTitleStore {
 
 export const useGlobalStore = create<GlobalStore>()((set) => ({
   marketId: LocalStorage.getItem('marketId') || null,
+  onBoardingDismissed: false,
+  eagerConnecting: false,
   update: (newState) => {
     set(
       produce((state: GlobalStore) => {

libs/markets/src/lib/market-utils.spec.tsx

@@ -1,6 +1,10 @@
 import * as Schema from '@vegaprotocol/types';
-import type { Market } from './markets-provider';
-import { filterAndSortMarkets, totalFeesPercentage } from './market-utils';
+import type { Market, MarketMaybeWithDataAndCandles } from './markets-provider';
+import {
+  calcTradedFactor,
+  filterAndSortMarkets,
+  totalFeesPercentage,
+} from './market-utils';
 const { MarketState, MarketTradingMode } = Schema;
 
 const MARKET_A: Partial<Market> = {
@@ -77,3 +81,52 @@ describe('totalFees', () => {
     expect(totalFeesPercentage(i)).toEqual(o);
   });
 });
+
+describe('calcTradedFactor', () => {
+  const marketA = {
+    data: {
+      markPrice: '10',
+    },
+    candles: [
+      {
+        volume: '1000',
+      },
+    ],
+    tradableInstrument: {
+      instrument: {
+        product: {
+          settlementAsset: {
+            decimals: 18,
+            quantum: '1000000000000000000', // 1
+          },
+        },
+      },
+    },
+  };
+  const marketB = {
+    data: {
+      markPrice: '10',
+    },
+    candles: [
+      {
+        volume: '1000',
+      },
+    ],
+    tradableInstrument: {
+      instrument: {
+        product: {
+          settlementAsset: {
+            decimals: 18,
+            quantum: '1', // 0.0000000000000000001
+          },
+        },
+      },
+    },
+  };
+  it('a is "traded" more than b', () => {
+    const fa = calcTradedFactor(marketA as MarketMaybeWithDataAndCandles);
+    const fb = calcTradedFactor(marketB as MarketMaybeWithDataAndCandles);
+    // it should be true because market a's asset is "more valuable" than b's
+    expect(fa > fb).toBeTruthy();
+  });
+});

libs/markets/src/lib/market-utils.ts

@@ -1,8 +1,13 @@
-import { formatNumberPercentage } from '@vegaprotocol/utils';
+import { formatNumberPercentage, toBigNum } from '@vegaprotocol/utils';
 import * as Schema from '@vegaprotocol/types';
 import BigNumber from 'bignumber.js';
 import orderBy from 'lodash/orderBy';
-import type { Market, Candle, MarketMaybeWithData } from '../';
+import type {
+  Market,
+  Candle,
+  MarketMaybeWithData,
+  MarketMaybeWithDataAndCandles,
+} from '../';
 const { MarketState, MarketTradingMode } = Schema;
 
 export const totalFees = (fees: Market['fees']['factors']) => {
@@ -86,3 +91,18 @@ export const calcCandleHigh = (candles: Candle[]): string | undefined => {
 export const calcCandleVolume = (candles: Candle[]): string | undefined =>
   candles &&
   candles.reduce((acc, c) => new BigNumber(acc).plus(c.volume).toString(), '0');
+
+export const calcTradedFactor = (m: MarketMaybeWithDataAndCandles) => {
+  const volume = Number(calcCandleVolume(m.candles || []) || 0);
+  const price = m.data?.markPrice ? Number(m.data.markPrice) : 0;
+  const quantum = Number(
+    m.tradableInstrument.instrument.product.settlementAsset.quantum
+  );
+  const decimals = Number(
+    m.tradableInstrument.instrument.product.settlementAsset.decimals
+  );
+  const fp = toBigNum(price, decimals);
+  const fq = toBigNum(quantum, decimals);
+  const factor = fq.multipliedBy(fp).multipliedBy(volume);
+  return factor.toNumber();
+};

libs/positions/src/lib/positions-data-providers.ts

@@ -181,7 +181,7 @@ const getSubscriptionVariables = (
 ): PositionsSubscriptionSubscriptionVariables[] =>
   ([] as string[]).concat(variables.partyIds).map((partyId) => ({ partyId }));
 
-const positionsDataProvider = makeDataProvider<
+export const positionsDataProvider = makeDataProvider<
   PositionsQuery,
   PositionFieldsFragment[],
   PositionsSubscriptionSubscription,

libs/wallet/src/connect-dialog/connect-dialog.tsx

@@ -204,6 +204,7 @@ const ConnectorList = ({
   setWalletUrl: (value: string) => void;
   isDesktopWalletRunning: boolean | null;
 }) => {
+  const { pubKey } = useVegaWallet();
   const title = isBrowserWalletInstalled()
     ? t('Connect Vega wallet')
     : t('Get a Vega wallet');
@@ -234,7 +235,7 @@ const ConnectorList = ({
               onClick={() => onSelect('injected')}
             />
           ) : (
-            <GetWallet />
+            <GetWalletButton />
           )}
         </div>
         <div>
@@ -242,6 +243,7 @@ const ConnectorList = ({
             type="view"
             text={t('View as party')}
             onClick={() => onSelect('view')}
+            disabled={Boolean(pubKey)}
           />
         </div>
         <div className="last:mb-0">
@@ -318,7 +320,7 @@ const SelectedForm = ({
   throw new Error('No connector selected');
 };
 
-const GetWallet = () => {
+export const GetWalletButton = ({ className }: { className?: string }) => {
   const { MOZILLA_EXTENSION_URL, CHROME_EXTENSION_URL } = useEnvironment();
   const isItChrome = window.navigator.userAgent.includes('Chrome');
   const isItMozilla =
@@ -347,10 +349,13 @@ const GetWallet = () => {
 
   return !isItChrome && !isItMozilla ? (
     <div
-      className={classNames([
-        'bg-vega-blue-350 hover:bg-vega-blue-400 dark:bg-vega-blue-650 dark:hover:bg-vega-blue-600',
-        'flex gap-2 items-center justify-center rounded h-8 px-3 relative',
-      ])}
+      className={classNames(
+        [
+          'bg-vega-blue-350 hover:bg-vega-blue-400 dark:bg-vega-blue-650 dark:hover:bg-vega-blue-600',
+          'flex gap-2 items-center justify-center rounded h-8 px-3 relative',
+        ],
+        className
+      )}
       data-testid="get-wallet-button"
     >
       {buttonContent}
@@ -360,7 +365,7 @@ const GetWallet = () => {
       onClick={onClick}
       intent={Intent.Info}
       data-testid="get-wallet-button"
-      className="relative"
+      className={classNames('relative', className)}
       size="small"
       fill
     >
@@ -409,6 +414,7 @@ const CustomUrlInput = ({
   isDesktopWalletRunning: boolean | null;
   onSelect: (type: WalletType) => void;
 }) => {
+  const { pubKey } = useVegaWallet();
   const [urlInputExpanded, setUrlInputExpanded] = useState(false);
   return urlInputExpanded ? (
     <>
@@ -433,7 +439,7 @@ const CustomUrlInput = ({
         />
       </TradingFormGroup>
       <ConnectionOption
-        disabled={!isDesktopWalletRunning}
+        disabled={!isDesktopWalletRunning || Boolean(pubKey)}
         type="jsonRpc"
         text={t('Connect the App/CLI')}
         onClick={() => onSelect('jsonRpc')}
@@ -442,7 +448,7 @@ const CustomUrlInput = ({
   ) : (
     <>
       <ConnectionOption
-        disabled={!isDesktopWalletRunning}
+        disabled={!isDesktopWalletRunning || Boolean(pubKey)}
         type="jsonRpc"
         text={t('Use the Desktop App/CLI')}
         onClick={() => onSelect('jsonRpc')}
@@ -453,6 +459,7 @@ const CustomUrlInput = ({
             <button
               className="underline text-default"
               onClick={() => setUrlInputExpanded(true)}
+              disabled={Boolean(pubKey)}
             >
               {t('Enter a custom wallet location')}{' '}
               <VegaIcon name={VegaIconNames.ARROW_RIGHT} />
@@ -467,6 +474,7 @@ const CustomUrlInput = ({
               <button
                 className="underline"
                 onClick={() => setUrlInputExpanded(true)}
+                disabled={Boolean(pubKey)}
               >
                 {t('custom wallet location')}
               </button>

libs/wallet/src/use-is-wallet-service-running.tsx

@@ -12,7 +12,9 @@ export const useIsWalletServiceRunning = (
 
   const checkState = useCallback(async () => {
     const connector = connectors['jsonRpc'] as JsonRpcConnector;
-    connector.url = url;
+    if (url && url !== connector.url) {
+      connector.url = url;
+    }
     try {
       await connector.checkCompat();
       const chainIdResult = await connector.getChainId();

nx.json

@@ -21,8 +21,7 @@
           "echo $NX_TENDERMINT_URL",
           "echo $NX_TENDERMINT_WEBSOCKET_URL",
           "echo $NX_ETHEREUM_PROVIDER_URL"
-        ],
-        "url": "https://cloud.nx.app"
+        ]
       }
     }
   },

specs/0007-FUGS-first-use-get-started.md

@@ -1,22 +1,34 @@
 # First use & get started steps
 
-## When first enter the app
+## "Onboarding" state is gradable and has following steps: (<a name="0007-FUGS-002" href="#0007-FUGS-002">0007-FUGS-003</a>)
+
+- New visitor - has no wallet nor any dapps running.
+  - I **must** see CTA button "Get started", which clicking launches the get wallet flow (wallet connection window with links to the Chrome and FF stores)
+- Has wallet - Once wallet detected set to this.
+  - I **must** see CTA button "Connect", which clicking launches the wallet connection
+- Has connected - Once user has connected set to this.
+  - I **must** see CTA button "Deposit", which clicking launches the deposit ticket.
+- Has deposited - Once user has made AT LEAST one deposit of ANY settlement asset set to this.
+  - I **must** see CTA button "Dismiss", which clicking updates the state to Ready to trade - Get started box should now disappear forever.
+- Ready to trade - Once user has made at least one deposit AND has dismissed the "Get Started" box in the ticket.
+  - Onboarding window nor contextual "Get started" banner should be not displayed anymore.
+
+## When first enter the app or next times, but I didn't accomplish all onboarding steps.
 
 - **Must** When I open Console for the first time I can see what it is i.e. a short description and key features in auto opened dialog window (first use popup) (<a name="0007-FUGS-001" href="#0007-FUGS-001">0007-FUGS-001</a>)
-- **Must** If my wallet is already connected I don't see the first use popup (<a name="0007-FUGS-002" href="#0007-FUGS-002">0007-FUGS-002</a>)
-- - **Must** If window.vega is detected (browser wallet is installed), don't open first use popup (<a name="0007-FUGS-003" href="#0007-FUGS-003">0007-FUGS-003</a>)
-- - **Must** If we detect previous connection using localStorage for desktop/cli wallet, don't open first use popup (<a name="0007-FUGS-004" href="#0007-FUGS-004">0007-FUGS-004</a>)
+- If full "onboarding" hasn't been accomplished yet, I **must** see the popup with my progress marked. (<a name="0007-FUGS-002" href="#0007-FUGS-002">0007-FUGS-002</a>)
 - **Must** There is a call to action to browse markets, linking to the market view market/all (<a name="0007-FUGS-005" href="#0007-FUGS-005">0007-FUGS-005</a>)
 - **Must** I can see the steps I need to take to get started trading (<a name="0007-FUGS-007" href="#0007-FUGS-006">0007-FUGS-006</a>)
 - **Must** There is a call to action to get started, triggering the connect modal (<a name="0007-FUGS-007" href="#0007-FUGS-007">0007-FUGS-007</a>)
 - **Must** There is a link to try out trading on Fairground when I'm on Mainnet (<a name="0007-FUGS-008" href="#0007-FUGS-008">0007-FUGS-008</a>)
 - **Must** There is a link to trade with real funds on Mainnet when I am on Fairground (<a name="0007-FUGS-010" href="#0007-FUGS-010">0007-FUGS-010</a>)
 - **Must** When I am on the Fairground version, I can see a warning / call out that this is Fairground meaning I can try out with virtual assets at no risk (<a name="0007-FUGS-011" href="#0007-FUGS-011">0007-FUGS-011</a>)
+- If I dismiss the popup, I **must** not see it unless I NOT accomplish full "onboarding"
 - If I dismiss the popup, I land on the default market (<a name="0007-FUGS-012" href="#0007-FUGS-012">0007-FUGS-012</a>)
 
-## When first use popup has been seen, but no browser wallet is installed
+## When the popup has been dismissed:
 
-- **Must** I can see the steps to get started with a visible call to action to "get started" in the context of the deal ticket, deposit, withdraw, transfer components in the sidebar (<a name="0007-FUGS-013" href="#0007-FUGS-013">0007-FUGS-013</a>)
+- **Must** I can see the steps to get started with a visible call to action (according to my progress) in the context of the deal ticket, deposit, withdraw, transfer components in the sidebar (<a name="0007-FUGS-013" href="#0007-FUGS-013">0007-FUGS-013</a>)
 - **Must** Remove buttons from pane containers that prompt to connect wallet (<a name="0007-FUGS-014" href="#0007-FUGS-014">0007-FUGS-014</a>)
 - **Must** We've replaced "connect wallet" in the top right with "get started" (<a name="0007-FUGS-015" href="#0007-FUGS-015">0007-FUGS-015</a>)
 - **Must** When I press the get started CTA, I see the wallet connect popup (<a name="0007-FUGS-016" href="#0007-FUGS-016">0007-FUGS-016</a>)