fix(ci): test changes against pull_request

Co-authored-by: Bartłomiej Głownia <bglownia@gmail.com>

.github/workflows/ci-cd-trigger.yml

@@ -6,7 +6,9 @@ on:
       - release/*
       - develop
       - main
-  pull_request:
+  # uncomment pull_request and comment pull_request_target to test CI changes against feature branch not target branch (develop)
+  # pull_request:
+  pull_request_target:
     types:
       - opened
       - ready_for_review
@@ -20,6 +22,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event.pull_request.head.sha || github.sha }}
 
       - name: Cache node modules
         id: cache
@@ -60,6 +64,7 @@ jobs:
         uses: actions/checkout@v3
         with:
           fetch-depth: 0
+          ref: ${{ github.event.pull_request.head.sha || github.sha }}
 
       - name: Setup node
         uses: actions/setup-node@v3
@@ -107,65 +112,82 @@ jobs:
           echo "Branch slug: ${branch_slug}"
           echo ">>>> eof debug"
 
-          projects_e2e=""
+          projects_array=()
+
           preview_governance="not deployed"
           preview_trading="not deployed"
           preview_explorer="not deployed"
           preview_tools="not deployed"
+
+          # parse if affected is any of three main applications, if none - use all of them
           if echo "$affected" | grep -q governance; then
             echo "Governance is affected"
-            projects_e2e+='"governance-e2e" '
+            projects_array+=("governance")
             preview_governance=$(printf "https://%s.%s.vega.rocks" "governance" "$branch_slug")
           fi
           if echo "$affected" | grep -q trading; then
             echo "Trading is affected"
-            projects_e2e+='"trading-e2e" '
+            projects_array+=("trading")
             preview_trading=$(printf "https://%s.%s.vega.rocks" "trading" "$branch_slug")
           fi
           if echo "$affected" | grep -q explorer; then
             echo "Explorer is affected"
-            projects_e2e+='"explorer-e2e" '
+            projects_array+=("explorer")
             preview_explorer=$(printf "https://%s.%s.vega.rocks" "explorer" "$branch_slug")
           fi
-          if [[ -z "$projects_e2e" ]]; then
-            projects_e2e+='"governance-e2e" "trading-e2e" "explorer-e2e" '
+          if [[ ${#projects_array[@]} -eq 0 ]]; then
+            projects_array=("governance" "trading" "explorer")
             preview_governance=$(printf "https://%s.%s.vega.rocks" "governance" "$branch_slug")
             preview_trading=$(printf "https://%s.%s.vega.rocks" "trading" "$branch_slug")
             preview_explorer=$(printf "https://%s.%s.vega.rocks" "explorer" "$branch_slug")
           fi
-          projects="$(echo $projects_e2e | sed 's|-e2e||g')"
+
+          # applications parsed before this loop are applicable for running e2e-tests
+          projects_e2e_array=()
+          for project in "${projects_array[@]}"; do
+            projects_e2e_array+=("${project}-e2e")
+          done
+          # all applications below this loop are not applicable for running e2e-test
+
+          # check if pull request event to deploy tools
           if [[ "${{ github.event_name }}" = "pull_request" ]]; then
             if echo "$affected" | grep -q multisig-signer; then
               echo "Tools are affected"
-              # tools are only applicable to check previews or deploy from develop to mainnet
               echo "Deploying tools on preview"
               preview_tools=$(printf "https://%s.%s.vega.rocks" "tools" "$branch_slug")
-              projects+=' "multisig-signer" '
+
+              projects_array+=("multisig-signer")
             fi
+          # those apps deploy only from develop to mainnet
           elif [[ "${{ github.ref }}" =~ .*develop$ ]]; then
             if echo "$affected" | grep -q multisig-signer; then
               echo "Tools are affected"
-              # tools are only applicable to check previews or deploy from develop to mainnet
               echo "Deploying tools on s3"
-              projects+=' "multisig-signer" '
+
+              projects_array+=("multisig-signer")
             fi
             if echo "$affected" | grep -q static; then
               echo "static is affected"
               echo "Deploying static on s3"
-              projects+=' "static" '
+
+              projects_array+=("static")
             fi
             if echo "$affected" | grep -q ui-toolkit; then
               echo "ui-toolkit is affected"
               echo "Deploying ui-toolkit on s3"
-              projects+=' "ui-toolkit" '
+
+              projects_array+=("ui-toolkit")
             fi
           fi
 
-          projects_e2e=${projects_e2e%?}
-          projects_e2e=[${projects_e2e// /,}]
-          projects=[${projects// /,}]
-          echo PROJECTS_E2E=$projects_e2e >> $GITHUB_ENV
-          echo PROJECTS=$projects >> $GITHUB_ENV
+          echo "Projects: ${projects_array[@]}"
+          echo "Projects E2E: ${projects_e2e_array[@]}"
+          projects_json=$(jq -M --compact-output --null-input '$ARGS.positional' --args -- "${projects_array[@]}")
+          projects_e2e_json=$(jq -M --compact-output --null-input '$ARGS.positional' --args -- "${projects_e2e_array[@]}")
+
+          echo PROJECTS_E2E=$projects_e2e_json >> $GITHUB_ENV
+          echo PROJECTS=$projects_json >> $GITHUB_ENV
+
           echo PREVIEW_GOVERNANCE=$preview_governance >> $GITHUB_ENV
           echo PREVIEW_TRADING=$preview_trading >> $GITHUB_ENV
           echo PREVIEW_EXPLORER=$preview_explorer >> $GITHUB_ENV

.github/workflows/cypress-run.yml

@@ -33,6 +33,7 @@ jobs:
         with:
           fetch-depth: 0
           path: './frontend-monorepo'
+          ref: ${{ github.event.pull_request.head.sha || github.sha }}
 
       # Restore node_modules from cache if possible
       - name: Restore node_modules from cache

.github/workflows/lint-pr.yml

@@ -11,6 +11,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event.pull_request.head.sha || github.sha }}
 
       - name: Setup node
         uses: actions/setup-node@v3

.github/workflows/publish-dist.yml

@@ -19,6 +19,8 @@ jobs:
     steps:
       - name: Check out code
         uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event.pull_request.head.sha || github.sha }}
 
       - name: Set up QEMU
         id: quemu
@@ -40,7 +42,7 @@ jobs:
 
       - name: Log in to the Container registry (docker hub)
         uses: docker/login-action@v2
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && endsWith(github.ref, 'main') }}
+        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && ( endsWith(github.ref, 'main') || endsWith(github.ref, 'release/testnet') ) }}
         with:
           # registry: registry.hub.docker.com
           username: ${{ secrets.DOCKERHUB_USERNAME }}
@@ -173,7 +175,7 @@ jobs:
         uses: docker/build-push-action@v3
         continue-on-error: true
         id: dockerhub-push
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && endsWith(github.ref, 'main') }}
+        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && ( endsWith(github.ref, 'main') || endsWith(github.ref, 'release/testnet') ) }}
         with:
           context: .
           file: docker/node-outside-docker.Dockerfile
@@ -183,7 +185,7 @@ jobs:
             ENV_NAME=${{ env.ENV_NAME }}
           tags: |
             vegaprotocol/${{ matrix.app }}:${{ github.sha }}
-            vegaprotocol/${{ matrix.app }}:mainnet
+            vegaprotocol/${{ matrix.app }}:${{ endsWith(github.ref, 'main') && 'mainnet' || endsWith(github.ref, 'release/testnet') && 'testnet' || '' }}
 
       - name: Publish dist as docker image (ghcr - retry)
         uses: docker/build-push-action@v3
@@ -210,13 +212,13 @@ jobs:
             ENV_NAME=${{ env.ENV_NAME }}
           tags: |
             vegaprotocol/${{ matrix.app }}:${{ github.sha }}
-            vegaprotocol/${{ matrix.app }}:mainnet
+            vegaprotocol/${{ matrix.app }}:${{ endsWith(github.ref, 'main') && 'mainnet' || endsWith(github.ref, 'release/testnet') && 'testnet' || '' }}
 
       # bucket creation in github.com/vegaprotocol/terraform//frontend
       - name: Publish dist to s3
         uses: jakejarvis/s3-sync-action@master
         # s3 releases are not happening for trading on mainnet - it's IPFS
-        if: ${{ github.event_name == 'push' && ( matrix.app != 'trading' || (matrix.app == 'trading' && !endsWith(github.ref, 'main') ) ) }}
+        if: ${{ github.event_name == 'push' && ( matrix.app != 'trading' || (matrix.app == 'trading' && !( endsWith(github.ref, 'main') || endsWith(github.ref, 'release/testnet') ) ) ) }}
         with:
           args: --acl private --follow-symlinks --delete
         env:
@@ -235,22 +237,37 @@ jobs:
 
       - name: Trigger fleek deployment
         # release to ipfs happens only on mainnet (represented by main branch) for trading
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && endsWith(github.ref, 'main') }}
+        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && ( endsWith(github.ref, 'main') || endsWith(github.ref, 'release/testnet') ) }}
         run: |
-          # display info about app
-          curl -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
-            -H "Content-Type: application/json" \
-            -d '{"query": "query{getSiteById(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id latestDeploy{id status}}}"}' \
-            https://api.fleek.co/graphql
+          if echo ${{ github.ref }} | grep -q main; then
+            # display info about app
+            curl --fail -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+              -H "Content-Type: application/json" \
+              -d '{"query": "query{getSiteById(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id latestDeploy{id status}}}"}' \
+              https://api.fleek.co/graphql
 
-          # trigger new deployment as base image is always set to vegaprotocol/trading:mainnet
-          curl -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
-            -H "Content-Type: application/json" \
-            -d '{"query": "mutation{triggerDeploy(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id status}}"}' \
-            https://api.fleek.co/graphql
+            # trigger new deployment as base image is always set to vegaprotocol/trading:mainnet
+            curl --fail -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+              -H "Content-Type: application/json" \
+              -d '{"query": "mutation{triggerDeploy(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id status}}"}' \
+              https://api.fleek.co/graphql
+
+          elif echo ${{ github.ref }} | grep -q release/testnet; then
+            # display info about app
+            curl --fail -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+              -H "Content-Type: application/json" \
+              -d '{"query": "query{getSiteById(siteId:\"79baaeca-1952-4ae7-a256-f668cfc1d68e\"){id latestDeploy{id status}}}"}' \
+              https://api.fleek.co/graphql
+
+            # trigger new deployment as base image is always set to vegaprotocol/trading:mainnet
+            curl --fail -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+              -H "Content-Type: application/json" \
+              -d '{"query": "mutation{triggerDeploy(siteId:\"79baaeca-1952-4ae7-a256-f668cfc1d68e\"){id status}}"}' \
+              https://api.fleek.co/graphql
+          fi
 
       - name: Check out ipfs-redirect
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && endsWith(github.ref, 'main') }}
+        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && ( endsWith(github.ref, 'main') || endsWith(github.ref, 'testnet') ) }}
         uses: actions/checkout@v3
         with:
           repository: 'vegaprotocol/ipfs-redirect'
@@ -258,11 +275,12 @@ jobs:
           fetch-depth: '0'
           token: ${{ secrets.VEGA_CI_BOT_GITHUB_TOKEN }}
 
-      - name: Update console.vega.xyz DNS to redirect to the new console
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && endsWith(github.ref, 'main') }}
+      - name: Update interstitial page to point to the new console
+        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && ( endsWith(github.ref, 'main') || endsWith(github.ref, 'testnet') ) }}
         env:
           GH_TOKEN: ${{ secrets.VEGA_CI_BOT_GITHUB_TOKEN }}
         run: |
+          # set CID
           curl -L https://dist.ipfs.tech/kubo/v0.20.0/kubo_v0.20.0_linux-amd64.tar.gz -o kubo.tgz
           tar -xzf kubo.tgz
           export PATH="$PATH:$PWD/kubo"
@@ -270,28 +288,28 @@ jobs:
           new_hash=$(cat ${{ matrix.app }}-ipfs-hash)
           new_cid=$(ipfs cid format -v 1 -b base32 $new_hash)
 
-          ls -al ipfs-redirect
-
-          echo $new_hash > ipfs-redirect/cidv0.txt
-          echo $new_cid > ipfs-redirect/cidv1.txt
-
           (
             cd ipfs-redirect
 
+            # configure git
             git status
             cat .git/config
             git config --global user.email "vega-ci-bot@vega.xyz"
             git config --global user.name "vega-ci-bot"
 
-            branch_name="update-hash-${{ github.ref }}"
-            git checkout -b "$branch_name"
+            # update CID files
+            if echo ${{ github.ref }} | grep -q main; then
+              echo $new_hash > cidv0-mainnet.txt
+              echo $new_cid > cidv1-mainnet.txt
+              git add cidv0-mainnet.txt cidv1-mainnet.txt
+            elif echo ${{ github.ref }} | grep -q release/testnet; then
+              echo $new_hash > cidv0-fairground.txt
+              echo $new_cid > cidv1-fairground.txt
+              git add cidv0-fairground.txt cidv1-fairground.txt
+            fi
+
+            # create commit
             commit_msg="Automated hash update from ${{ github.ref }}"
-            git add cidv0.txt cidv1.txt
             git commit -m "$commit_msg"
-            git push -u origin "$branch_name"
-            pr_url="$(gh pr create --title "${commit_msg}" --body 'automated pull request to update CIDs')"
-            echo $pr_url
-            # once auto merge get's enabled on documentation repo let's do follow up
-            sleep 5
-            gh pr merge "${pr_url}" --delete-branch --squash --admin
+            git push -u origin "main"
           )

apps/explorer/src/app/components/markets/markets-table.tsx

@@ -77,7 +77,7 @@ export const MarketsTable = ({ data }: MarketsTableProps) => {
         hide={window.innerWidth <= BREAKPOINT_MD}
         valueGetter={({
           data,
-        }: VegaValueGetterParams<MarketFieldsFragment, 'state'>) => {
+        }: VegaValueGetterParams<MarketFieldsFragment>) => {
           return data?.state ? MarketStateMapping[data?.state] : '-';
         }}
       />

apps/governance-e2e/cypress.config.js

@@ -49,7 +49,7 @@ module.exports = defineConfig({
     vegaTokenContractAddress: '0xF41bD86d462D36b997C0bbb4D97a0a3382f205B7',
     vegaTokenAddress: '0x67175Da1D5e966e40D11c4B2519392B2058373de',
     txTimeout: { timeout: 70000 },
-    epochTimeout: { timeout: 10000 },
+    epochTimeout: { timeout: 12000 },
     blockConfirmations: 3,
     grepTags: '@regression @smoke @slow',
     grepFilterSpecs: true,

apps/governance-e2e/src/fixtures/mocks/previous-epoch.ts

@@ -0,0 +1,63 @@
+export const previousEpochData = {
+  epoch: {
+    id: '7611',
+    validatorsConnection: {
+      edges: [
+        {
+          node: {
+            id: 'cd96782bc0ad5679869cf69fe7838a92212da7f53b4a214bed68067117494122',
+            stakedTotal: '3154229668720612941799',
+            rewardScore: {
+              rawValidatorScore: '0.2',
+              performanceScore: '1',
+              multisigScore: '0',
+              validatorScore: '0.2',
+              normalisedScore: '0.2007216887087119',
+              validatorStatus: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              __typename: 'RewardScore',
+            },
+            rankingScore: {
+              status: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              previousStatus: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              rankingScore: '0.211713765544955625',
+              stakeScore: '0.2016321576618625',
+              performanceScore: '1',
+              votingPower: '2007',
+              __typename: 'RankingScore',
+            },
+            __typename: 'Node',
+          },
+          __typename: 'NodeEdge',
+        },
+        {
+          node: {
+            id: '887d936f797a47032eceb572a13b69b581d3b1fa595a7d021a3e3cf2a5d2acfd',
+            stakedTotal: '3151161904761904764551',
+            rewardScore: {
+              rawValidatorScore: '0.2',
+              performanceScore: '1',
+              multisigScore: '1',
+              validatorScore: '0.2',
+              normalisedScore: '0.2007216887087119',
+              validatorStatus: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              __typename: 'RewardScore',
+            },
+            rankingScore: {
+              status: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              previousStatus: 'VALIDATOR_NODE_STATUS_TENDERMINT',
+              rankingScore: '0.211507855409133255',
+              stakeScore: '0.2014360527706031',
+              performanceScore: '1',
+              votingPower: '2007',
+              __typename: 'RankingScore',
+            },
+            __typename: 'Node',
+          },
+          __typename: 'NodeEdge',
+        },
+      ],
+      __typename: 'NodesConnection',
+    },
+    __typename: 'Epoch',
+  },
+};

apps/governance-e2e/src/integration/flow/proposal-details.cy.ts

@@ -14,9 +14,16 @@ import {
   submitUniqueRawProposal,
   voteForProposal,
 } from '../../../../governance-e2e/src/support/governance.functions';
-import { ensureSpecifiedUnstakedTokensAreAssociated } from '../../../../governance-e2e/src/support/staking.functions';
+import {
+  ensureSpecifiedUnstakedTokensAreAssociated,
+  stakingPageAssociateTokens,
+  stakingPageDisassociateAllTokens,
+} from '../../../../governance-e2e/src/support/staking.functions';
 import { ethereumWalletConnect } from '../../../../governance-e2e/src/support/wallet-eth.functions';
-import { vegaWalletSetSpecifiedApprovalAmount } from '../../../../governance-e2e/src/support/wallet-teardown.functions';
+import {
+  switchVegaWalletPubKey,
+  vegaWalletSetSpecifiedApprovalAmount,
+} from '../../support/wallet-functions';
 import type { testFreeformProposal } from '../../support/common-interfaces';
 import { formatDateWithLocalTimezone } from '@vegaprotocol/utils';
 
@@ -44,7 +51,7 @@ describe(
     before('connect wallets and set approval limit', function () {
       cy.visit('/');
       ethereumWalletConnect();
-      cy.associateTokensToVegaWallet('1');
+      // cy.associateTokensToVegaWallet('1');
     });
 
     beforeEach('visit proposals tab', function () {
@@ -297,5 +304,33 @@ describe(
             .and('be.visible');
         });
     });
+
+    it('Able to vote for proposal twice by switching public key', function () {
+      ensureSpecifiedUnstakedTokensAreAssociated('1');
+      createRawProposal();
+      cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
+        getProposalFromTitle(rawProposal.rationale.title).within(() =>
+          cy.get(viewProposalButton).click()
+        );
+        voteForProposal('for');
+        cy.contains('You voted: For').should('be.visible');
+        ethereumWalletConnect();
+        switchVegaWalletPubKey();
+        stakingPageAssociateTokens('2');
+        navigateTo(navigation.proposals);
+        getProposalFromTitle(rawProposal.rationale.title).within(() =>
+          cy.get(viewProposalButton).click()
+        );
+        cy.getByTestId('you-voted').should('not.exist');
+        voteForProposal('against');
+        cy.contains('You voted: Against').should('be.visible');
+        switchVegaWalletPubKey();
+        cy.get(proposalVoteProgressForTokens).should('contain.text', '1.00');
+        // Checking vote status for different public keys is displayed correctly
+        cy.contains('You voted: For').should('be.visible');
+      });
+      switchVegaWalletPubKey();
+      stakingPageDisassociateAllTokens();
+    });
   }
 );

apps/governance-e2e/src/integration/flow/proposal-enacted.cy.ts

@@ -16,7 +16,7 @@ import {
 } from '../../support/proposal.functions';
 import { ensureSpecifiedUnstakedTokensAreAssociated } from '../../support/staking.functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
-import { vegaWalletSetSpecifiedApprovalAmount } from '../../support/wallet-teardown.functions';
+import { vegaWalletSetSpecifiedApprovalAmount } from '../../support/wallet-functions';
 
 const proposalListItem = '[data-testid="proposals-list-item"]';
 const closedProposals = '[data-testid="closed-proposals"]';
@@ -89,8 +89,14 @@ context(
       });
       cy.get(proposalStatus).should('have.text', 'Open');
       voteForProposal('for');
-      cy.get(proposalStatus, proposalTimeout).should('have.text', 'Passed');
-      cy.get(proposalStatus, proposalTimeout).should('have.text', 'Enacted');
+      cy.get(proposalStatus, proposalTimeout)
+        .should('have.text', 'Passed')
+        .then(() => {
+          cy.get(proposalStatus, proposalTimeout).should(
+            'have.text',
+            'Enacted'
+          );
+        });
       cy.get(votesTable).within(() => {
         cy.contains('Vote passed.').should('be.visible');
         cy.contains('Voting has ended.').should('be.visible');

apps/governance-e2e/src/integration/flow/proposal-flow.cy.ts

@@ -32,7 +32,7 @@ import {
 import {
   vegaWalletSetSpecifiedApprovalAmount,
   vegaWalletTeardown,
-} from '../../support/wallet-teardown.functions';
+} from '../../support/wallet-functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
 import type { testFreeformProposal } from '../../support/common-interfaces';
 
@@ -130,7 +130,7 @@ context(
       createRawProposal();
     });
 
-    it.skip('Creating a proposal - proposal rejected - when closing time sooner than system default', function () {
+    it('Creating a proposal - proposal rejected - when closing time sooner than system default', function () {
       goToMakeNewProposal(governanceProposalType.FREEFORM);
       enterUniqueFreeFormProposalBody('0.1', generateFreeFormProposalTitle());
       cy.get('input:invalid')
@@ -138,7 +138,7 @@ context(
         .should('equal', 'Value must be greater than or equal to 1.');
     });
 
-    it.skip('Creating a proposal - proposal rejected - when closing time later than system default', function () {
+    it('Creating a proposal - proposal rejected - when closing time later than system default', function () {
       goToMakeNewProposal(governanceProposalType.FREEFORM);
       enterUniqueFreeFormProposalBody(
         '100000',

apps/governance-e2e/src/integration/flow/proposal-forms.cy.ts

@@ -8,6 +8,7 @@ import {
 } from '../../support/common.functions';
 import {
   getDownloadedProposalJsonPath,
+  getProposalFromTitle,
   submitUniqueRawProposal,
 } from '../../support/governance.functions';
 import {
@@ -23,10 +24,11 @@ import {
 } from '../../support/staking.functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
 import {
+  switchVegaWalletPubKey,
+  vegaWalletFaucetAssetsWithoutCheck,
   vegaWalletSetSpecifiedApprovalAmount,
   vegaWalletTeardown,
-} from '../../support/wallet-teardown.functions';
-import { vegaWalletFaucetAssetsWithoutCheck } from '../../support/wallet-vega.functions';
+} from '../../support/wallet-functions';
 
 const proposalListItem = '[data-testid="proposals-list-item"]';
 const openProposals = '[data-testid="open-proposals"]';
@@ -54,7 +56,8 @@ const feedbackError = '[data-testid="Error"]';
 const viewProposalBtn = 'view-proposal-btn';
 const liquidityVoteStatus = 'liquidity-votes-status';
 const tokenVoteStatus = 'token-votes-status';
-const proposalTermsSection = 'proposal';
+const proposalJsonToggle = 'proposal-json-toggle';
+const proposalJsonSection = 'proposal-json';
 const vegaWalletPublicKey = Cypress.env('vegaWalletPublicKey');
 const fUSDCId =
   '816af99af60d684502a40824758f6b5377e6af48e50a9ee8ef478ecb879ea8bc';
@@ -185,7 +188,7 @@ context(
       cy.get(maxVoteDeadline).click();
       cy.get(enactmentDeadlineError).should(
         'have.text',
-        'Proposal will fail if enactment is earlier than the voting deadline'
+        'The proposal will fail if enactment is earlier than the voting deadline'
       );
       cy.get(proposalDownloadBtn)
         .should('be.visible')
@@ -209,6 +212,7 @@ context(
       'Able to submit valid new market proposal',
       { tags: '@smoke' },
       function () {
+        const proposalTitle = 'Test new market proposal';
         goToMakeNewProposal(governanceProposalType.NEW_MARKET);
         cy.get(newProposalTitle).type('Test new market proposal');
         cy.get(newProposalDescription).type('E2E test for proposals');
@@ -230,6 +234,23 @@ context(
               submitUniqueRawProposal({ proposalBody: filePath }); // 3003-PMAN-003
             });
           });
+        navigateTo(navigation.proposals);
+        getProposalFromTitle(proposalTitle).within(() =>
+          cy.getByTestId('view-proposal-btn').click()
+        );
+        cy.getByTestId('proposal-market-data').within(() => {
+          cy.getByTestId('proposal-market-data-toggle').click();
+          cy.contains('Key details').click();
+          getMarketProposalDetailsFromTable('Name').should(
+            'have.text',
+            'Token test market'
+          );
+          cy.contains('Settlement asset').click();
+          // Settlement asset symbol
+          cy.getByTestId('3_value').should('have.text', 'fBTC');
+          cy.contains('Oracle').click();
+          cy.getByTestId('oracle-spec-links').should('have.attr', 'href');
+        });
       }
     );
 
@@ -269,8 +290,7 @@ context(
     // Will fail if run after 'Able to submit update market proposal and vote for proposal'
     // 3002-PROP-022
     it('Unable to submit update market proposal without equity-like share in the market', function () {
-      cy.get('[data-testid="manage-vega-wallet"]:visible').click();
-      cy.get('[data-testid="select-keypair-button"]').eq(0).click(); // switch to second wallet pub key
+      switchVegaWalletPubKey();
       stakingPageAssociateTokens('1');
       goToMakeNewProposal(governanceProposalType.UPDATE_MARKET);
       cy.get(newProposalTitle).type('Test update market proposal - rejected');
@@ -300,8 +320,7 @@ context(
       closeDialog();
       ethereumWalletConnect();
       stakingPageDisassociateAllTokens();
-      cy.get('[data-testid="manage-vega-wallet"]:visible').click();
-      cy.get('[data-testid="select-keypair-button"]').eq(0).click();
+      switchVegaWalletPubKey();
     });
 
     // 3002-PROP-020
@@ -455,8 +474,8 @@ context(
         .within(() => {
           cy.getByTestId(viewProposalBtn).click();
         });
-      cy.getByTestId('proposal-terms-toggle').click();
-      cy.getByTestId(proposalTermsSection).within(() => {
+      cy.getByTestId(proposalJsonToggle).click();
+      cy.getByTestId(proposalJsonSection).within(() => {
         cy.contains('USDT Coin').should('be.visible');
         cy.contains('USDT').should('be.visible');
       });
@@ -502,13 +521,11 @@ context(
         .invoke('text')
         .should('not.be.empty');
       // 3001-VOTE-030 3001-VOTE-031
-      cy.getByTestId('proposal-terms-toggle').click();
-      cy.getByTestId('proposal-terms').within(() => {
-        getProposalInformationFromTable('assetId').should('have.text', assetId);
-        getProposalInformationFromTable('lifetimeLimit').should(
-          'have.text',
-          '10'
-        );
+      cy.getByTestId(proposalJsonToggle).click();
+      cy.getByTestId(proposalJsonSection).within(() => {
+        cy.contains(assetId).should('be.visible');
+        cy.contains('lifetimeLimit').should('be.visible');
+        cy.contains('10').should('be.visible');
       });
     });
 
@@ -606,5 +623,13 @@ context(
         });
       });
     }
+
+    function getMarketProposalDetailsFromTable(heading: string) {
+      return cy
+        .getByTestId('key-value-table-row')
+        .contains(heading)
+        .parent()
+        .siblings();
+    }
   }
 );

apps/governance-e2e/src/integration/flow/proposal-list.cy.ts

@@ -21,7 +21,7 @@ import {
 } from '../../support/governance.functions';
 import { ensureSpecifiedUnstakedTokensAreAssociated } from '../../support/staking.functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
-import { vegaWalletSetSpecifiedApprovalAmount } from '../../support/wallet-teardown.functions';
+import { vegaWalletSetSpecifiedApprovalAmount } from '../../support/wallet-functions';
 
 const proposalListItem = 'proposals-list-item';
 const openProposals = '[data-testid="open-proposals"]';

apps/governance-e2e/src/integration/flow/rewards-flow.cy.ts

@@ -14,7 +14,7 @@ import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
 import {
   depositAsset,
   vegaWalletTeardown,
-} from '../../support/wallet-teardown.functions';
+} from '../../support/wallet-functions';
 
 const vegaAssetAddress = '0x67175Da1D5e966e40D11c4B2519392B2058373de';
 const vegaWalletUnstakedBalance =

apps/governance-e2e/src/integration/flow/staking-flow.cy.ts

@@ -25,7 +25,7 @@ import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
 import {
   vegaWalletSetSpecifiedApprovalAmount,
   vegaWalletTeardown,
-} from '../../support/wallet-teardown.functions';
+} from '../../support/wallet-functions';
 const stakeValidatorListTotalStake = 'total-stake';
 const stakeValidatorListTotalShare = 'total-stake-share';
 const stakeValidatorListStakePercentage = 'stake-percentage';
@@ -58,8 +58,6 @@ context(
     before('visit staking tab and connect vega wallet', function () {
       cy.visit('/');
       ethereumWalletConnect();
-      // this is a workaround for #2422 which can be removed once issue is resolved
-      cy.associateTokensToVegaWallet('4');
       vegaWalletSetSpecifiedApprovalAmount('1000');
     });
 

apps/governance-e2e/src/integration/flow/token-association-flow.cy.ts

@@ -14,11 +14,12 @@ import {
 } from '../../support/staking.functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
 import {
+  switchVegaWalletPubKey,
   vegaWalletAssociate,
   vegaWalletDisassociate,
   vegaWalletSetSpecifiedApprovalAmount,
   vegaWalletTeardown,
-} from '../../support/wallet-teardown.functions';
+} from '../../support/wallet-functions';
 
 const ethWalletContainer = '[data-testid="ethereum-wallet"]';
 const vegaWalletAssociatedBalance = '[data-testid="currency-value"]';
@@ -301,8 +302,7 @@ context(
           Cypress.env('vegaWalletPublicKey')
         );
 
-        cy.get('[data-testid="manage-vega-wallet"]:visible').click();
-        cy.get('[data-testid="select-keypair-button"]').eq(0).click();
+        switchVegaWalletPubKey();
         cy.get(connectedVegaKey).should(
           'have.text',
           Cypress.env('vegaWalletPublicKey2')

apps/governance-e2e/src/integration/flow/withdrawal-flow.cy.ts

@@ -5,7 +5,7 @@ import {
   waitForSpinner,
 } from '../../support/common.functions';
 import { ethereumWalletConnect } from '../../support/wallet-eth.functions';
-import { depositAsset } from '../../support/wallet-teardown.functions';
+import { depositAsset } from '../../support/wallet-functions';
 
 const withdraw = 'withdraw';
 const withdrawalForm = 'withdraw-form';

apps/governance-e2e/src/integration/view/pubkey-view.cy.ts

@@ -11,7 +11,7 @@ import {
   goToMakeNewProposal,
   governanceProposalType,
 } from '../../support/governance.functions';
-import { vegaWalletFaucetAssetsWithoutCheck } from '../../support/wallet-vega.functions';
+import { vegaWalletFaucetAssetsWithoutCheck } from '../../support/wallet-functions';
 
 const vegaWalletPubKey = Cypress.env('vegaWalletPublicKey2');
 const vegaPubkeyTruncated = Cypress.env('vegaWalletPublicKey2Short');

apps/governance-e2e/src/integration/view/validators.cy.ts

@@ -1,5 +1,6 @@
 /// <reference types="cypress" />
 
+import { aliasGQLQuery } from '@vegaprotocol/cypress';
 import {
   navigation,
   verifyPageHeader,
@@ -9,6 +10,7 @@ import {
   clickOnValidatorFromList,
   waitForBeginningOfEpoch,
 } from '../../support/staking.functions';
+import { previousEpochData } from '../../fixtures/mocks/previous-epoch';
 
 const guideLink = '[data-testid="staking-guide-link"]';
 const validatorTitle = '[data-testid="validator-node-title"]';
@@ -30,7 +32,7 @@ const normalisedVotingPowerToolTip =
   '[data-testid="normalised-voting-power-tooltip"]';
 const performancePenaltyToolTip = '[data-testid="performance-penalty-tooltip"]';
 const overstakedPenaltyToolTip = '[data-testid="overstaked-penalty-tooltip"]';
-const totalPenaltyToolTip = '[data-testid="total-penalty-tooltip"]';
+const multisigPenaltyToolTip = '[data-testid="multisig-error-tooltip"]';
 const epochCountDown = '[data-testid="epoch-countdown"]';
 const stakeNumberRegex = /^\d{1,3}(,\d{3})*(\.\d+)?$/;
 
@@ -143,9 +145,6 @@ context('Validators Page - verify elements on page', function () {
         cy.get(overstakedPenaltyToolTip)
           .invoke('text')
           .should('contain', 'Overstaked penalty: 60.00%'); // value not asserted due to #2886
-        cy.get(totalPenaltyToolTip)
-          .invoke('text')
-          .should('contain', 'Total penalties: 60.00%');
       });
 
       it('Should be able to see validator pending stake', function () {
@@ -155,6 +154,22 @@ context('Validators Page - verify elements on page', function () {
             cy.wrap($pendingStake).should('contain.text', '0.00');
           });
       });
+
+      it('Should be able to see multisig error', function () {
+        cy.mockGQL((req) => {
+          aliasGQLQuery(req, 'PreviousEpoch', previousEpochData);
+        });
+        waitForBeginningOfEpoch();
+        cy.getByTestId('total-penalty').first().realHover();
+        cy.get(multisigPenaltyToolTip)
+          .invoke('text')
+          .should('contain', 'Multisig penalty: 100%');
+
+        cy.getByTestId('total-penalty').eq(1).realHover();
+        cy.get(multisigPenaltyToolTip)
+          .invoke('text')
+          .should('contain', 'Multisig penalty: 100%');
+      });
     }
   );
 

apps/governance-e2e/src/integration/view/wallet-vega.cy.ts

@@ -1,7 +1,9 @@
 import { truncateByChars } from '@vegaprotocol/utils';
 import { waitForSpinner } from '../../support/common.functions';
-import { vegaWalletTeardown } from '../../support/wallet-teardown.functions';
-import { vegaWalletFaucetAssetsWithoutCheck } from '../../support/wallet-vega.functions';
+import {
+  vegaWalletFaucetAssetsWithoutCheck,
+  vegaWalletTeardown,
+} from '../../support/wallet-functions';
 
 const walletContainer = 'aside [data-testid="vega-wallet"]';
 const walletHeader = '[data-testid="wallet-header"] h1';
@@ -285,28 +287,28 @@ context(
             name: 'USDC (fake)',
             symbol: 'fUSDC',
             amount: '1000000',
-            expectedAmount: '10.00',
+            expectedAmount: 10.0,
           },
           {
             id: '8566db7257222b5b7ef2886394ad28b938b28680a54a169bbc795027b89d6665',
             name: 'DAI (fake)',
             symbol: 'fDAI',
             amount: '200000',
-            expectedAmount: '2.00',
+            expectedAmount: 2.0,
           },
           {
             id: '73174a6fb1d5802ba0ac7bd7ab79e0a3a4837b262de0a4e80815a55442692bd0',
             name: 'BTC (fake)',
             symbol: 'fBTC',
             amount: '600000',
-            expectedAmount: '6.00',
+            expectedAmount: 6.0,
           },
           {
             id: 'e02d4c15d790d1d2dffaf2dcd1cf06a1fe656656cf4ed18c8ce99f9e83643567',
             name: 'EURO (fake)',
             symbol: 'fEURO',
             amount: '800000',
-            expectedAmount: '8.00',
+            expectedAmount: 8.0,
           },
         ];
 
@@ -317,12 +319,6 @@ context(
           cy.reload();
           waitForSpinner();
           cy.connectVegaWallet();
-          cy.get(walletContainer).within(() => {
-            cy.getByTestId('currency-title', txTimeout).should(
-              'have.length.at.least',
-              5
-            );
-          });
         });
 
         for (const { name, symbol, expectedAmount } of assets) {
@@ -336,10 +332,10 @@ context(
                 .contains(name)
                 .parent()
                 .siblings()
-                .invoke('text')
-                .should('have.length.at.least', 4)
-                .then(parseFloat)
-                .should('be.gte', parseFloat(expectedAmount));
+                .then((elementAmount) => {
+                  const displayedAmount = parseFloat(elementAmount.text());
+                  expect(displayedAmount).be.gte(expectedAmount);
+                });
 
               cy.get(vegaWalletCurrencyTitle)
                 .contains(name)

apps/governance-e2e/src/support/common.functions.ts

@@ -37,7 +37,7 @@ export function navigateTo(page: navigation) {
       });
   } else {
     return cy.get(navigation.section, { timeout: 10000 }).within(() => {
-      cy.get(page).eq(0).click();
+      cy.get(page).eq(0).click({ force: true });
     });
   }
 }

apps/governance-e2e/src/support/index.js

@@ -5,8 +5,7 @@ import './common.functions.ts';
 import './staking.functions.ts';
 import './governance.functions.ts';
 import './wallet-eth.functions.ts';
-import './wallet-teardown.functions.ts';
-import './wallet-vega.functions.ts';
+import './wallet-functions.ts';
 import './proposal.functions.ts';
 import 'cypress-mochawesome-reporter/register';
 import registerCypressGrep from '@cypress/grep';

apps/governance-e2e/src/support/staking.functions.ts

@@ -1,5 +1,5 @@
 import { closeDialog } from './common.functions';
-import { vegaWalletTeardown } from './wallet-teardown.functions';
+import { vegaWalletTeardown } from './wallet-functions';
 
 const tokenAmountInputBox = '[data-testid="token-amount-input"]';
 const tokenSubmitButton = '[data-testid="token-input-submit-button"]';

apps/governance-e2e/src/support/wallet-functions.ts

@@ -173,3 +173,27 @@ export async function vegaWalletDisassociate(amount: string) {
   amount = amount + '0'.repeat(18);
   stakingBridgeContract.remove_stake(amount, vegaWalletPubKey);
 }
+
+export function vegaWalletFaucetAssetsWithoutCheck(
+  asset: string,
+  amount: string,
+  vegaWalletPublicKey: string
+) {
+  cy.highlight(`Topping up vega wallet with ${asset}, amount: ${amount}`);
+  cy.exec(
+    `curl -X POST -d '{"amount": "${amount}", "asset": "${asset}", "party": "${vegaWalletPublicKey}"}' http://localhost:1790/api/v1/mint`
+  )
+    .its('stdout')
+    .then((response) => {
+      assert.include(
+        response,
+        `"success":true`,
+        'Ensuring curl command was successfully undertaken'
+      );
+    });
+}
+
+export function switchVegaWalletPubKey() {
+  cy.get('[data-testid="manage-vega-wallet"]:visible').click();
+  cy.get('[data-testid="select-keypair-button"]').eq(0).click();
+}

apps/governance-e2e/src/support/wallet-vega.functions.ts

@@ -1,18 +0,0 @@
-export function vegaWalletFaucetAssetsWithoutCheck(
-  asset: string,
-  amount: string,
-  vegaWalletPublicKey: string
-) {
-  cy.highlight(`Topping up vega wallet with ${asset}, amount: ${amount}`);
-  cy.exec(
-    `curl -X POST -d '{"amount": "${amount}", "asset": "${asset}", "party": "${vegaWalletPublicKey}"}' http://localhost:1790/api/v1/mint`
-  )
-    .its('stdout')
-    .then((response) => {
-      assert.include(
-        response,
-        `"success":true`,
-        'Ensuring curl command was successfully undertaken'
-      );
-    });
-}

apps/governance/src/i18n/translations/dev.json

@@ -596,6 +596,8 @@
   "noPercentage": "No percentage",
   "proposalJson": "Full proposal JSON",
   "proposalDetails": "Proposal details",
+  "marketSpecification": "Market specification",
+  "viewMarketJson": "View market JSON",
   "proposalDescription": "Description",
   "currentlySetTo": "Currently expected to ",
   "currently": "currently",
@@ -729,7 +731,11 @@
   "ThisWillSetValidationDeadlineTo": "This will set the validation deadline to",
   "Hours": "hours",
   "ThisWillAdd2MinutesToAllowTimeToConfirmInWallet": "Note: 2 minutes of extra time are added when you choose the minimum value. This gives you time to confirm the proposal in your wallet.",
-  "ProposalWillFailIfEnactmentIsEarlierThanVotingDeadline": "Proposal will fail if enactment is earlier than the voting deadline",
+  "ProposalWillFailIfEnactmentIsEarlierThanVotingDeadline": "The proposal will fail if enactment is earlier than the voting deadline",
+  "ProposalWillFailIfEnactmentIsBelowTheMinimumDeadline": "The proposal will fail if enactment deadline is below the minimum",
+  "ProposalWillFailIfVotingIsBelowTheMinimumDeadline": "The proposal will fail if voting deadline is below the minimum",
+  "ProposalWillFailIfEnactmentIsAboveTheMaximumDeadline": "The proposal will fail if enactment deadline is above the maximum",
+  "ProposalWillFailIfVotingIsAboveTheMaximumDeadline": "The proposal will fail if voting deadline is above the maximum",
   "SelectAMarketToChange": "Select a market to change",
   "MarketName": "Market name",
   "MarketCode": "Market code",
@@ -780,6 +786,7 @@
   "performancePenalty": "Performance penalty",
   "overstaked": "Overstaked",
   "overstakedPenalty": "Overstaked penalty",
+  "multisigPenalty": "Multisig penalty",
   "homeProposalsIntro": "Decisions on the Vega network are on-chain, with tokenholders creating proposals that other tokenholders vote to approve or reject. Network upgrades are proposed and approved by validators.",
   "homeProposalsButtonText": "Browse, vote, and propose",
   "homeValidatorsIntro": "Vega runs on a delegated proof of stake blockchain, where validators earn fees for validating block transactions. Tokenholders can nominate validators by staking tokens to them.",

apps/governance/src/lib/collapsible-toggle-styles.ts

@@ -0,0 +1,6 @@
+import classnames from 'classnames';
+
+export const collapsibleToggleStyles = (toggleState: boolean) =>
+  classnames('mb-4 transition-transform ease-in-out duration-300', {
+    'rotate-180': toggleState,
+  });

apps/governance/src/routes/proposals/components/proposal-description/proposal-description.tsx

@@ -1,9 +1,9 @@
 import ReactMarkdown from 'react-markdown';
-import classnames from 'classnames';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Icon, RoundedWrapper } from '@vegaprotocol/ui-toolkit';
 import { SubHeading } from '../../../../components/heading';
+import { collapsibleToggleStyles } from '../../../../lib/collapsible-toggle-styles';
 
 export const ProposalDescription = ({
   description,
@@ -12,9 +12,6 @@ export const ProposalDescription = ({
 }) => {
   const { t } = useTranslation();
   const [showDescription, setShowDescription] = useState(false);
-  const showDescriptionIconClasses = classnames('mb-4', {
-    'rotate-180': showDescription,
-  });
 
   return (
     <section data-testid="proposal-description">
@@ -24,7 +21,7 @@ export const ProposalDescription = ({
       >
         <div className="flex items-center gap-3">
           <SubHeading title={t('proposalDescription')} />
-          <div className={showDescriptionIconClasses}>
+          <div className={collapsibleToggleStyles(showDescription)}>
             <Icon name="chevron-down" size={8} />
           </div>
         </div>

apps/governance/src/routes/proposals/components/proposal-json/proposal-json.tsx

@@ -1,8 +1,8 @@
-import classnames from 'classnames';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Icon, SyntaxHighlighter } from '@vegaprotocol/ui-toolkit';
 import { SubHeading } from '../../../../components/heading';
+import { collapsibleToggleStyles } from '../../../../lib/collapsible-toggle-styles';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
 
@@ -13,9 +13,6 @@ export const ProposalJson = ({
 }) => {
   const { t } = useTranslation();
   const [showDetails, setShowDetails] = useState(false);
-  const showDetailsIconClasses = classnames('mb-4', {
-    'rotate-180': showDetails,
-  });
 
   return (
     <section data-testid="proposal-json">
@@ -25,7 +22,7 @@ export const ProposalJson = ({
       >
         <div className="flex items-center gap-3">
           <SubHeading title={t('proposalJson')} />
-          <div className={showDetailsIconClasses}>
+          <div className={collapsibleToggleStyles(showDetails)}>
             <Icon name="chevron-down" size={8} />
           </div>
         </div>

apps/governance/src/routes/proposals/components/proposal-market-data/index.tsx

@@ -0,0 +1 @@
+export * from './proposal-market-data';

apps/governance/src/routes/proposals/components/proposal-market-data/proposal-market-data.tsx

@@ -0,0 +1,222 @@
+import isEqual from 'lodash/isEqual';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import {
+  InstrumentInfoPanel,
+  KeyDetailsInfoPanel,
+  LiquidityMonitoringParametersInfoPanel,
+  LiquidityPriceRangeInfoPanel,
+  MetadataInfoPanel,
+  OracleInfoPanel,
+  PriceMonitoringBoundsInfoPanel,
+  RiskFactorsInfoPanel,
+  RiskModelInfoPanel,
+  RiskParametersInfoPanel,
+  SettlementAssetInfoPanel,
+} from '@vegaprotocol/markets';
+import {
+  Accordion,
+  AccordionItem,
+  Button,
+  CopyWithTooltip,
+  Dialog,
+  Icon,
+  SyntaxHighlighter,
+} from '@vegaprotocol/ui-toolkit';
+import { SubHeading } from '../../../../components/heading';
+import { collapsibleToggleStyles } from '../../../../lib/collapsible-toggle-styles';
+import type { MarketInfoWithData } from '@vegaprotocol/markets';
+import type { DataSourceDefinition } from '@vegaprotocol/types';
+import { create } from 'zustand';
+
+type MarketDataDialogState = {
+  isOpen: boolean;
+  open: () => void;
+  close: () => void;
+};
+
+export const useMarketDataDialogStore = create<MarketDataDialogState>(
+  (set) => ({
+    isOpen: false,
+    open: () => set({ isOpen: true }),
+    close: () => set({ isOpen: false }),
+  })
+);
+
+export const ProposalMarketData = ({
+  marketData,
+}: {
+  marketData: MarketInfoWithData;
+}) => {
+  const { t } = useTranslation();
+  const { isOpen, open, close } = useMarketDataDialogStore();
+  const [showDetails, setShowDetails] = useState(false);
+
+  if (!marketData) {
+    return null;
+  }
+
+  const settlementData = marketData.tradableInstrument.instrument.product
+    .dataSourceSpecForSettlementData.data as DataSourceDefinition;
+  const terminationData = marketData.tradableInstrument.instrument.product
+    .dataSourceSpecForTradingTermination.data as DataSourceDefinition;
+
+  const getSigners = (data: DataSourceDefinition) => {
+    if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
+      const signers = data.sourceType.sourceType.signers || [];
+
+      return signers.map(({ signer }) => {
+        return (
+          (signer.__typename === 'ETHAddress' && signer.address) ||
+          (signer.__typename === 'PubKey' && signer.key)
+        );
+      });
+    }
+    return [];
+  };
+
+  return (
+    <section className="relative" data-testid="proposal-market-data">
+      <button
+        onClick={() => setShowDetails(!showDetails)}
+        data-testid="proposal-market-data-toggle"
+      >
+        <div className="flex items-center gap-3">
+          <SubHeading title={t('marketSpecification')} />
+          <div className={collapsibleToggleStyles(showDetails)}>
+            <Icon name="chevron-down" size={8} />
+          </div>
+        </div>
+      </button>
+
+      {showDetails && (
+        <>
+          <div className="float-right">
+            <Button onClick={open} data-testid="view-market-json">
+              {t('viewMarketJson')}
+            </Button>
+          </div>
+          <div className="mb-10">
+            <Accordion>
+              <AccordionItem
+                itemId="key-details"
+                title={t('Key details')}
+                content={<KeyDetailsInfoPanel market={marketData} />}
+              />
+              <AccordionItem
+                itemId="instrument"
+                title={t('Instrument')}
+                content={<InstrumentInfoPanel market={marketData} />}
+              />
+              {isEqual(
+                getSigners(settlementData),
+                getSigners(terminationData)
+              ) ? (
+                <AccordionItem
+                  itemId="oracles"
+                  title={t('Oracle')}
+                  content={
+                    <OracleInfoPanel
+                      market={marketData}
+                      type="settlementData"
+                    />
+                  }
+                />
+              ) : (
+                <>
+                  <AccordionItem
+                    itemId="settlement-oracle"
+                    title={t('Settlement Oracle')}
+                    content={
+                      <OracleInfoPanel
+                        market={marketData}
+                        type="settlementData"
+                      />
+                    }
+                  />
+
+                  <AccordionItem
+                    itemId="termination-oracle"
+                    title={t('Termination Oracle')}
+                    content={
+                      <OracleInfoPanel market={marketData} type="termination" />
+                    }
+                  />
+                </>
+              )}
+              <AccordionItem
+                itemId="settlement-asset"
+                title={t('Settlement asset')}
+                content={<SettlementAssetInfoPanel market={marketData} />}
+              />
+              <AccordionItem
+                itemId="metadata"
+                title={t('Metadata')}
+                content={<MetadataInfoPanel market={marketData} />}
+              />
+              <AccordionItem
+                itemId="risk-model"
+                title={t('Risk model')}
+                content={<RiskModelInfoPanel market={marketData} />}
+              />
+              <AccordionItem
+                itemId="risk-parameters"
+                title={t('Risk parameters')}
+                content={<RiskParametersInfoPanel market={marketData} />}
+              />
+              <AccordionItem
+                itemId="risk-factors"
+                title={t('Risk factors')}
+                content={<RiskFactorsInfoPanel market={marketData} />}
+              />
+              {(
+                marketData.priceMonitoringSettings?.parameters?.triggers || []
+              ).map((_, triggerIndex) => (
+                <AccordionItem
+                  itemId={`trigger-${triggerIndex}`}
+                  title={t(`Price monitoring bounds ${triggerIndex + 1}`)}
+                  content={
+                    <PriceMonitoringBoundsInfoPanel
+                      market={marketData}
+                      triggerIndex={triggerIndex}
+                    />
+                  }
+                />
+              ))}
+              <AccordionItem
+                itemId="liqudity-monitoring-parameters"
+                title={t('Liquidity monitoring parameters')}
+                content={
+                  <LiquidityMonitoringParametersInfoPanel market={marketData} />
+                }
+              />
+              <AccordionItem
+                itemId="liquidity-price-range"
+                title={t('Liquidity price range')}
+                content={<LiquidityPriceRangeInfoPanel market={marketData} />}
+              />
+            </Accordion>
+          </div>
+        </>
+      )}
+
+      <Dialog
+        title={marketData.tradableInstrument.instrument.code}
+        open={isOpen}
+        onChange={(isOpen) => (isOpen ? open() : close())}
+        size="medium"
+        dataTestId="market-json-dialog"
+      >
+        <CopyWithTooltip text={JSON.stringify(marketData)}>
+          <button className="bg-vega-dark-100 rounded-sm py-2 px-3 mb-4 text-white">
+            <span>
+              <Icon name="duplicate" />
+            </span>
+            <span className="ml-2">Copy</span>
+          </button>
+        </CopyWithTooltip>
+        <SyntaxHighlighter data={marketData} />
+      </Dialog>
+    </section>
+  );
+};

apps/governance/src/routes/proposals/components/proposal-votes-table/proposal-votes-table.tsx

@@ -1,4 +1,3 @@
-import classnames from 'classnames';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
@@ -13,6 +12,7 @@ import { SubHeading } from '../../../../components/heading';
 import { useVoteInformation } from '../../hooks';
 import { useAppState } from '../../../../contexts/app-state/app-state-context';
 import { ProposalType } from '../proposal/proposal';
+import { collapsibleToggleStyles } from '../../../../lib/collapsible-toggle-styles';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
 
@@ -57,10 +57,6 @@ export const ProposalVotesTable = ({
     ? t('byTokenVote')
     : t('byLiquidityVote');
 
-  const showDetailsIconClasses = classnames('mb-4', {
-    'rotate-180': showDetails,
-  });
-
   return (
     <>
       <button
@@ -69,7 +65,7 @@ export const ProposalVotesTable = ({
       >
         <div className="flex items-center gap-3">
           <SubHeading title={t('voteBreakdown')} />
-          <div className={showDetailsIconClasses}>
+          <div className={collapsibleToggleStyles(showDetails)}>
             <Icon name="chevron-down" size={8} />
           </div>
         </div>

apps/governance/src/routes/proposals/components/proposal/proposal.spec.tsx

@@ -29,9 +29,6 @@ jest.mock('../proposal-change-table', () => ({
 jest.mock('../proposal-json', () => ({
   ProposalJson: () => <div data-testid="proposal-json"></div>,
 }));
-jest.mock('../proposal-terms/proposal-terms', () => ({
-  ProposalTerms: () => <div data-testid="proposal-terms"></div>,
-}));
 jest.mock('../proposal-votes-table', () => ({
   ProposalVotesTable: () => <div data-testid="proposal-votes-table"></div>,
 }));
@@ -74,7 +71,6 @@ it('renders each section', async () => {
   expect(await screen.findByTestId('proposal-header')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-change-table')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-json')).toBeInTheDocument();
-  expect(screen.getByTestId('proposal-terms')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-votes-table')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-vote-details')).toBeInTheDocument();
   expect(screen.queryByTestId('proposal-list-asset')).not.toBeInTheDocument();

apps/governance/src/routes/proposals/components/proposal/proposal.tsx

@@ -1,22 +1,22 @@
+import { useTranslation } from 'react-i18next';
+import { Link } from 'react-router-dom';
 import {
   NetworkParams,
   useNetworkParams,
 } from '@vegaprotocol/network-parameters';
 import { AsyncRenderer, Icon, RoundedWrapper } from '@vegaprotocol/ui-toolkit';
 import { ProposalHeader } from '../proposal-detail-header/proposal-header';
-import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
-import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
 import { ProposalDescription } from '../proposal-description';
 import { ProposalChangeTable } from '../proposal-change-table';
 import { ProposalJson } from '../proposal-json';
-import { ProposalTerms } from '../proposal-terms';
 import { ProposalVotesTable } from '../proposal-votes-table';
 import { VoteDetails } from '../vote-details';
 import { ListAsset } from '../list-asset';
-import { Link } from 'react-router-dom';
 import Routes from '../../../routes';
-import React from 'react';
-import { useTranslation } from 'react-i18next';
+import { ProposalMarketData } from '../proposal-market-data';
+import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
+import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import type { MarketInfoWithData } from '@vegaprotocol/markets';
 
 export enum ProposalType {
   PROPOSAL_NEW_MARKET = 'PROPOSAL_NEW_MARKET',
@@ -28,11 +28,16 @@ export enum ProposalType {
 }
 export interface ProposalProps {
   proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
+  newMarketData?: MarketInfoWithData | null;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   restData: any;
 }
 
-export const Proposal = ({ proposal, restData }: ProposalProps) => {
+export const Proposal = ({
+  proposal,
+  restData,
+  newMarketData,
+}: ProposalProps) => {
   const { t } = useTranslation();
   const { params, loading, error } = useNetworkParams([
     NetworkParams.governance_proposal_market_minVoterBalance,
@@ -97,51 +102,58 @@ export const Proposal = ({ proposal, restData }: ProposalProps) => {
         </div>
         <ProposalHeader proposal={proposal} isListItem={false} />
 
-        <div className="my-10">
-          <ProposalChangeTable proposal={proposal} />
-        </div>
+        <div id="details">
+          <div className="my-10">
+            <ProposalChangeTable proposal={proposal} />
+          </div>
 
-        {proposal.terms.change.__typename === 'NewAsset' &&
-        proposal.terms.change.source.__typename === 'ERC20' &&
-        proposal.id ? (
-          <ListAsset
-            assetId={proposal.id}
-            withdrawalThreshold={proposal.terms.change.source.withdrawThreshold}
-            lifetimeLimit={proposal.terms.change.source.lifetimeLimit}
-          />
-        ) : null}
+          {proposal.terms.change.__typename === 'NewAsset' &&
+          proposal.terms.change.source.__typename === 'ERC20' &&
+          proposal.id ? (
+            <ListAsset
+              assetId={proposal.id}
+              withdrawalThreshold={
+                proposal.terms.change.source.withdrawThreshold
+              }
+              lifetimeLimit={proposal.terms.change.source.lifetimeLimit}
+            />
+          ) : null}
 
-        <div className="mb-4">
-          <ProposalDescription description={proposal.rationale.description} />
-        </div>
+          <div className="mb-4">
+            <ProposalDescription description={proposal.rationale.description} />
+          </div>
 
-        {proposal.terms.change.__typename !== 'NewMarket' &&
-          proposal.terms.change.__typename !== 'UpdateMarket' &&
-          proposal.terms.change.__typename !== 'NewFreeform' && (
+          {newMarketData && (
             <div className="mb-4">
-              <ProposalTerms data={proposal.terms} />
+              <ProposalMarketData marketData={newMarketData} />
             </div>
           )}
 
-        <div className="mb-6">
-          <ProposalJson proposal={restData?.data?.proposal} />
+          <div className="mb-6">
+            <ProposalJson proposal={restData?.data?.proposal} />
+          </div>
         </div>
 
-        <div className="mb-10">
-          <RoundedWrapper paddingBottom={true}>
-            <VoteDetails
+        <div id="voting">
+          <div className="mb-10">
+            <RoundedWrapper paddingBottom={true}>
+              <VoteDetails
+                proposal={proposal}
+                proposalType={proposalType}
+                minVoterBalance={minVoterBalance}
+                spamProtectionMinTokens={
+                  params?.spam_protection_voting_min_tokens
+                }
+              />
+            </RoundedWrapper>
+          </div>
+
+          <div className="mb-4">
+            <ProposalVotesTable
               proposal={proposal}
               proposalType={proposalType}
-              minVoterBalance={minVoterBalance}
-              spamProtectionMinTokens={
-                params?.spam_protection_voting_min_tokens
-              }
             />
-          </RoundedWrapper>
-        </div>
-
-        <div className="mb-4">
-          <ProposalVotesTable proposal={proposal} proposalType={proposalType} />
+          </div>
         </div>
       </section>
     </AsyncRenderer>

apps/governance/src/routes/proposals/components/propose/proposal-form-vote-and-enactment-deadline.spec.tsx

@@ -224,7 +224,47 @@ describe('Proposal form vote, validation and enactment deadline', () => {
     expect(
       screen.getByTestId('enactment-before-voting-deadline')
     ).toHaveTextContent(
-      'Proposal will fail if enactment is earlier than the voting deadline'
+      'The proposal will fail if enactment is earlier than the voting deadline'
+    );
+  });
+
+  it('displays error text if the vote deadline is set earlier than the minimum allowed', () => {
+    renderComponent();
+    const voteDeadlineInput = screen.getByTestId('proposal-vote-deadline');
+    fireEvent.change(voteDeadlineInput, { target: { value: 0.01 } });
+    expect(screen.getByTestId('voting-less-than-min')).toHaveTextContent(
+      'The proposal will fail if voting deadline is below the minimum'
+    );
+  });
+
+  it('displays error text if the vote deadline is set later than the maximum allowed', () => {
+    renderComponent();
+    const voteDeadlineInput = screen.getByTestId('proposal-vote-deadline');
+    fireEvent.change(voteDeadlineInput, { target: { value: 100000 } });
+    expect(screen.getByTestId('voting-greater-than-max')).toHaveTextContent(
+      'The proposal will fail if voting deadline is above the maximum'
+    );
+  });
+
+  it('displays error text if the enactment deadline is set earlier than the minimum allowed', () => {
+    renderComponent();
+    const enactmentDeadlineInput = screen.getByTestId(
+      'proposal-enactment-deadline'
+    );
+    fireEvent.change(enactmentDeadlineInput, { target: { value: 0.01 } });
+    expect(screen.getByTestId('enactment-less-than-min')).toHaveTextContent(
+      'The proposal will fail if enactment deadline is below the minimum'
+    );
+  });
+
+  it('displays error text if the enactment deadline is set later than the maximum allowed', () => {
+    renderComponent();
+    const enactmentDeadlineInput = screen.getByTestId(
+      'proposal-enactment-deadline'
+    );
+    fireEvent.change(enactmentDeadlineInput, { target: { value: 100000 } });
+    expect(screen.getByTestId('enactment-greater-than-max')).toHaveTextContent(
+      'The proposal will fail if enactment deadline is above the maximum'
     );
   });
 });

apps/governance/src/routes/proposals/components/propose/proposal-form-vote-and-enactment-deadline.tsx

@@ -220,21 +220,41 @@ const EnactmentForm = ({
           <span data-testid="enactment-date" className="pl-2">
             {getDateTimeFormat().format(deadlineDates.enactment)}
           </span>
-          {deadlines.enactment === minEnactmentHours && (
-            <span
-              data-testid="enactment-2-mins-extra"
-              className="block mt-4 font-light"
-            >
-              {t('ThisWillAdd2MinutesToAllowTimeToConfirmInWallet')}
-            </span>
-          )}
-          {deadlines.enactment && deadlines.enactment < deadlines.vote && (
-            <span
-              data-testid="enactment-before-voting-deadline"
-              className="block mt-4 text-vega-pink"
-            >
-              {t('ProposalWillFailIfEnactmentIsEarlierThanVotingDeadline')}
-            </span>
+          {deadlines.enactment && (
+            <>
+              {deadlines.enactment === minEnactmentHours && (
+                <span
+                  data-testid="enactment-2-mins-extra"
+                  className="block mt-4 font-light"
+                >
+                  {t('ThisWillAdd2MinutesToAllowTimeToConfirmInWallet')}
+                </span>
+              )}
+              {deadlines.enactment < deadlines.vote && (
+                <span
+                  data-testid="enactment-before-voting-deadline"
+                  className="block mt-4 text-vega-pink"
+                >
+                  {t('ProposalWillFailIfEnactmentIsEarlierThanVotingDeadline')}
+                </span>
+              )}
+              {deadlines.enactment < minEnactmentHours && (
+                <span
+                  data-testid="enactment-less-than-min"
+                  className="block mt-4 text-vega-pink"
+                >
+                  {t('ProposalWillFailIfEnactmentIsBelowTheMinimumDeadline')}
+                </span>
+              )}
+              {deadlines.enactment > maxEnactmentHours && (
+                <span
+                  data-testid="enactment-greater-than-max"
+                  className="block mt-4 text-vega-pink"
+                >
+                  {t('ProposalWillFailIfEnactmentIsAboveTheMaximumDeadline')}
+                </span>
+              )}
+            </>
           )}
         </p>
       )}
@@ -500,13 +520,33 @@ export function ProposalFormVoteAndEnactmentDeadline({
             <span data-testid="voting-date" className="pl-2">
               {getDateTimeFormat().format(deadlineDates.vote)}
             </span>
-            {deadlines.vote === minVoteHours && (
-              <span
-                data-testid="voting-2-mins-extra"
-                className="block mt-4 font-light"
-              >
-                {t('ThisWillAdd2MinutesToAllowTimeToConfirmInWallet')}
-              </span>
+            {deadlines.vote && (
+              <>
+                {deadlines.vote === minVoteHours && (
+                  <span
+                    data-testid="voting-2-mins-extra"
+                    className="block mt-4 font-light"
+                  >
+                    {t('ThisWillAdd2MinutesToAllowTimeToConfirmInWallet')}
+                  </span>
+                )}
+                {deadlines.vote < minVoteHours && (
+                  <span
+                    data-testid="voting-less-than-min"
+                    className="block mt-4 text-vega-pink"
+                  >
+                    {t('ProposalWillFailIfVotingIsBelowTheMinimumDeadline')}
+                  </span>
+                )}
+                {deadlines.vote > maxVoteHours && (
+                  <span
+                    data-testid="voting-greater-than-max"
+                    className="block mt-4 text-vega-pink"
+                  >
+                    {t('ProposalWillFailIfVotingIsAboveTheMaximumDeadline')}
+                  </span>
+                )}
+              </>
             )}
           </p>
         )}

apps/governance/src/routes/proposals/components/vote-details/use-user-vote.tsx

@@ -1,11 +1,10 @@
 import { captureMessage } from '@sentry/minimal';
-
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { VoteValue } from '@vegaprotocol/types';
 import { useEffect, useState } from 'react';
 import { useUserVoteQuery } from './__generated__/Vote';
-import type { FinalizedVote } from '@vegaprotocol/proposals';
 import { removePaginationWrapper } from '@vegaprotocol/utils';
+import type { FinalizedVote } from '@vegaprotocol/proposals';
 
 export enum VoteState {
   NotCast = 'NotCast',
@@ -45,21 +44,23 @@ export function useUserVote(
   );
 
   useEffect(() => {
-    if (finalizedVote?.vote.value) {
+    if (finalizedVote?.vote.value && finalizedVote.pubKey === pubKey) {
       setUserVote(finalizedVote);
-    } else if (data?.party?.votesConnection?.edges) {
-      // This sets the vote (if any) when the user first loads the page
-      setUserVote(
-        removePaginationWrapper(data?.party?.votesConnection?.edges).find(
-          ({ proposalId: pId }) => proposalId === pId
-        )
-      );
+    } else if (data?.party?.votesConnection?.edges && pubKey) {
+      const vote = removePaginationWrapper(
+        data?.party?.votesConnection?.edges
+      ).find(({ proposalId: pId }) => proposalId === pId);
+
+      if (vote) {
+        setUserVote({ ...vote, pubKey });
+      }
     }
   }, [
     finalizedVote?.vote.value,
     data?.party?.votesConnection?.edges,
     finalizedVote,
     proposalId,
+    pubKey,
   ]);
 
   // If user vote changes update the vote state
@@ -94,6 +95,8 @@ export function useUserVote(
   return {
     voteState,
     userVote,
-    voteDatetime: userVote ? new Date(userVote.vote.datetime) : null,
+    voteDatetime: userVote?.vote?.datetime
+      ? new Date(userVote.vote.datetime)
+      : null,
   };
 }

apps/governance/src/routes/proposals/proposal/proposal-container.tsx

@@ -7,6 +7,8 @@ import { ProposalNotFound } from '../components/proposal-not-found';
 import { useProposalQuery } from './__generated__/Proposal';
 import { useFetch } from '@vegaprotocol/react-helpers';
 import { ENV } from '../../../config';
+import { useDataProvider } from '@vegaprotocol/data-provider';
+import { marketInfoWithDataProvider } from '@vegaprotocol/markets';
 
 export const ProposalContainer = () => {
   const params = useParams<{ proposalId: string }>();
@@ -20,15 +22,36 @@ export const ProposalContainer = () => {
     skip: !params.proposalId,
   });
 
+  const {
+    data: newMarketData,
+    loading: newMarketLoading,
+    error: newMarketError,
+  } = useDataProvider({
+    dataProvider: marketInfoWithDataProvider,
+    skipUpdates: true,
+    variables: {
+      marketId: data?.proposal?.id || '',
+      skip: !data?.proposal?.id,
+    },
+  });
+
   useEffect(() => {
-    const interval = setInterval(refetch, 1000);
+    const interval = setInterval(refetch, 2000);
     return () => clearInterval(interval);
   }, [refetch]);
 
   return (
-    <AsyncRenderer loading={loading} error={error} data={data}>
+    <AsyncRenderer
+      loading={loading || newMarketLoading}
+      error={error || newMarketError}
+      data={newMarketData ? { newMarketData, data } : data}
+    >
       {data?.proposal ? (
-        <Proposal proposal={data.proposal} restData={restData} />
+        <Proposal
+          proposal={data.proposal}
+          restData={restData}
+          newMarketData={newMarketData}
+        />
       ) : (
         <ProposalNotFound />
       )}

apps/governance/src/routes/staking/home/validator-tables/consensus-validators-table.tsx

@@ -36,6 +36,7 @@ import {
   toBigNum,
 } from '@vegaprotocol/utils';
 import { VALIDATOR_LOGO_MAP } from './logo-map';
+import { getMultisigStatusInfo } from '../../../../lib/get-multisig-status-info';
 
 interface CanonisedConsensusNodeProps {
   id: string;
@@ -137,6 +138,10 @@ export const ConsensusValidatorsTable = ({
     [totalStake]
   );
 
+  const multisigStatus = previousEpochData
+    ? getMultisigStatusInfo(previousEpochData)
+    : undefined;
+
   const allNodesInPreviousEpoch = removePaginationWrapper(
     previousEpochData?.epoch.validatorsConnection?.edges
   );
@@ -223,6 +228,8 @@ export const ConsensusValidatorsTable = ({
             [ValidatorFields.USER_STAKE_SHARE]: userStakeShare
               ? formatNumberPercentage(new BigNumber(userStakeShare), 2)
               : undefined,
+            [ValidatorFields.MULTISIG_ERROR]:
+              multisigStatus?.showMultisigStatusError,
           };
         }
       );
@@ -332,6 +339,7 @@ export const ConsensusValidatorsTable = ({
     data,
     decimals,
     hideTopThird,
+    multisigStatus?.showMultisigStatusError,
     previousEpochData,
     thirdOfTotalStake,
     validatorsView,

apps/governance/src/routes/staking/home/validator-tables/shared.tsx

@@ -39,6 +39,7 @@ export enum ValidatorFields {
   STAKED_BY_USER = 'stakedByUser',
   PENDING_USER_STAKE = 'pendingUserStake',
   USER_STAKE_SHARE = 'userStakeShare',
+  MULTISIG_ERROR = 'multisigError',
 }
 
 export const addUserDataToValidator = (
@@ -326,6 +327,7 @@ interface TotalPenaltiesRendererProps {
     overstakedAmount: string;
     overstakingPenalty: string;
     totalPenalties: string;
+    multisigError?: boolean;
   };
 }
 
@@ -344,10 +346,11 @@ export const TotalPenaltiesRenderer = ({
           <div data-testid="overstaked-penalty-tooltip">
             {t('overstakedPenalty')}: {data.overstakingPenalty}
           </div>
-          <div data-testid="total-penalty-tooltip">
-            {t('totalPenalties')}:{' '}
-            <span className="font-bold">{data.totalPenalties}</span>
-          </div>
+          {data.multisigError && (
+            <div data-testid="multisig-error-tooltip">
+              {t('multisigPenalty')}: 100%
+            </div>
+          )}
         </>
       }
     >

apps/trading-e2e/.env

@@ -14,6 +14,7 @@ NX_VEGA_WALLET_URL=http://localhost:1789
 NX_ETH_LOCAL_PROVIDER_URL=http://localhost:8545/
 NX_ETH_WALLET_MNEMONIC="ozone access unlock valid olympic save include omit supply green clown session"
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72
+NX_SENTRY_DSN=https://dummy@o999999.ingest.sentry.io/9999999
 
 # Expose some env vars to cypress environment for market setup
 CYPRESS_ETH_WALLET_MNEMONIC=ozone access unlock valid olympic save include omit supply green clown session

apps/trading-e2e/src/integration/charts-depth.cy.ts

@@ -0,0 +1,15 @@
+describe('charts', { tags: '@smoke' }, () => {
+  before(() => {
+    cy.mockTradingPage();
+    cy.mockSubscription();
+    cy.visit('/#/markets/market-0');
+    cy.wait('@Markets');
+    cy.getByTestId('Depth').click();
+  });
+
+  it('can see market depth chart', () => {
+    // 6006-DEPC-001
+    cy.getByTestId('tab-depth').should('be.visible');
+    cy.get('.depth-chart-module_canvas__260De').should('be.visible');
+  });
+});

apps/trading-e2e/src/integration/home-node-network.cy.ts

@@ -1,10 +1,8 @@
 const dialogContent = 'dialog-content';
 const nodeHealth = 'node-health';
-const statusIncidentsLink = 'footer [data-testid=external-link]';
 
 describe('home', { tags: '@regression' }, () => {
   before(() => {
-    cy.clearAllLocalStorage();
     cy.mockTradingPage();
     cy.mockSubscription();
     cy.visit('/');
@@ -76,23 +74,14 @@ describe('home', { tags: '@regression' }, () => {
       cy.visit('/');
     });
 
-    // 0006-NETW-002
-    // 0006-NETW-003
-    // 0006-NETW-011
     it('switch to fairground network and check status & incidents link', () => {
+      // 0006-NETW-002
+      // 0006-NETW-003
       cy.getByTestId('navigation')
         .find('[data-testid="network-switcher"]')
+        .should('have.text', 'Custom')
         .click();
-      cy.getByTestId('network-item').contains('Fairground testnet').click();
-      cy.get('[aria-haspopup="menu"]').should('contain.text', 'Fairground');
-      cy.url().should('include', 'fairground.wtf');
-      cy.contains('Continue').click();
-      cy.get(statusIncidentsLink)
-        .children('span')
-        .should('have.text', 'Mainnet status & incidents');
-      cy.get(statusIncidentsLink)
-        .should('have.attr', 'href')
-        .and('contain', 'https://blog.vega.xyz/tagged/vega-incident-reports');
+      cy.getByTestId('network-item').contains('Fairground testnet');
     });
   });
 });

apps/trading-e2e/src/integration/market-info.cy.ts

@@ -182,7 +182,7 @@ describe('market info is displayed', { tags: '@smoke' }, () => {
       .contains('Liquidity monitoring parameters')
       .click();
 
-    validateMarketDataRow(0, 'Triggering Ratio', '0');
+    validateMarketDataRow(0, 'Triggering Ratio', '0.7');
     validateMarketDataRow(1, 'Time Window', '3,600');
     validateMarketDataRow(2, 'Scaling Factor', '10');
   });

apps/trading-e2e/src/integration/market-liquidity.cy.ts

@@ -81,6 +81,7 @@ describe('liquidity table - trading', { tags: '@smoke' }, () => {
 
     cy.get(rowSelector).first().find(colFee).should('have.text', '0.09%');
 
+    // 5002-LIQP-013
     cy.get(rowSelector)
       .first()
       .find(colAverageEntryValuation)
@@ -165,7 +166,7 @@ describe('liquidity table view', { tags: '@smoke' }, () => {
   });
 
   it('can see liquidity supplied', () => {
-    //// 5002-LIQP-008
+    // 5002-LIQP-008
     cy.getByTestId(marketSummaryBlock).within(() => {
       cy.getByTestId('liquidity-supplied').within(() => {
         cy.getByTestId(itemHeader).should('have.text', 'Liquidity supplied');
@@ -237,6 +238,7 @@ describe('liquidity table view', { tags: '@smoke' }, () => {
         .find(colFee)
         .should('have.text', '0.09%');
 
+      // 5002-LIQP-013
       cy.get(rowSelectorLiquidityActive)
         .first()
         .find(colAverageEntryValuation)
@@ -268,7 +270,7 @@ describe('liquidity table view', { tags: '@smoke' }, () => {
     });
 
     it('renders liquidity inactive table correctly', () => {
-      //// 5002-LIQP-012
+      // 5002-LIQP-012
       cy.getByTestId('Inactive').click();
       cy.get(rowSelectorLiquidityInactive)
         .first()

apps/trading-e2e/src/integration/trading-accounts.cy.ts

@@ -128,6 +128,7 @@ describe('accounts', { tags: '@smoke' }, () => {
           cy.wrap(btn).click();
         });
       }
+      cy.contains('Loading...').should('not.exist');
     });
     // 7001-COLL-010
     it('sorting by asset', () => {
@@ -146,12 +147,17 @@ describe('accounts', { tags: '@smoke' }, () => {
     it('sorting by total', () => {
       cy.getByTestId('Collateral').click();
       const marketsSortedDefault = [
-        '1,000.00',
+        '1,000.00002',
         '1,000.01',
         '1,000.00',
+        '1,000.00001',
+      ];
+      const marketsSortedAsc = [
         '1,000.00',
+        '1,000.00001',
+        '1,000.00002',
+        '1,000.01',
       ];
-      const marketsSortedAsc = ['1,000.00', '1,000.00', '1,000.00', '1,000.01'];
       const marketsSortedDesc = Array.from(marketsSortedAsc).reverse();
 
       checkSorting(
@@ -188,19 +194,24 @@ describe('accounts', { tags: '@smoke' }, () => {
       );
     });
 
-    it('sorting by total', () => {
+    it('sorting by available', () => {
       cy.getByTestId('Collateral').click();
       const marketsSortedDefault = [
-        '1,000.00',
-        '1,000.01',
+        '1,000.00002',
         '1,000.00',
         '1,000.00',
+        '1,000.00001',
+      ];
+      const marketsSortedAsc = [
+        '1,000.00',
+        '1,000.00',
+        '1,000.00001',
+        '1,000.00002',
       ];
-      const marketsSortedAsc = ['1,000.00', '1,000.00', '1,000.00', '1,000.01'];
       const marketsSortedDesc = Array.from(marketsSortedAsc).reverse();
 
       checkSorting(
-        'total',
+        'available',
         marketsSortedDefault,
         marketsSortedAsc,
         marketsSortedDesc

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

@@ -1,6 +1,10 @@
 import * as Schema from '@vegaprotocol/types';
 import { aliasGQLQuery } from '@vegaprotocol/cypress';
-import { accountsQuery, amendGeneralAccountBalance } from '@vegaprotocol/mock';
+import {
+  accountsQuery,
+  amendGeneralAccountBalance,
+  amendMarginAccountBalance,
+} from '@vegaprotocol/mock';
 import type { OrderSubmission } from '@vegaprotocol/wallet';
 import { createOrder } from '../support/create-order';
 
@@ -12,8 +16,9 @@ describe(
       beforeEach(() => {
         cy.setVegaWallet();
         cy.mockTradingPage();
-        const accounts = accountsQuery();
-        amendGeneralAccountBalance(accounts, 'market-0', '0');
+        let accounts = accountsQuery();
+        accounts = amendMarginAccountBalance(accounts, 'market-0', '1000');
+        accounts = amendGeneralAccountBalance(accounts, 'market-0', '0');
         cy.mockGQL((req) => {
           aliasGQLQuery(req, 'Accounts', accounts);
         });
@@ -23,6 +28,11 @@ describe(
       });
 
       it('should show an error if your balance is zero', () => {
+        const accounts = accountsQuery();
+        amendMarginAccountBalance(accounts, 'market-0', '0');
+        cy.mockGQL((req) => {
+          aliasGQLQuery(req, 'Accounts', accounts);
+        });
         // 7002-SORD-060
         cy.getByTestId('place-order').should('be.enabled');
         // 7002-SORD-003
@@ -40,8 +50,9 @@ describe(
       beforeEach(() => {
         cy.setVegaWallet();
         cy.mockTradingPage();
-        const accounts = accountsQuery();
-        amendGeneralAccountBalance(accounts, 'market-0', '1');
+        let accounts = accountsQuery();
+        accounts = amendMarginAccountBalance(accounts, 'market-0', '1000');
+        accounts = amendGeneralAccountBalance(accounts, 'market-0', '1');
         cy.mockGQL((req) => {
           aliasGQLQuery(req, 'Accounts', accounts);
         });

apps/trading-e2e/src/integration/trading-deal-ticket-time-in-force.cy.ts

@@ -5,6 +5,10 @@ import {
   toggleMarket,
 } from '../support/deal-ticket';
 
+const tooltipContent = 'tooltip-content';
+const reduceOnly = 'reduce-only';
+const postOnly = 'post-only';
+
 describe('time in force validation', { tags: '@smoke' }, () => {
   before(() => {
     cy.setVegaWallet();
@@ -122,13 +126,18 @@ describe('time in force validation', { tags: '@smoke' }, () => {
       // 7002-SORD-026
 
       it(`post and reduce order market for ${tif.code}`, function () {
+        // 7003-SORD-054
+        // 7003-SORD-055
+        // 7003-SORD-056
+        // 7003-SORD-057
+
         cy.getByTestId(orderTIFDropDown).select(tif.value);
         cy.get(`[data-testid=${orderTIFDropDown}] option:selected`).should(
           'have.text',
           tif.text
         );
-        cy.getByTestId('post-only').should('be.disabled');
-        cy.getByTestId('reduce-only').should('be.enabled');
+        cy.getByTestId(postOnly).should('be.disabled');
+        cy.getByTestId(reduceOnly).should('be.enabled');
       });
     });
   });
@@ -144,14 +153,33 @@ describe('time in force validation', { tags: '@smoke' }, () => {
 
     validTIFLimit.forEach((tif) => {
       it(`post and reduce order for limit ${tif.code}`, function () {
+        // 7003-SORD-054
+        // 7003-SORD-055
+        // 7003-SORD-056
+        // 7003-SORD-057
         cy.getByTestId(orderTIFDropDown).select(tif.value);
         cy.get(`[data-testid=${orderTIFDropDown}] option:selected`).should(
           'have.text',
           tif.text
         );
-        cy.getByTestId('post-only').should('be.enabled');
-        cy.getByTestId('reduce-only').should('be.disabled');
+        cy.getByTestId(postOnly).should('be.enabled');
+        cy.getByTestId(reduceOnly).should('be.disabled');
       });
     });
+    it(`can see explanation of what post only and reduce only is/does`, function () {
+      // 7003-SORD-058
+      cy.get('[for="post-only"]').should('have.text', 'Post only').realHover();
+      cy.getByTestId(tooltipContent).should(
+        'contain.text',
+        `"Post only" will ensure the order is not filled immediately but is placed on the order book as a passive order. When the order is processed it is either stopped (if it would not be filled immediately), or placed in the order book as a passive order until the price taker matches with it.`
+      );
+      cy.get('[for="reduce-only"]')
+        .should('have.text', 'Reduce only')
+        .realHover();
+      cy.getByTestId(tooltipContent).should(
+        'contain.text',
+        `"Reduce only" can be used only with non-persistent orders, such as "Fill or Kill" or "Immediate or Cancel".`
+      );
+    });
   });
 });

apps/trading-e2e/src/integration/trading-positions.cy.ts

@@ -1,5 +1,4 @@
-import { checkSorting } from '@vegaprotocol/cypress';
-import { aliasGQLQuery } from '@vegaprotocol/cypress';
+import { checkSorting, aliasGQLQuery } from '@vegaprotocol/cypress';
 import { marketsDataQuery } from '@vegaprotocol/mock';
 import { positionsQuery } from '@vegaprotocol/mock';
 
@@ -15,13 +14,12 @@ const toastContent = 'toast-content';
 const tooltipContent = 'tooltip-content';
 // #endregion
 
-beforeEach(() => {
-  cy.mockTradingPage();
-  cy.mockSubscription();
-  cy.setVegaWallet();
-});
-
 describe('positions', { tags: '@smoke', testIsolation: true }, () => {
+  beforeEach(() => {
+    cy.mockTradingPage();
+    cy.mockSubscription();
+    cy.setVegaWallet();
+  });
   it('renders positions on trading page', () => {
     visitAndClickPositions();
     // 7004-POSI-001
@@ -64,7 +62,14 @@ describe('positions', { tags: '@smoke', testIsolation: true }, () => {
     );
   });
 });
+
 describe('positions', { tags: '@regression', testIsolation: true }, () => {
+  beforeEach(() => {
+    cy.mockTradingPage();
+    cy.mockSubscription();
+    cy.setVegaWallet();
+  });
+
   it('rows should be displayed despite errors', () => {
     const errors = [
       {
@@ -164,8 +169,9 @@ describe('positions', { tags: '@regression', testIsolation: true }, () => {
     );
   });
 
+  // let elementWidth: number;
+
   it('Resize column', () => {
-    let elementWidth: number;
     visitAndClickPositions();
     cy.get('.ag-overlay-loading-wrapper').should('not.be.visible');
     cy.get('.ag-header-container').within(() => {
@@ -180,29 +186,33 @@ describe('positions', { tags: '@regression', testIsolation: true }, () => {
     cy.get(`[col-id="marketName"]`)
       .invoke('width')
       .should('be.greaterThan', 250);
-    cy.get(`[col-id="marketName"]`)
-      .invoke('width')
-      .then((width) => {
-        elementWidth = width as number;
-      })
-      .then(() => {
-        let localStorageCopy: Record<string, string>;
-        cy.window().then((win) => {
-          localStorageCopy = { ...win.localStorage };
-        });
+  });
 
-        cy.reload();
-        cy.window().then((win) => {
-          Object.keys(localStorageCopy).forEach((key) => {
-            win.localStorage.setItem(key, localStorageCopy[key]);
-          });
-        });
+  // This test depends on the previous one
+  it('Has persisted column widths', () => {
+    const width = 400;
 
-        // 7004-POSI-012
-        cy.get('[col-id="marketName"]')
-          .invoke('width')
-          .should('equal', elementWidth);
-      });
+    cy.window().then((win) => {
+      win.localStorage.setItem(
+        'vega_positions_store',
+        JSON.stringify({
+          state: {
+            gridStore: {
+              columnState: [{ colId: 'marketName', width }],
+            },
+          },
+        })
+      );
+    });
+
+    visitAndClickPositions();
+
+    // 7004-POSI-012
+    cy.get('.ag-center-cols-container .ag-row')
+      .first()
+      .find('[col-id="marketName"]')
+      .invoke('outerWidth')
+      .should('equal', width);
   });
 
   it('Scroll horizontally', () => {
@@ -291,6 +301,7 @@ describe('positions', { tags: '@regression', testIsolation: true }, () => {
     cy.getByTestId(dialogContent).should('be.visible');
   });
 });
+
 function validatePositionsDisplayed(multiKey = false) {
   cy.getByTestId('tab-positions').should('be.visible');
   cy.getByTestId('tab-positions')
@@ -326,6 +337,7 @@ function validatePositionsDisplayed(multiKey = false) {
 
   cy.getByTestId('close-position').should('be.visible').and('have.length', 3);
 }
+
 function assertPNLColor(
   pnlSelector: string,
   positiveClass: string,
@@ -347,6 +359,7 @@ function assertPNLColor(
     }
   });
 }
+
 function visitAndClickPositions() {
   cy.visit('/#/markets/market-0');
   cy.getByTestId(positions).click();

apps/trading-e2e/src/integration/trading-trades.cy.ts

@@ -1,32 +1,79 @@
-beforeEach(() => {
-  cy.mockTradingPage();
-  cy.mockSubscription();
-  cy.visit('/#/markets/market-0');
-});
+const colHeader = '.ag-header-cell-text';
+const colIdPrice = '[col-id=price]';
+const colIdSize = '[col-id=size]';
+const colIdCreatedAt = '[col-id=createdAt]';
+const tradesTab = 'Trades';
+const tradesTable = 'tab-trades';
 
 describe('trades', { tags: '@smoke' }, () => {
-  const colIdPrice = 'price';
-  const colIdSize = 'size';
-  const colIdCreatedAt = 'createdAt';
+  beforeEach(() => {
+    cy.mockTradingPage();
+    cy.mockSubscription();
+  });
+  before(() => {
+    cy.mockTradingPage();
+    cy.mockSubscription();
+    cy.visit('/#/markets/market-0');
+    cy.getByTestId(tradesTab).click();
+  });
 
-  it('renders trades', () => {
-    cy.getByTestId('Trades').click();
-    cy.getByTestId('tab-trades').should('be.visible');
+  it('show trades', () => {
+    // 6005-THIS-001
+    // 6005-THIS-002
+    cy.getByTestId(tradesTab).should('be.visible');
+    cy.getByTestId(tradesTable).should('be.visible');
+    cy.getByTestId(tradesTable).should('not.be.empty');
+  });
 
-    cy.get(`[col-id=${colIdPrice}]`).each(($tradePrice) => {
+  it('show trades prices', () => {
+    // 6005-THIS-003
+    cy.get(`${colIdPrice} ${colHeader}`).first().should('have.text', 'Price');
+    cy.get(colIdPrice).each(($tradePrice) => {
       cy.wrap($tradePrice).invoke('text').should('not.be.empty');
     });
-    cy.get(`[col-id=${colIdSize}]`).each(($tradeSize) => {
+  });
+
+  it('show trades sizes', () => {
+    // 6005-THIS-004
+    cy.get(`${colIdSize} ${colHeader}`).first().should('have.text', 'Size');
+    cy.get(colIdSize).each(($tradeSize) => {
       cy.wrap($tradeSize).invoke('text').should('not.be.empty');
     });
+  });
 
+  it('show trades date and time', () => {
+    // 6005-THIS-005
+    cy.get(`${colIdCreatedAt} ${colHeader}`).should('have.text', 'Created at');
     const dateTimeRegex =
       /(\d{1,2})\/(\d{1,2})\/(\d{4}), (\d{1,2}):(\d{1,2}):(\d{1,2})/gm;
-    cy.get(`[col-id=${colIdCreatedAt}]`).each(($tradeDateTime, index) => {
+    cy.get(colIdCreatedAt).each(($tradeDateTime, index) => {
       if (index != 0) {
         //ignore header
         cy.wrap($tradeDateTime).invoke('text').should('match', dateTimeRegex);
       }
     });
   });
+
+  it('trades are sorted descending by datetime', () => {
+    // 6005-THIS-006
+    const dateTimes: Date[] = [];
+    cy.get(colIdCreatedAt)
+      .each(($tradeDateTime, index) => {
+        if (index != 0) {
+          //ignore header
+          dateTimes.push(new Date($tradeDateTime.text()));
+        }
+      })
+      .then(() => {
+        expect(dateTimes).to.deep.equal(
+          dateTimes.sort((a, b) => b.getTime() - a.getTime())
+        );
+      });
+  });
+
+  it('copy price to deal ticket form', () => {
+    // 6005-THIS-007
+    cy.get(colIdPrice).last().click();
+    cy.getByTestId('order-price').should('have.value', '171.16898');
+  });
 });

apps/trading/.env.devnet

@@ -2,7 +2,7 @@ NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
-NX_TRADING_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
+NX_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks-internal/main/devnet1/vegawallet-devnet1.toml
 NX_VEGA_ENV=DEVNET
 NX_VEGA_EXPLORER_URL=https://dev.explorer.vega.xyz

apps/trading/.env.mainnet

@@ -1,7 +1,7 @@
 NX_ETHEREUM_PROVIDER_URL=https://eth-mainnet.gateway.pokt.network/v1/lb/af6a2d529a11f8158bc8ca2a
 NX_ETHERSCAN_URL=https://etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
-NX_TRADING_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
+NX_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks/master/mainnet1/mainnet1.toml
 NX_VEGA_ENV=MAINNET
 NX_VEGA_EXPLORER_URL=https://explorer.vega.xyz

apps/trading/.env.stagnet1

@@ -2,7 +2,7 @@ NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
-NX_TRADING_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
+NX_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks-internal/main/stagnet1/vegawallet-stagnet1.toml
 NX_VEGA_ENV=STAGNET1
 NX_VEGA_EXPLORER_URL=https://explorer.stagnet1.vega.rocks

apps/trading/.env.testnet

@@ -2,7 +2,7 @@ NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
-NX_TRADING_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
+NX_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks-internal/main/fairground/vegawallet-fairground.toml
 NX_VEGA_ENV=TESTNET
 NX_VEGA_EXPLORER_URL=https://explorer.fairground.wtf

apps/trading/.env.validators-testnet

@@ -2,7 +2,7 @@ NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
-NX_TRADING_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
+NX_SENTRY_DSN=https://2ffce43721964aafa78277c50654ece4@o286262.ingest.sentry.io/6300613
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks/master/testnet2/testnet2.toml
 NX_VEGA_ENV=VALIDATOR_TESTNET
 NX_VEGA_EXPLORER_URL=https://explorer.validators-testnet.vega.rocks

apps/trading/client-pages/liquidity/liquidity.tsx

@@ -1,7 +1,5 @@
 import {
   matchFilter,
-  liquidityProvisionsDataProvider,
-  LiquidityTable,
   lpAggregatedDataProvider,
   useCheckLiquidityStatus,
 } from '@vegaprotocol/liquidity';
@@ -24,18 +22,16 @@ import {
   ExternalLink,
 } from '@vegaprotocol/ui-toolkit';
 import { useVegaWallet } from '@vegaprotocol/wallet';
-import { memo, useEffect, useRef, useState } from 'react';
+import { memo, useEffect, useState } from 'react';
 
 import { Header, HeaderStat, HeaderTitle } from '../../components/header';
 
-import type { AgGridReact } from 'ag-grid-react';
-
-import type { Filter } from '@vegaprotocol/liquidity';
 import { Link, useParams } from 'react-router-dom';
 import { Links, Routes } from '../../pages/client-router';
 
 import { useMarket, useStaticMarketData } from '@vegaprotocol/markets';
 import { DocsLinks } from '@vegaprotocol/environment';
+import { LiquidityContainer } from '../../components/liquidity-container';
 
 const enum LiquidityTabs {
   Active = 'active',
@@ -49,62 +45,6 @@ export const Liquidity = () => {
   return <LiquidityViewContainer marketId={marketId} />;
 };
 
-const useReloadLiquidityData = (marketId: string | undefined) => {
-  const { reload } = useDataProvider({
-    dataProvider: liquidityProvisionsDataProvider,
-    variables: { marketId: marketId || '' },
-    update: () => true,
-    skip: !marketId,
-  });
-  useEffect(() => {
-    const interval = setInterval(reload, 30000);
-    return () => clearInterval(interval);
-  }, [reload]);
-};
-
-export const LiquidityContainer = ({
-  marketId,
-  filter,
-}: {
-  marketId: string | undefined;
-  filter?: Filter;
-}) => {
-  const gridRef = useRef<AgGridReact | null>(null);
-  const { data: market } = useMarket(marketId);
-
-  // To be removed when liquidityProvision subscriptions are working
-  useReloadLiquidityData(marketId);
-
-  const { data, error } = useDataProvider({
-    dataProvider: lpAggregatedDataProvider,
-    variables: { marketId: marketId || '', filter },
-    skip: !marketId,
-  });
-
-  const assetDecimalPlaces =
-    market?.tradableInstrument.instrument.product.settlementAsset.decimals || 0;
-  const symbol =
-    market?.tradableInstrument.instrument.product.settlementAsset.symbol;
-
-  const { params } = useNetworkParams([
-    NetworkParams.market_liquidity_stakeToCcyVolume,
-  ]);
-  const stakeToCcyVolume = params.market_liquidity_stakeToCcyVolume;
-
-  return (
-    <div className="h-full relative">
-      <LiquidityTable
-        ref={gridRef}
-        rowData={data}
-        symbol={symbol}
-        assetDecimalPlaces={assetDecimalPlaces}
-        stakeToCcyVolume={stakeToCcyVolume}
-        overlayNoRowsTemplate={error ? error.message : t('No data')}
-      />
-    </div>
-  );
-};
-
 const LiquidityViewHeader = memo(({ marketId }: { marketId?: string }) => {
   const { data: market } = useMarket(marketId);
   const { data: marketData } = useStaticMarketData(marketId);

apps/trading/client-pages/market/market-selector.tsx

@@ -8,7 +8,7 @@ import {
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
 import type { CSSProperties } from 'react';
-import { useState } from 'react';
+import { useCallback, useState, useMemo } from 'react';
 import { Link } from 'react-router-dom';
 import { FixedSizeList } from 'react-window';
 import AutoSizer from 'react-virtualized-auto-sizer';
@@ -184,7 +184,6 @@ const MarketList = ({
   if (error) {
     return <div>{error.message}</div>;
   }
-
   return (
     <AutoSizer>
       {({ width, height }) => (
@@ -204,6 +203,29 @@ const MarketList = ({
   );
 };
 
+interface ListItemData {
+  data: MarketMaybeWithDataAndCandles[];
+  onSelect?: (marketId: string) => void;
+  currentMarketId?: string;
+}
+
+const ListItem = ({
+  index,
+  style,
+  data,
+}: {
+  index: number;
+  style: CSSProperties;
+  data: ListItemData;
+}) => (
+  <MarketSelectorItem
+    market={data.data[index]}
+    currentMarketId={data.currentMarketId}
+    style={style}
+    onSelect={data.onSelect}
+  />
+);
+
 const List = ({
   data,
   loading,
@@ -212,28 +234,20 @@ const List = ({
   onSelect,
   noItems,
   currentMarketId,
-}: {
-  data: MarketMaybeWithDataAndCandles[];
+}: ListItemData & {
   loading: boolean;
   width: number;
   height: number;
   noItems: string;
-  onSelect?: (marketId: string) => void;
-  currentMarketId?: string;
 }) => {
-  const row = ({ index, style }: { index: number; style: CSSProperties }) => {
-    const market = data[index];
-
-    return (
-      <MarketSelectorItem
-        market={market}
-        currentMarketId={currentMarketId}
-        style={style}
-        onSelect={onSelect}
-      />
-    );
-  };
-
+  const itemKey = useCallback(
+    (index: number, data: ListItemData) => data.data[index].id,
+    []
+  );
+  const itemData = useMemo(
+    () => ({ data, onSelect, currentMarketId }),
+    [data, onSelect, currentMarketId]
+  );
   if (!data || loading) {
     return (
       <div style={{ width, height }}>
@@ -259,11 +273,13 @@ const List = ({
     <FixedSizeList
       className="virtualized-list"
       itemCount={data.length}
+      itemData={itemData}
       itemSize={130}
+      itemKey={itemKey}
       width={width}
       height={height}
     >
-      {row}
+      {ListItem}
     </FixedSizeList>
   );
 };

apps/trading/client-pages/market/trade-grid.tsx

@@ -19,10 +19,7 @@ import {
   VegaIcon,
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
-import {
-  useMarketClickHandler,
-  useMarketLiquidityClickHandler,
-} from '../../lib/hooks/use-market-click-handler';
+import { useMarketClickHandler } from '../../lib/hooks/use-market-click-handler';
 import { VegaWalletContainer } from '../../components/vega-wallet-container';
 import { HeaderTitle } from '../../components/header';
 import {
@@ -49,7 +46,6 @@ const MarketBottomPanel = memo(
     const [sizes, handleOnLayoutChange] = usePaneLayout({ id: 'bottom' });
     const { screenSize } = useScreenDimensions();
     const onMarketClick = useMarketClickHandler(true);
-    const onOrderTypeClick = useMarketLiquidityClickHandler(true);
 
     return 'xxxl' === screenSize ? (
       <ResizableGrid
@@ -69,10 +65,6 @@ const MarketBottomPanel = memo(
                   <TradingViews.orders.component
                     marketId={marketId}
                     filter={Filter.Open}
-                    onMarketClick={onMarketClick}
-                    onOrderTypeClick={onOrderTypeClick}
-                    enforceBottomPlaceholder
-                    storeKey="marketOpenOrders"
                   />
                 </VegaWalletContainer>
               </Tab>
@@ -81,10 +73,6 @@ const MarketBottomPanel = memo(
                   <TradingViews.orders.component
                     marketId={marketId}
                     filter={Filter.Closed}
-                    onMarketClick={onMarketClick}
-                    onOrderTypeClick={onOrderTypeClick}
-                    enforceBottomPlaceholder
-                    storeKey="marketClosedOrders"
                   />
                 </VegaWalletContainer>
               </Tab>
@@ -93,22 +81,12 @@ const MarketBottomPanel = memo(
                   <TradingViews.orders.component
                     marketId={marketId}
                     filter={Filter.Rejected}
-                    onMarketClick={onMarketClick}
-                    onOrderTypeClick={onOrderTypeClick}
-                    enforceBottomPlaceholder
-                    storeKey="marketRejectOrders"
                   />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="orders" name={t('All')}>
                 <VegaWalletContainer>
-                  <TradingViews.orders.component
-                    marketId={marketId}
-                    onMarketClick={onMarketClick}
-                    onOrderTypeClick={onOrderTypeClick}
-                    enforceBottomPlaceholder
-                    storeKey="marketAllOrders"
-                  />
+                  <TradingViews.orders.component marketId={marketId} />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="fills" name={t('Fills')}>
@@ -116,7 +94,6 @@ const MarketBottomPanel = memo(
                   <TradingViews.fills.component
                     marketId={marketId}
                     onMarketClick={onMarketClick}
-                    storeKey="marketFills"
                   />
                 </VegaWalletContainer>
               </Tab>
@@ -134,8 +111,6 @@ const MarketBottomPanel = memo(
                 <VegaWalletContainer>
                   <TradingViews.positions.component
                     onMarketClick={onMarketClick}
-                    noBottomPlaceholder
-                    storeKey="marketPositions"
                   />
                 </VegaWalletContainer>
               </Tab>
@@ -145,7 +120,6 @@ const MarketBottomPanel = memo(
                     pinnedAsset={pinnedAsset}
                     onMarketClick={onMarketClick}
                     hideButtons
-                    storeKey="marketCollateral"
                   />
                 </VegaWalletContainer>
               </Tab>
@@ -158,10 +132,7 @@ const MarketBottomPanel = memo(
         <Tabs storageKey="console-trade-grid-bottom">
           <Tab id="positions" name={t('Positions')}>
             <VegaWalletContainer>
-              <TradingViews.positions.component
-                onMarketClick={onMarketClick}
-                storeKey="marketPositions"
-              />
+              <TradingViews.positions.component onMarketClick={onMarketClick} />
             </VegaWalletContainer>
           </Tab>
           <Tab id="open-orders" name={t('Open')}>
@@ -169,10 +140,6 @@ const MarketBottomPanel = memo(
               <TradingViews.orders.component
                 marketId={marketId}
                 filter={Filter.Open}
-                onMarketClick={onMarketClick}
-                onOrderTypeClick={onOrderTypeClick}
-                enforceBottomPlaceholder
-                storeKey="marketOpenOrders"
               />
             </VegaWalletContainer>
           </Tab>
@@ -181,10 +148,6 @@ const MarketBottomPanel = memo(
               <TradingViews.orders.component
                 marketId={marketId}
                 filter={Filter.Closed}
-                onMarketClick={onMarketClick}
-                onOrderTypeClick={onOrderTypeClick}
-                enforceBottomPlaceholder
-                storeKey="marketClosedOrders"
               />
             </VegaWalletContainer>
           </Tab>
@@ -193,22 +156,12 @@ const MarketBottomPanel = memo(
               <TradingViews.orders.component
                 marketId={marketId}
                 filter={Filter.Rejected}
-                onMarketClick={onMarketClick}
-                onOrderTypeClick={onOrderTypeClick}
-                enforceBottomPlaceholder
-                storeKey="marketRejectedOrders"
               />
             </VegaWalletContainer>
           </Tab>
           <Tab id="orders" name={t('All')}>
             <VegaWalletContainer>
-              <TradingViews.orders.component
-                marketId={marketId}
-                onMarketClick={onMarketClick}
-                onOrderTypeClick={onOrderTypeClick}
-                enforceBottomPlaceholder
-                storeKey="marketAllOrders"
-              />
+              <TradingViews.orders.component marketId={marketId} />
             </VegaWalletContainer>
           </Tab>
           <Tab id="fills" name={t('Fills')}>
@@ -216,7 +169,6 @@ const MarketBottomPanel = memo(
               <TradingViews.fills.component
                 marketId={marketId}
                 onMarketClick={onMarketClick}
-                storeKey="marketFills"
               />
             </VegaWalletContainer>
           </Tab>
@@ -226,7 +178,6 @@ const MarketBottomPanel = memo(
                 pinnedAsset={pinnedAsset}
                 onMarketClick={onMarketClick}
                 hideButtons
-                storeKey="marketCollateral"
               />
             </VegaWalletContainer>
           </Tab>

apps/trading/client-pages/market/trade-panels.tsx

@@ -39,7 +39,7 @@ export const TradePanels = ({
 }: TradePanelsProps) => {
   const [drawerOpen, setDrawerOpen] = useState(false);
   const onMarketClick = useMarketClickHandler(true);
-  const onOrderTypeClick = useMarketLiquidityClickHandler(true);
+  const onOrderTypeClick = useMarketLiquidityClickHandler();
 
   const [view, setView] = useState<TradingView>('candles');
   const renderView = () => {

apps/trading/client-pages/market/trade-views.tsx

@@ -1,18 +1,19 @@
+import type { ComponentProps } from 'react';
+import { Splash } from '@vegaprotocol/ui-toolkit';
 import { DealTicketContainer } from '@vegaprotocol/deal-ticket';
 import { MarketInfoAccordionContainer } from '@vegaprotocol/markets';
-import { OrderbookContainer } from '@vegaprotocol/market-depth';
-import { OrderListContainer, Filter } from '@vegaprotocol/orders';
-import type { OrderListContainerProps } from '@vegaprotocol/orders';
-import { FillsContainer } from '@vegaprotocol/fills';
-import { PositionsContainer } from '@vegaprotocol/positions';
 import { TradesContainer } from '@vegaprotocol/trades';
-import type { ComponentProps } from 'react';
 import { DepthChartContainer } from '@vegaprotocol/market-depth';
 import { CandlesChartContainer } from '@vegaprotocol/candles-chart';
-import { Splash } from '@vegaprotocol/ui-toolkit';
-import { AccountsContainer } from '../../components/accounts-container';
+import { OrderbookContainer } from '@vegaprotocol/market-depth';
+import { Filter } from '@vegaprotocol/orders';
 import { NO_MARKET } from './constants';
-import { LiquidityContainer } from '../liquidity/liquidity';
+import { FillsContainer } from '../../components/fills-container';
+import { PositionsContainer } from '../../components/positions-container';
+import { AccountsContainer } from '../../components/accounts-container';
+import { LiquidityContainer } from '../../components/liquidity-container';
+import type { OrderContainerProps } from '../../components/orders-container';
+import { OrdersContainer } from '../../components/orders-container';
 
 type MarketDependantView =
   | typeof CandlesChartContainer
@@ -65,25 +66,25 @@ export const TradingViews = {
   positions: { label: 'Positions', component: PositionsContainer },
   activeOrders: {
     label: 'Active',
-    component: (props: OrderListContainerProps) => (
-      <OrderListContainer {...props} filter={Filter.Open} />
+    component: (props: OrderContainerProps) => (
+      <OrdersContainer {...props} filter={Filter.Open} />
     ),
   },
   closedOrders: {
     label: 'Closed',
-    component: (props: OrderListContainerProps) => (
-      <OrderListContainer {...props} filter={Filter.Closed} />
+    component: (props: OrderContainerProps) => (
+      <OrdersContainer {...props} filter={Filter.Closed} />
     ),
   },
   rejectedOrders: {
     label: 'Rejected',
-    component: (props: OrderListContainerProps) => (
-      <OrderListContainer {...props} filter={Filter.Rejected} />
+    component: (props: OrderContainerProps) => (
+      <OrdersContainer {...props} filter={Filter.Rejected} />
     ),
   },
   orders: {
     label: 'All',
-    component: OrderListContainer,
+    component: OrdersContainer,
   },
   collateral: { label: 'Collateral', component: AccountsContainer },
   fills: { label: 'Fills', component: FillsContainer },

apps/trading/client-pages/markets/closed.tsx

@@ -313,7 +313,6 @@ const ClosedMarketsDataGrid = ({
         minWidth: 100,
       }}
       overlayNoRowsTemplate={error ? error.message : t('No markets')}
-      storeKey="closedMarkets"
     />
   );
 };

apps/trading/client-pages/portfolio/deposits-container.tsx

@@ -2,7 +2,6 @@ import { Button } from '@vegaprotocol/ui-toolkit';
 import { useDepositDialog, DepositsTable } from '@vegaprotocol/deposits';
 import { depositsProvider } from '@vegaprotocol/deposits';
 import { t } from '@vegaprotocol/i18n';
-import { useBottomPlaceholder } from '@vegaprotocol/datagrid';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { useRef } from 'react';
@@ -17,17 +16,13 @@ export const DepositsContainer = () => {
     skip: !pubKey,
   });
   const openDepositDialog = useDepositDialog((state) => state.open);
-  const bottomPlaceholderProps = useBottomPlaceholder({ gridRef });
   return (
     <div className="h-full">
-      <div className="h-full relative">
-        <DepositsTable
-          rowData={data || []}
-          ref={gridRef}
-          {...bottomPlaceholderProps}
-          overlayNoRowsTemplate={error ? error.message : t('No deposits')}
-        />
-      </div>
+      <DepositsTable
+        rowData={data}
+        ref={gridRef}
+        overlayNoRowsTemplate={error ? error.message : t('No deposits')}
+      />
       {!isReadOnly && (
         <div className="h-auto flex justify-end px-[11px] py-2 bottom-0 right-3 absolute dark:bg-black/75 bg-white/75 rounded">
           <Button

apps/trading/client-pages/portfolio/portfolio.tsx

@@ -1,29 +1,39 @@
+import { useEffect } from 'react';
+import type { ReactNode } from 'react';
+import { LayoutPriority } from 'allotment';
 import { titlefy } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
-import { PositionsContainer } from '@vegaprotocol/positions';
-import { OrderListContainer } from '@vegaprotocol/orders';
-import { Tab, LocalStoragePersistTabs as Tabs } from '@vegaprotocol/ui-toolkit';
-import { WithdrawalsContainer } from './withdrawals-container';
-import { FillsContainer } from '@vegaprotocol/fills';
-import type { ReactNode } from 'react';
-import { useEffect } from 'react';
+import { useIncompleteWithdrawals } from '@vegaprotocol/withdraws';
 import { usePaneLayout } from '@vegaprotocol/react-helpers';
-import { VegaWalletContainer } from '../../components/vega-wallet-container';
-import { DepositsContainer } from './deposits-container';
-import { LayoutPriority } from 'allotment';
+import { Tab, LocalStoragePersistTabs as Tabs } from '@vegaprotocol/ui-toolkit';
 import { usePageTitleStore } from '../../stores';
-import { LedgerContainer } from '@vegaprotocol/ledger';
+import { useMarketClickHandler } from '../../lib/hooks/use-market-click-handler';
 import { AccountsContainer } from '../../components/accounts-container';
+import { DepositsContainer } from './deposits-container';
+import { FillsContainer } from '../../components/fills-container';
+import { PositionsContainer } from '../../components/positions-container';
+import { WithdrawalsContainer } from './withdrawals-container';
+import { OrdersContainer } from '../../components/orders-container';
+import { VegaWalletContainer } from '../../components/vega-wallet-container';
+import { LedgerContainer } from '../../components/ledger-container';
 import { AccountHistoryContainer } from './account-history-container';
-import {
-  useMarketClickHandler,
-  useMarketLiquidityClickHandler,
-} from '../../lib/hooks/use-market-click-handler';
 import {
   ResizableGrid,
   ResizableGridPanel,
 } from '../../components/resizable-grid';
 
+const WithdrawalsIndicator = () => {
+  const { ready } = useIncompleteWithdrawals();
+  if (!ready || ready.length === 0) {
+    return null;
+  }
+  return (
+    <span className="bg-vega-blue-450 text-white text-[10px] rounded p-[3px] pb-[2px] leading-none">
+      {ready.length}
+    </span>
+  );
+};
+
 export const Portfolio = () => {
   const { updateTitle } = usePageTitleStore((store) => ({
     updateTitle: store.updateTitle,
@@ -34,7 +44,6 @@ export const Portfolio = () => {
   }, [updateTitle]);
 
   const onMarketClick = useMarketClickHandler(true);
-  const onOrderTypeClick = useMarketLiquidityClickHandler(true);
   const [sizes, handleOnLayoutChange] = usePaneLayout({ id: 'portfolio' });
   const wrapperClasses = 'h-full max-h-full flex flex-col';
   return (
@@ -50,29 +59,17 @@ export const Portfolio = () => {
               </Tab>
               <Tab id="positions" name={t('Positions')}>
                 <VegaWalletContainer>
-                  <PositionsContainer
-                    onMarketClick={onMarketClick}
-                    noBottomPlaceholder
-                    storeKey="portfolioPositions"
-                    allKeys
-                  />
+                  <PositionsContainer onMarketClick={onMarketClick} allKeys />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="orders" name={t('Orders')}>
                 <VegaWalletContainer>
-                  <OrderListContainer
-                    onMarketClick={onMarketClick}
-                    onOrderTypeClick={onOrderTypeClick}
-                    storeKey="portfolioOrders"
-                  />
+                  <OrdersContainer />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="fills" name={t('Fills')}>
                 <VegaWalletContainer>
-                  <FillsContainer
-                    onMarketClick={onMarketClick}
-                    storeKey="portfolioFills"
-                  />
+                  <FillsContainer onMarketClick={onMarketClick} />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="ledger-entries" name={t('Ledger entries')}>
@@ -92,10 +89,7 @@ export const Portfolio = () => {
             <Tabs storageKey="console-portfolio-bottom">
               <Tab id="collateral" name={t('Collateral')}>
                 <VegaWalletContainer>
-                  <AccountsContainer
-                    storeKey="portfolioCollateral"
-                    onMarketClick={onMarketClick}
-                  />
+                  <AccountsContainer />
                 </VegaWalletContainer>
               </Tab>
               <Tab id="deposits" name={t('Deposits')}>
@@ -103,7 +97,11 @@ export const Portfolio = () => {
                   <DepositsContainer />
                 </VegaWalletContainer>
               </Tab>
-              <Tab id="withdrawals" name={t('Withdrawals')}>
+              <Tab
+                id="withdrawals"
+                name={t('Withdrawals')}
+                indicator={<WithdrawalsIndicator />}
+              >
                 <WithdrawalsContainer />
               </Tab>
             </Tabs>

apps/trading/client-pages/portfolio/withdrawals-container.tsx

@@ -3,6 +3,7 @@ import {
   withdrawalProvider,
   useWithdrawalDialog,
   WithdrawalsTable,
+  useIncompleteWithdrawals,
 } from '@vegaprotocol/withdraws';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { t } from '@vegaprotocol/i18n';
@@ -17,6 +18,7 @@ export const WithdrawalsContainer = () => {
     skip: !pubKey,
   });
   const openWithdrawDialog = useWithdrawalDialog((state) => state.open);
+  const { ready, delayed } = useIncompleteWithdrawals();
 
   return (
     <VegaWalletContainer>
@@ -25,6 +27,8 @@ export const WithdrawalsContainer = () => {
           data-testid="withdrawals-history"
           rowData={data}
           overlayNoRowsTemplate={error ? error.message : t('No withdrawals')}
+          ready={ready}
+          delayed={delayed}
         />
       </div>
       {!isReadOnly && (

apps/trading/components/accounts-container/accounts-container.tsx

@@ -8,16 +8,19 @@ import { useVegaWallet } from '@vegaprotocol/wallet';
 import type { PinnedAsset } from '@vegaprotocol/accounts';
 import { AccountManager, useTransferDialog } from '@vegaprotocol/accounts';
 import { useDepositDialog } from '@vegaprotocol/deposits';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
 
 export const AccountsContainer = ({
   pinnedAsset,
   hideButtons,
-  storeKey,
   onMarketClick,
 }: {
   pinnedAsset?: PinnedAsset;
   hideButtons?: boolean;
-  storeKey?: string;
   onMarketClick?: (marketId: string, metaKey?: boolean) => void;
 }) => {
   const { pubKey, isReadOnly } = useVegaWallet();
@@ -26,6 +29,12 @@ export const AccountsContainer = ({
   const openDepositDialog = useDepositDialog((store) => store.open);
   const openTransferDialog = useTransferDialog((store) => store.open);
 
+  const gridStore = useAccountStore((store) => store.gridStore);
+  const updateGridStore = useAccountStore((store) => store.updateGridStore);
+  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
+    updateGridStore(colState);
+  });
+
   const onClickAsset = useCallback(
     (assetId?: string) => {
       assetId && openAssetDetailsDialog(assetId);
@@ -51,7 +60,7 @@ export const AccountsContainer = ({
         onMarketClick={onMarketClick}
         isReadOnly={isReadOnly}
         pinnedAsset={pinnedAsset}
-        storeKey={storeKey}
+        gridProps={gridStoreCallbacks}
       />
       {!isReadOnly && !hideButtons && (
         <div className="flex gap-2 justify-end p-2 px-[11px] absolute lg:fixed bottom-0 right-3 dark:bg-black/75 bg-white/75 rounded">
@@ -75,3 +84,9 @@ export const AccountsContainer = ({
     </div>
   );
 };
+
+const useAccountStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_accounts_store',
+  })
+);

apps/trading/components/app-loader/web3-provider.tsx

@@ -1,13 +1,16 @@
+import type { DefaultWeb3ProviderContextShape } from '@vegaprotocol/web3';
 import {
   useEthereumConfig,
   createConnectors,
   Web3Provider as Web3ProviderInternal,
   useWeb3ConnectStore,
+  createDefaultProvider,
 } from '@vegaprotocol/web3';
 import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
 import { t } from '@vegaprotocol/i18n';
 import { useEnvironment } from '@vegaprotocol/environment';
 import type { ReactNode } from 'react';
+import { useState } from 'react';
 import { useEffect } from 'react';
 
 export const Web3Provider = ({ children }: { children: ReactNode }) => {
@@ -17,10 +20,13 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
 
   const connectors = useWeb3ConnectStore((store) => store.connectors);
   const initializeConnectors = useWeb3ConnectStore((store) => store.initialize);
+  const [defaultProvider, setDefaultProvider] = useState<
+    DefaultWeb3ProviderContextShape['provider'] | undefined
+  >(undefined);
 
   useEffect(() => {
     if (config?.chain_id) {
-      return initializeConnectors(
+      initializeConnectors(
         createConnectors(
           ETHEREUM_PROVIDER_URL,
           Number(config?.chain_id),
@@ -29,6 +35,11 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
         ),
         Number(config.chain_id)
       );
+      const defaultProvider = createDefaultProvider(
+        ETHEREUM_PROVIDER_URL,
+        Number(config?.chain_id)
+      );
+      setDefaultProvider(defaultProvider);
     }
   }, [
     config?.chain_id,
@@ -49,7 +60,10 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
       }}
       noDataMessage={t('Could not fetch Ethereum configuration')}
     >
-      <Web3ProviderInternal connectors={connectors}>
+      <Web3ProviderInternal
+        connectors={connectors}
+        defaultProvider={defaultProvider}
+      >
         <>{children}</>
       </Web3ProviderInternal>
     </AsyncRenderer>

apps/trading/components/fills-container/fills-container.tsx

@@ -0,0 +1,49 @@
+import { t } from '@vegaprotocol/i18n';
+import { Splash } from '@vegaprotocol/ui-toolkit';
+import { useVegaWallet } from '@vegaprotocol/wallet';
+import { FillsManager } from '@vegaprotocol/fills';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
+
+export const FillsContainer = ({
+  marketId,
+  onMarketClick,
+}: {
+  marketId?: string;
+  onMarketClick?: (marketId: string, metaKey?: boolean) => void;
+}) => {
+  const { pubKey } = useVegaWallet();
+
+  const gridStore = useFillsStore((store) => store.gridStore);
+  const updateGridStore = useFillsStore((store) => store.updateGridStore);
+
+  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
+    updateGridStore(colState);
+  });
+
+  if (!pubKey) {
+    return (
+      <Splash>
+        <p>{t('Please connect Vega wallet')}</p>
+      </Splash>
+    );
+  }
+
+  return (
+    <FillsManager
+      partyId={pubKey}
+      marketId={marketId}
+      onMarketClick={onMarketClick}
+      gridProps={gridStoreCallbacks}
+    />
+  );
+};
+
+const useFillsStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_fills_store',
+  })
+);

apps/trading/components/fills-container/index.ts

@@ -0,0 +1 @@
+export * from './fills-container';

apps/trading/components/ledger-container/index.ts

@@ -0,0 +1 @@
+export * from './ledger-container';

apps/trading/components/ledger-container/ledger-container.tsx

@@ -0,0 +1,36 @@
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+import { t } from '@vegaprotocol/i18n';
+import { LedgerManager } from '@vegaprotocol/ledger';
+import { Splash } from '@vegaprotocol/ui-toolkit';
+import { useVegaWallet } from '@vegaprotocol/wallet';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+
+export const LedgerContainer = () => {
+  const { pubKey } = useVegaWallet();
+
+  const gridStore = useLedgerStore((store) => store.gridStore);
+  const updateGridStore = useLedgerStore((store) => store.updateGridStore);
+
+  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
+    updateGridStore(colState);
+  });
+
+  if (!pubKey) {
+    return (
+      <Splash>
+        <p>{t('Please connect Vega wallet')}</p>
+      </Splash>
+    );
+  }
+
+  return <LedgerManager partyId={pubKey} gridProps={gridStoreCallbacks} />;
+};
+
+const useLedgerStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_ledger_store',
+  })
+);

apps/trading/components/liquidity-container/index.ts

@@ -0,0 +1 @@
+export * from './liquidity-container';

apps/trading/components/liquidity-container/liquidity-container.tsx

@@ -0,0 +1,93 @@
+import { useDataProvider } from '@vegaprotocol/data-provider';
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+import { t } from '@vegaprotocol/i18n';
+import {
+  lpAggregatedDataProvider,
+  type Filter,
+  LiquidityTable,
+  liquidityProvisionsDataProvider,
+} from '@vegaprotocol/liquidity';
+import { useMarket } from '@vegaprotocol/markets';
+import {
+  NetworkParams,
+  useNetworkParams,
+} from '@vegaprotocol/network-parameters';
+import type { AgGridReact } from 'ag-grid-react';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
+import { useEffect, useRef } from 'react';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+
+export const LiquidityContainer = ({
+  marketId,
+  filter,
+}: {
+  marketId: string | undefined;
+  filter?: Filter;
+}) => {
+  const gridRef = useRef<AgGridReact | null>(null);
+
+  const gridStore = useLiquidityStore((store) => store.gridStore);
+  const updateGridStore = useLiquidityStore((store) => store.updateGridStore);
+
+  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
+    updateGridStore(colState);
+  });
+  const { data: market } = useMarket(marketId);
+
+  // To be removed when liquidityProvision subscriptions are working
+  useReloadLiquidityData(marketId);
+
+  const { data, error } = useDataProvider({
+    dataProvider: lpAggregatedDataProvider,
+    variables: { marketId: marketId || '', filter },
+    skip: !marketId,
+  });
+
+  const assetDecimalPlaces =
+    market?.tradableInstrument.instrument.product.settlementAsset.decimals || 0;
+  const quantum =
+    market?.tradableInstrument.instrument.product.settlementAsset.quantum || 0;
+  const symbol =
+    market?.tradableInstrument.instrument.product.settlementAsset.symbol;
+
+  const { params } = useNetworkParams([
+    NetworkParams.market_liquidity_stakeToCcyVolume,
+  ]);
+  const stakeToCcyVolume = params.market_liquidity_stakeToCcyVolume;
+
+  return (
+    <div className="h-full relative">
+      <LiquidityTable
+        ref={gridRef}
+        rowData={data}
+        symbol={symbol}
+        assetDecimalPlaces={assetDecimalPlaces}
+        quantum={quantum}
+        stakeToCcyVolume={stakeToCcyVolume}
+        overlayNoRowsTemplate={error ? error.message : t('No data')}
+        {...gridStoreCallbacks}
+      />
+    </div>
+  );
+};
+
+const useReloadLiquidityData = (marketId: string | undefined) => {
+  const { reload } = useDataProvider({
+    dataProvider: liquidityProvisionsDataProvider,
+    variables: { marketId: marketId || '' },
+    update: () => true,
+    skip: !marketId,
+  });
+  useEffect(() => {
+    const interval = setInterval(reload, 30000);
+    return () => clearInterval(interval);
+  }, [reload]);
+};
+
+const useLiquidityStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_ledger_store',
+  })
+);

apps/trading/components/liquidity-supplied/liquidity-supplied.tsx

@@ -125,14 +125,19 @@ export const MarketLiquiditySupplied = ({
         </KeyValueTableRow>
       </KeyValueTable>
       <br />
-      <Link href={`/#/liquidity/${marketId}`} data-testid="view-liquidity-link">
-        {t('View liquidity provision table')}
-      </Link>
-      {DocsLinks && (
-        <ExternalLink href={DocsLinks.LIQUIDITY} className="mt-2">
-          {t('Learn about providing liquidity')}
-        </ExternalLink>
-      )}
+      <div className="flex flex-col gap-2">
+        <Link
+          href={`/#/liquidity/${marketId}`}
+          data-testid="view-liquidity-link"
+        >
+          {t('View liquidity provision table')}
+        </Link>
+        {DocsLinks && (
+          <ExternalLink href={DocsLinks.LIQUIDITY} className="mt-2">
+            {t('Learn about providing liquidity')}
+          </ExternalLink>
+        )}
+      </div>
       {showMessage && (
         <p className="mt-4">
           {t(

apps/trading/components/orders-container/index.ts

@@ -0,0 +1 @@
+export * from './orders-container';

apps/trading/components/orders-container/orders-container.spec.tsx

@@ -0,0 +1,106 @@
+import { act, renderHook } from '@testing-library/react';
+import {
+  FilterStatusValue,
+  STORAGE_KEY,
+  useOrderListGridState,
+} from './orders-container';
+import { Filter } from '@vegaprotocol/orders';
+import { OrderType } from '@vegaprotocol/types';
+
+describe('useOrderListGridState', () => {
+  afterAll(() => {
+    localStorage.clear();
+  });
+
+  const setup = (filter: Filter | undefined) => {
+    return renderHook(() => useOrderListGridState(filter));
+  };
+
+  it.each(Object.values(Filter))(
+    'providers correct AgGrid filter for %s',
+    (filter) => {
+      const { result } = setup(filter);
+      expect(typeof result.current.updateGridState).toBe('function');
+      expect(result.current.gridState).toEqual({
+        columnState: undefined,
+        filterModel: {
+          status: {
+            value: FilterStatusValue[filter],
+          },
+        },
+      });
+    }
+  );
+
+  it('provides correct AgGrid filter for all', () => {
+    const { result } = setup(undefined);
+    expect(typeof result.current.updateGridState).toBe('function');
+    expect(result.current.gridState).toEqual({
+      columnState: undefined,
+      filterModel: undefined,
+    });
+  });
+
+  it.each(Object.values(Filter))(
+    'sets and stores column state and filters for %s',
+    (filter) => {
+      const filterModel = {
+        type: {
+          value: [OrderType.TYPE_LIMIT],
+        },
+      };
+      const { result } = setup(filter);
+
+      act(() => {
+        result.current.updateGridState(filter, {
+          filterModel,
+        });
+      });
+
+      expect(result.current.gridState).toEqual({
+        columnState: undefined,
+        filterModel: {
+          ...filterModel,
+          status: {
+            value: FilterStatusValue[filter],
+          },
+        },
+      });
+
+      const columnState = [{ colId: 'status', width: 200 }];
+
+      act(() => {
+        result.current.updateGridState(filter, {
+          columnState,
+        });
+      });
+
+      expect(result.current.gridState).toEqual({
+        columnState,
+        filterModel: {
+          ...filterModel,
+          status: {
+            value: FilterStatusValue[filter],
+          },
+        },
+      });
+
+      const storeKeyMap = {
+        [Filter.Open]: 'open',
+        [Filter.Rejected]: 'rejected',
+        [Filter.Closed]: 'closed',
+      };
+
+      expect(JSON.parse(localStorage.getItem(STORAGE_KEY) || '')).toMatchObject(
+        {
+          state: {
+            [storeKeyMap[filter]]: {
+              columnState,
+              filterModel, // no need to check that status is set, hook will return status
+            },
+          },
+        }
+      );
+    }
+  );
+});

apps/trading/components/orders-container/orders-container.tsx

@@ -0,0 +1,166 @@
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+import { t } from '@vegaprotocol/i18n';
+import { Filter } from '@vegaprotocol/orders';
+import { OrderListManager } from '@vegaprotocol/orders';
+import { Splash } from '@vegaprotocol/ui-toolkit';
+import { useVegaWallet } from '@vegaprotocol/wallet';
+import {
+  useMarketClickHandler,
+  useMarketLiquidityClickHandler,
+} from '../../lib/hooks/use-market-click-handler';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import type { DataGridStore } from '../../stores/datagrid-store-slice';
+import { OrderStatus } from '@vegaprotocol/types';
+
+export const FilterStatusValue = {
+  [Filter.Open]: [OrderStatus.STATUS_ACTIVE, OrderStatus.STATUS_PARKED],
+  [Filter.Closed]: [
+    OrderStatus.STATUS_CANCELLED,
+    OrderStatus.STATUS_EXPIRED,
+    OrderStatus.STATUS_FILLED,
+    OrderStatus.STATUS_PARTIALLY_FILLED,
+    OrderStatus.STATUS_STOPPED,
+  ],
+  [Filter.Rejected]: [OrderStatus.STATUS_REJECTED],
+};
+
+export interface OrderContainerProps {
+  marketId?: string;
+  filter?: Filter;
+}
+
+export const OrdersContainer = ({ marketId, filter }: OrderContainerProps) => {
+  const { pubKey, isReadOnly } = useVegaWallet();
+  const onMarketClick = useMarketClickHandler(true);
+  const onOrderTypeClick = useMarketLiquidityClickHandler();
+  const { gridState, updateGridState } = useOrderListGridState(filter);
+  const gridStoreCallbacks = useDataGridEvents(gridState, (newState) => {
+    updateGridState(filter, newState);
+  });
+
+  if (!pubKey) {
+    return <Splash>{t('Please connect Vega wallet')}</Splash>;
+  }
+
+  return (
+    <OrderListManager
+      partyId={pubKey}
+      marketId={marketId}
+      filter={filter}
+      onMarketClick={onMarketClick}
+      onOrderTypeClick={onOrderTypeClick}
+      isReadOnly={isReadOnly}
+      gridProps={gridStoreCallbacks}
+    />
+  );
+};
+
+export const STORAGE_KEY = 'vega_order_list_store';
+const useOrderListStore = create<{
+  open: DataGridStore;
+  closed: DataGridStore;
+  rejected: DataGridStore;
+  all: DataGridStore;
+  update: (filter: Filter | undefined, gridStore: DataGridStore) => void;
+}>()(
+  persist(
+    (set) => ({
+      open: {},
+      closed: {},
+      rejected: {},
+      all: {},
+      update: (filter, newStore) => {
+        switch (filter) {
+          case Filter.Open: {
+            set((curr) => ({
+              open: {
+                ...curr.open,
+                ...newStore,
+              },
+            }));
+            return;
+          }
+          case Filter.Closed: {
+            set((curr) => ({
+              closed: {
+                ...curr.closed,
+                ...newStore,
+              },
+            }));
+            return;
+          }
+          case Filter.Rejected: {
+            set((curr) => ({
+              rejected: {
+                ...curr.rejected,
+                ...newStore,
+              },
+            }));
+            return;
+          }
+          case undefined: {
+            set((curr) => ({
+              all: {
+                ...curr.all,
+                ...newStore,
+              },
+            }));
+            return;
+          }
+        }
+      },
+    }),
+    {
+      name: STORAGE_KEY,
+    }
+  )
+);
+
+export const useOrderListGridState = (filter: Filter | undefined) => {
+  const updateGridState = useOrderListStore((store) => store.update);
+  const gridState = useOrderListStore((store) => {
+    // Return the column/filter state for the given filter but ensuring that
+    // each filter controlled by the tab is always applied
+    switch (filter) {
+      case Filter.Open: {
+        return {
+          columnState: store.open.columnState,
+          filterModel: {
+            ...store.open.filterModel,
+            status: {
+              value: FilterStatusValue[Filter.Open],
+            },
+          },
+        };
+      }
+      case Filter.Closed: {
+        return {
+          columnState: store.closed.columnState,
+          filterModel: {
+            ...store.closed.filterModel,
+            status: {
+              value: FilterStatusValue[Filter.Closed],
+            },
+          },
+        };
+      }
+      case Filter.Rejected: {
+        return {
+          columnState: store.rejected.columnState,
+          filterModel: {
+            ...store.rejected.filterModel,
+            status: {
+              value: FilterStatusValue[Filter.Rejected],
+            },
+          },
+        };
+      }
+      default: {
+        return store.all;
+      }
+    }
+  });
+
+  return { gridState, updateGridState };
+};

apps/trading/components/positions-container/index.ts

@@ -0,0 +1 @@
+export * from './positions-container';

apps/trading/components/positions-container/positions-container.tsx

@@ -1,21 +1,28 @@
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
 import { t } from '@vegaprotocol/i18n';
+import { PositionsManager } from '@vegaprotocol/positions';
 import { Splash } from '@vegaprotocol/ui-toolkit';
 import { useVegaWallet } from '@vegaprotocol/wallet';
-import { PositionsManager } from './positions-manager';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
 
 export const PositionsContainer = ({
   onMarketClick,
-  noBottomPlaceholder,
-  storeKey,
   allKeys,
 }: {
   onMarketClick?: (marketId: string) => void;
-  noBottomPlaceholder?: boolean;
-  storeKey?: string;
   allKeys?: boolean;
 }) => {
   const { pubKey, pubKeys, isReadOnly } = useVegaWallet();
 
+  const gridStore = usePositionsStore((store) => store.gridStore);
+  const updateGridStore = usePositionsStore((store) => store.updateGridStore);
+  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
+    updateGridStore(colState);
+  });
+
   if (!pubKey) {
     return (
       <Splash>
@@ -38,8 +45,13 @@ export const PositionsContainer = ({
       partyIds={partyIds}
       onMarketClick={onMarketClick}
       isReadOnly={isReadOnly}
-      noBottomPlaceholder={noBottomPlaceholder}
-      storeKey={storeKey}
+      gridProps={gridStoreCallbacks}
     />
   );
 };
+
+const usePositionsStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_positions_store',
+  })
+);

apps/trading/components/welcome-dialog/telemetry-approval.spec.tsx

@@ -1,17 +1,25 @@
-import { render, screen, act } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { TelemetryApproval } from './telemetry-approval';
 
+jest.mock('@vegaprotocol/logger', () => ({
+  SentryInit: () => undefined,
+  SentryClose: () => undefined,
+}));
+
+jest.mock('@vegaprotocol/environment', () => ({
+  useEnvironment: () => ({ VEGA_ENV: 'test', SENTRY_DSN: 'sentry-dsn' }),
+}));
+
 describe('TelemetryApproval', () => {
-  it('click on checkbox should be properly handled', () => {
+  it('click on checkbox should be properly handled', async () => {
     const helpText = 'My help text';
     render(<TelemetryApproval helpText={helpText} />);
     expect(screen.getByRole('checkbox')).toHaveAttribute(
       'data-state',
       'unchecked'
     );
-    act(() => {
-      screen.getByRole('checkbox').click();
-    });
+    await userEvent.click(screen.getByRole('checkbox'));
     expect(screen.getByRole('checkbox')).toHaveAttribute(
       'data-state',
       'checked'

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

@@ -11,6 +11,7 @@ import { WelcomeNoticeDialog } from './welcome-notice-dialog';
 import { useGlobalStore } from '../../stores';
 import { useEnvironment } from '@vegaprotocol/environment';
 import { Networks } from '@vegaprotocol/environment';
+import { isTestEnv } from '@vegaprotocol/utils';
 
 export const WelcomeDialog = () => {
   const { VEGA_ENV } = useEnvironment();
@@ -31,9 +32,7 @@ export const WelcomeDialog = () => {
   );
 
   const isRiskDialogNeeded =
-    riskAccepted !== 'true' &&
-    VEGA_ENV !== Networks.MAINNET &&
-    !('Cypress' in window);
+    riskAccepted !== 'true' && VEGA_ENV !== Networks.MAINNET && !isTestEnv();
 
   const isWelcomeDialogNeeded = pathname === '/' || shouldDisplayWelcomeDialog;
 

apps/trading/lib/config/env.ts

@@ -1,20 +0,0 @@
-const windowOrDefault = (key: string, defaultValue?: string) => {
-  if (typeof window !== 'undefined') {
-    if (window._env_ && window._env_[key]) {
-      return window._env_[key];
-    }
-  }
-  return defaultValue || '';
-};
-
-/**
- * Need to have default value as next in-lines environment variables. Cannot figure out dynamic keys.
- * So must provide the default with the key so that next can figure it out.
- */
-export const ENV = {
-  envName: windowOrDefault('NX_VEGA_ENV', process.env['NX_VEGA_ENV']),
-  dsn: windowOrDefault(
-    'NX_TRADING_SENTRY_DSN',
-    process.env['NX_TRADING_SENTRY_DSN']
-  ),
-};

apps/trading/lib/config/index.ts

@@ -1 +0,0 @@
-export * from './env';

apps/trading/lib/hooks/use-market-click-handler.ts

@@ -20,20 +20,8 @@ export const useMarketClickHandler = (replace = false) => {
   );
 };
 
-export const useMarketLiquidityClickHandler = (replace = false) => {
-  const navigate = useNavigate();
-  const { marketId } = useParams();
-  const { pathname } = useLocation();
-  const isLiquidityPage = pathname.match(/^\/liquidity\/(.+)/);
-  return useCallback(
-    (selectedId: string, metaKey?: boolean) => {
-      const link = Links[Routes.LIQUIDITY](selectedId);
-      if (metaKey) {
-        window.open(`/#${link}`, '_blank');
-      } else if (selectedId !== marketId || !isLiquidityPage) {
-        navigate(link, { replace });
-      }
-    },
-    [navigate, marketId, replace, isLiquidityPage]
-  );
+export const useMarketLiquidityClickHandler = () => {
+  return useCallback((selectedId: string, metaKey?: boolean) => {
+    window.open(`/#/liquidity/${selectedId}`, metaKey ? '_blank' : '_self');
+  }, []);
 };

apps/trading/lib/hooks/use-telemetry-approval.spec.ts

@@ -12,22 +12,26 @@ jest.mock('@vegaprotocol/react-helpers', () => ({
     .fn()
     .mockImplementation(() => [false, mockSetValue, mockRemoveValue]),
 }));
+jest.mock('@vegaprotocol/environment', () => ({
+  useEnvironment: () => ({ VEGA_ENV: 'test', SENTRY_DSN: 'sentry-dsn' }),
+}));
 
 describe('useTelemetryApproval', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
+
   it('hook should return proper array', () => {
-    const res = renderHook(() => useTelemetryApproval());
-    expect(res.result.current[0]).toEqual(false);
-    expect(res.result.current[1]).toEqual(expect.any(Function));
+    const { result } = renderHook(() => useTelemetryApproval());
+    expect(result.current[0]).toEqual(false);
+    expect(result.current[1]).toEqual(expect.any(Function));
     expect(useLocalStorage).toHaveBeenCalledWith(STORAGE_KEY);
   });
 
   it('hook should init stuff properly', async () => {
-    const res = renderHook(() => useTelemetryApproval());
+    const { result } = renderHook(() => useTelemetryApproval());
     await act(() => {
-      res.result.current[1](true);
+      result.current[1](true);
     });
     await waitFor(() => {
       expect(SentryInit).toHaveBeenCalled();
@@ -36,9 +40,9 @@ describe('useTelemetryApproval', () => {
   });
 
   it('hook should close stuff properly', async () => {
-    const res = renderHook(() => useTelemetryApproval());
+    const { result } = renderHook(() => useTelemetryApproval());
     await act(() => {
-      res.result.current[1](false);
+      result.current[1](false);
     });
     await waitFor(() => {
       expect(SentryClose).toHaveBeenCalled();

apps/trading/lib/hooks/use-telemetry-approval.ts

@@ -1,24 +1,25 @@
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import { useCallback } from 'react';
 import { SentryInit, SentryClose } from '@vegaprotocol/logger';
-import { ENV } from '../config';
+import { useEnvironment } from '@vegaprotocol/environment';
 export const STORAGE_KEY = 'vega_telemetry_approval';
 
 export const useTelemetryApproval = (): [
   value: boolean,
   setValue: (value: boolean) => void
 ] => {
+  const { VEGA_ENV, SENTRY_DSN } = useEnvironment();
   const [value, setValue, removeValue] = useLocalStorage(STORAGE_KEY);
   const setApprove = useCallback(
     (value: boolean) => {
-      if (value) {
-        SentryInit(ENV.dsn, ENV.envName);
+      if (value && SENTRY_DSN) {
+        SentryInit(SENTRY_DSN, VEGA_ENV);
         return setValue('1');
       }
       SentryClose();
       removeValue();
     },
-    [setValue, removeValue]
+    [setValue, removeValue, SENTRY_DSN, VEGA_ENV]
   );
   return [Boolean(value), setApprove];
 };

apps/trading/pages/_app.page.tsx

@@ -34,7 +34,6 @@ import { ViewingBanner } from '../components/viewing-banner';
 import { AnnouncementBanner, UpgradeBanner } from '../components/banner';
 import { AppLoader, DynamicLoader } from '../components/app-loader';
 import { Navbar } from '../components/navbar';
-import { ENV } from '../lib/config';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import { activeOrdersProvider } from '@vegaprotocol/orders';
 import { useTelemetryApproval } from '../lib/hooks/use-telemetry-approval';
@@ -155,10 +154,11 @@ const PartyData = () => {
 };
 
 const MaybeConnectEagerly = () => {
+  const { VEGA_ENV, SENTRY_DSN } = useEnvironment();
   useVegaEagerConnect(Connectors);
   const [isTelemetryApproved] = useTelemetryApproval();
   useEthereumEagerConnect(
-    isTelemetryApproved ? { dsn: ENV.dsn, env: ENV.envName } : {}
+    isTelemetryApproved ? { dsn: SENTRY_DSN, env: VEGA_ENV } : {}
   );
 
   const { pubKey, connect } = useVegaWallet();

apps/trading/pages/_document.page.tsx

@@ -20,10 +20,6 @@ export default function Document() {
           href="https://static.vega.xyz/favicon.ico"
         />
         <script src="/theme-setter.js" type="text/javascript" async />
-        {['1', 'true'].includes(process.env['NX_USE_ENV_OVERRIDES'] || '') ? (
-          /* eslint-disable-next-line @next/next/no-sync-scripts */
-          <script src="/assets/env-config.js" type="text/javascript" />
-        ) : null}
       </Head>
       <body className="font-alpha dark:bg-black dark:text-white">
         <Main />

apps/trading/pages/toasts-manager.tsx

@@ -3,12 +3,17 @@ import { useUpdateNetworkParametersToasts } from '@vegaprotocol/proposals';
 import { useVegaTransactionToasts } from '@vegaprotocol/web3';
 import { useEthereumTransactionToasts } from '@vegaprotocol/web3';
 import { useEthereumWithdrawApprovalsToasts } from '@vegaprotocol/web3';
+import { Routes } from './client-router';
+import { useReadyToWithdrawalToasts } from '@vegaprotocol/withdraws';
 
 export const ToastsManager = () => {
   useUpdateNetworkParametersToasts();
   useVegaTransactionToasts();
   useEthereumTransactionToasts();
   useEthereumWithdrawApprovalsToasts();
+  useReadyToWithdrawalToasts({
+    withdrawalsLink: `${Routes.PORTFOLIO}`,
+  });
 
   const toasts = useToasts((store) => store.toasts);
   return <ToastsContainer order="desc" toasts={toasts} />;

apps/trading/stores/datagrid-store-slice.ts

@@ -0,0 +1,25 @@
+import type { ColumnState } from 'ag-grid-community';
+import type { StateCreator } from 'zustand';
+
+export type DataGridStore = {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  filterModel?: { [key: string]: any };
+  columnState?: ColumnState[];
+};
+
+export type DataGridSlice = {
+  gridStore: DataGridStore;
+  updateGridStore: (gridStore: DataGridStore) => void;
+};
+
+export const createDataGridSlice: StateCreator<DataGridSlice> = (set) => ({
+  gridStore: {},
+  updateGridStore: (newStore) => {
+    set((curr) => ({
+      gridStore: {
+        ...curr.gridStore,
+        ...newStore,
+      },
+    }));
+  },
+});

libs/accounts/src/lib/accounts-manager.spec.tsx

@@ -7,6 +7,7 @@ import {
 } from '@testing-library/react';
 import * as helpers from '@vegaprotocol/data-provider';
 import { AccountManager } from './accounts-manager';
+import type { useDataGridEvents } from '@vegaprotocol/datagrid';
 
 const mockedUseDataProvider = jest.fn();
 jest.mock('@vegaprotocol/data-provider', () => ({
@@ -14,6 +15,13 @@ jest.mock('@vegaprotocol/data-provider', () => ({
   useDataProvider: jest.fn(() => mockedUseDataProvider()),
 }));
 
+const gridProps = {
+  onGridReady: jest.fn(),
+  onColumnResized: jest.fn(),
+  onFilterChanged: jest.fn(),
+  onSortChanged: jest.fn(),
+} as unknown as ReturnType<typeof useDataGridEvents>;
+
 describe('AccountManager', () => {
   describe('when rerender', () => {
     beforeEach(() => {
@@ -43,6 +51,7 @@ describe('AccountManager', () => {
           partyId="partyOne"
           onClickAsset={jest.fn}
           isReadOnly={false}
+          gridProps={gridProps}
         />
       );
       expect(
@@ -55,6 +64,7 @@ describe('AccountManager', () => {
             partyId="partyTwo"
             onClickAsset={jest.fn}
             isReadOnly={false}
+            gridProps={gridProps}
           />
         );
       });
@@ -72,6 +82,7 @@ describe('AccountManager', () => {
             partyId="partyOne"
             onClickAsset={jest.fn}
             isReadOnly={false}
+            gridProps={gridProps}
           />
         );
         rerenderer = rerender;
@@ -85,6 +96,7 @@ describe('AccountManager', () => {
             partyId="partyOne"
             onClickAsset={jest.fn}
             isReadOnly={false}
+            gridProps={gridProps}
           />
         );
       });
@@ -110,6 +122,7 @@ describe('AccountManager', () => {
           partyId="partyOne"
           onClickAsset={jest.fn}
           isReadOnly={false}
+          gridProps={gridProps}
         />
       );
     });

libs/accounts/src/lib/accounts-manager.tsx

@@ -11,6 +11,7 @@ import type { PinnedAsset } from './accounts-table';
 import { AccountTable } from './accounts-table';
 import { Dialog } from '@vegaprotocol/ui-toolkit';
 import BreakdownTable from './breakdown-table';
+import type { useDataGridEvents } from '@vegaprotocol/datagrid';
 
 const AccountBreakdown = ({
   assetId,
@@ -72,7 +73,6 @@ export const AccountBreakdownDialog = memo(
     onClose: () => void;
     onMarketClick?: (marketId: string, metaKey?: boolean) => void;
   }) => {
-    console.log('render');
     return (
       <Dialog
         size="medium"
@@ -103,7 +103,7 @@ interface AccountManagerProps {
   onMarketClick?: (marketId: string, metaKey?: boolean) => void;
   isReadOnly: boolean;
   pinnedAsset?: PinnedAsset;
-  storeKey?: string;
+  gridProps?: ReturnType<typeof useDataGridEvents>;
 }
 
 export const AccountManager = ({
@@ -113,12 +113,11 @@ export const AccountManager = ({
   partyId,
   isReadOnly,
   pinnedAsset,
-  storeKey,
   onMarketClick,
+  gridProps,
 }: AccountManagerProps) => {
   const gridRef = useRef<AgGridReact | null>(null);
   const [breakdownAssetId, setBreakdownAssetId] = useState<string>();
-
   const { data, error } = useDataProvider({
     dataProvider: aggregatedAccountsDataProvider,
     variables: { partyId },
@@ -145,8 +144,8 @@ export const AccountManager = ({
         onClickBreakdown={setBreakdownAssetId}
         isReadOnly={isReadOnly}
         pinnedAsset={pinnedAsset}
-        storeKey={storeKey}
         overlayNoRowsTemplate={error ? error.message : t('No accounts')}
+        {...gridProps}
       />
       <AccountBreakdownDialog
         assetId={breakdownAssetId}

libs/accounts/src/lib/accounts-table.tsx

@@ -73,7 +73,6 @@ export interface AccountTableProps extends AgGridReactProps {
   onClickBreakdown?: (assetId: string) => void;
   isReadOnly: boolean;
   pinnedAsset?: PinnedAsset;
-  storeKey?: string;
 }
 
 export const AccountTable = forwardRef<AgGridReact, AccountTableProps>(
@@ -307,7 +306,6 @@ export const AccountTable = forwardRef<AgGridReact, AccountTableProps>(
       <AgGrid
         {...props}
         style={{ width: '100%', height: '100%' }}
-        overlayNoRowsTemplate={t('No accounts')}
         getRowId={({ data }: { data: AccountFields }) => data.asset.id}
         ref={ref}
         tooltipShowDelay={500}

libs/accounts/src/lib/accounts.mock.ts

@@ -151,19 +151,53 @@ export const amendGeneralAccountBalance = (
   marketId: string,
   balance: string
 ) => {
-  if (accounts.party?.accountsConnection?.edges) {
-    const marginAccount = accounts.party.accountsConnection.edges.find(
-      (edge) => edge?.node.market?.id === marketId
-    );
-    if (marginAccount) {
-      const generalAccount = accounts.party.accountsConnection.edges.find(
-        (edge) =>
-          edge?.node.asset.id === marginAccount.node.asset.id &&
-          !edge?.node.market
-      );
-      if (generalAccount) {
-        generalAccount.node.balance = balance;
-      }
-    }
+  if (!accounts.party?.accountsConnection?.edges) {
+    return accounts;
   }
+  const marginAccount = accounts.party?.accountsConnection?.edges?.find(
+    (edge) => edge?.node.market?.id === marketId
+  );
+  if (marginAccount) {
+    const edges = accounts.party.accountsConnection.edges.map((edge) =>
+      edge?.node.asset.id === marginAccount.node.asset.id && !edge?.node.market
+        ? { ...edge, node: { ...edge.node, balance } }
+        : edge
+    );
+    return {
+      ...accounts,
+      party: {
+        ...accounts.party,
+        accountsConnection: {
+          ...accounts.party.accountsConnection,
+          edges,
+        },
+      },
+    };
+  }
+  return accounts;
+};
+
+export const amendMarginAccountBalance = (
+  accounts: AccountsQuery,
+  marketId: string,
+  balance: string
+) => {
+  if (!accounts.party?.accountsConnection?.edges) {
+    return accounts;
+  }
+  const edges = accounts.party?.accountsConnection?.edges?.map((edge) =>
+    edge?.node.market?.id === marketId
+      ? { ...edge, node: { ...edge?.node, balance } }
+      : edge
+  );
+  return {
+    ...accounts,
+    party: {
+      ...accounts.party,
+      accountsConnection: {
+        ...accounts.party.accountsConnection,
+        edges,
+      },
+    },
+  };
 };

libs/accounts/src/lib/transfer-form.tsx

@@ -290,6 +290,14 @@ export const TransferFee = ({
   decimals?: number;
 }) => {
   if (!feeFactor || !amount || !transferAmount || !fee) return null;
+  if (
+    isNaN(Number(feeFactor)) ||
+    isNaN(Number(amount)) ||
+    isNaN(Number(transferAmount)) ||
+    isNaN(Number(fee))
+  ) {
+    return null;
+  }
 
   const totalValue = new BigNumber(transferAmount).plus(fee).toString();
 

libs/announcements/.babelrc

@@ -1,4 +1,12 @@
 {
-  "presets": ["@nrwl/next/babel"],
+  "presets": [
+    [
+      "@nrwl/next/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
   "plugins": []
 }

libs/announcements/.eslintrc.json

@@ -1,6 +1,6 @@
 {
   "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*", "__generated__", "__generated___"],
+  "ignorePatterns": ["!**/*", "__generated__"],
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],

libs/announcements/project.json

@@ -8,7 +8,7 @@
       "executor": "@nrwl/web:rollup",
       "outputs": ["{options.outputPath}"],
       "options": {
-        "outputPath": "dist/libs/accounts",
+        "outputPath": "dist/libs/announcements",
         "tsConfig": "libs/announcements/tsconfig.lib.json",
         "project": "libs/announcements/package.json",
         "entryFile": "libs/announcements/src/index.ts",

libs/candles-chart/src/lib/candles-chart.tsx

@@ -131,7 +131,7 @@ export const CandlesChartContainer = ({
 
   return (
     <div className="h-full flex flex-col">
-      <div className="px-4 py-2 flex flex-row flex-wrap gap-4">
+      <div className="px-4 py-2 flex flex-row flex-wrap gap-2">
         <DropdownMenu
           trigger={
             <DropdownMenuTrigger>

libs/cypress/src/lib/capsule/submit-proposal.ts

@@ -0,0 +1,11 @@
+import type { ProposalSubmissionBody } from '@vegaprotocol/wallet';
+import { sendVegaTx } from './wallet-client';
+import { waitForProposal } from './propose-market';
+import { determineId } from '../utils';
+const vegaPubKey = Cypress.env('VEGA_PUBLIC_KEY');
+
+export async function submitProposal(proposalTx: ProposalSubmissionBody) {
+  cy.highlight('Submitting proposal');
+  const result = await sendVegaTx(vegaPubKey, proposalTx);
+  await waitForProposal(determineId(result.result.transaction.signature.value));
+}

libs/cypress/src/lib/commands/vega-wallet-submit-proposal.ts

@@ -1,5 +1,6 @@
-import { createWalletClient, sendVegaTx } from '../capsule/wallet-client';
+import { createWalletClient } from '../capsule/wallet-client';
 import type { ProposalSubmissionBody } from '@vegaprotocol/wallet';
+import { submitProposal } from '../capsule/submit-proposal';
 
 declare global {
   // eslint-disable-next-line @typescript-eslint/no-namespace
@@ -15,11 +16,8 @@ export const addVegaWalletSubmitProposal = () => {
   Cypress.Commands.add('VegaWalletSubmitProposal', (proposalTx) => {
     const vegaWalletUrl = Cypress.env('VEGA_WALLET_URL');
     const token = Cypress.env('VEGA_WALLET_API_TOKEN');
-    const vegaPubKey = Cypress.env('VEGA_PUBLIC_KEY');
 
     createWalletClient(vegaWalletUrl, token);
-
-    cy.highlight('Submitting proposal');
-    sendVegaTx(vegaPubKey, proposalTx);
+    cy.wrap(submitProposal(proposalTx));
   });
 };

libs/cypress/src/lib/utils.ts

@@ -44,27 +44,35 @@ export const checkSorting = (
   orderTabDesc: string[]
 ) => {
   checkSortChange(orderTabDefault, column);
-  cy.get('.ag-header-container').within(() => {
-    cy.get(`[col-id="${column}"]`).click();
-  });
+  cy.get('.ag-header-container')
+    .last()
+    .within(() => {
+      cy.get(`[col-id="${column}"]`).last().click();
+    });
   checkSortChange(orderTabAsc, column);
-  cy.get('.ag-header-container').within(() => {
-    cy.get(`[col-id="${column}"]`).click();
-  });
+  cy.get('.ag-header-container')
+    .last()
+    .within(() => {
+      cy.get(`[col-id="${column}"]`).click();
+    });
   checkSortChange(orderTabDesc, column);
-  cy.get('.ag-header-container').within(() => {
-    cy.get(`[col-id="${column}"]`).click();
-  });
+  cy.get('.ag-header-container')
+    .last()
+    .within(() => {
+      cy.get(`[col-id="${column}"]`).click();
+    });
 };
 
 const checkSortChange = (tabsArr: string[], column: string) => {
-  cy.get('.ag-center-cols-container').within(() => {
-    tabsArr.forEach((entry, i) => {
-      cy.get(`[row-index="${i}"]`).within(() => {
-        cy.get(`[col-id="${column}"]`).should('have.text', tabsArr[i]);
+  cy.get('.ag-center-cols-container')
+    .last()
+    .within(() => {
+      tabsArr.forEach((entry, i) => {
+        cy.get(`[row-index="${i}"]`).within(() => {
+          cy.get(`[col-id="${column}"]`).should('have.text', tabsArr[i]);
+        });
       });
     });
-  });
 };
 
 type Edges = { node: unknown }[];