chore: update tests for icons

Co-authored-by: asiaznik <artur@vegaprotocol.io>

.github/ISSUE_TEMPLATE/feature-epic.md

@@ -1,7 +1,7 @@
 ---
 name: Feature Epic
 about: A template to capture and scope user requirements, high level process, and basic mockups for an upcoming feature as part of the initial core spec review process.
-title: 'Epic: '
+title: 'FEATURE EPIC: '
 labels: feature-epic
 ---
 

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

@@ -137,7 +137,7 @@ jobs:
     secrets: inherit
     with:
       projects: ${{ needs.lint-test-build.outputs.projects-e2e }}
-      tags: '@smoke @regression'
+      tags: '@smoke'
 
   publish-dist:
     needs: lint-test-build

.github/workflows/console-test-run.yml

@@ -10,8 +10,8 @@ on:
 jobs:
   run-tests:
     name: run-tests
-    runs-on: ubuntu-22.04
-    timeout-minutes: 25
+    runs-on: 8-cores
+    timeout-minutes: 20
     steps:
       #----------------------------------------------
       #       check-out frontend-monorepo
@@ -125,7 +125,7 @@ jobs:
       #----------------------------------------------
       - name: Run tests
         working-directory: ./console-test
-        run: poetry run pytest --numprocesses auto
+        run: poetry run pytest -s --numprocesses auto
       - name: Check files
         run: |
           ls -al .

apps/explorer-e2e/cypress.config.js

@@ -23,6 +23,7 @@ module.exports = defineConfig({
     viewportWidth: 1440,
     viewportHeight: 900,
     testIsolation: false,
+    experimentalMemoryManagement: true,
   },
   env: {
     environment: 'CUSTOM',

apps/explorer-e2e/src/integration/market.cy.js

@@ -1,8 +1,8 @@
+import { createSuccessorMarketProposal } from '../support/governance.functions';
+
 context('Market page', { tags: '@regression' }, function () {
   describe('Verify elements on page', function () {
     const marketHeaders = 'markets-heading';
-    const createdMarketId =
-      '2eab0e66545a789047561bc5a2e5cbc3b19eb708da41104e3cac2474ee36c4d4';
 
     before('Create market', function () {
       cy.visit('/');
@@ -11,7 +11,7 @@ context('Market page', { tags: '@regression' }, function () {
 
     beforeEach('Get market id', function () {
       cy.navigate_to('markets');
-      cy.get('[col-id="id"]').eq(1).invoke('text').as('createdMarketId');
+      cy.get('[col-id="id"]').last().invoke('text').as('createdMarketId');
     });
 
     it('Market displayed on market page', function () {
@@ -106,6 +106,7 @@ context('Market page', { tags: '@regression' }, function () {
       // Able to view Json
       cy.contains('View JSON').click();
       cy.get('.language-json').should('exist');
+      cy.getByTestId('icon-cross').click();
     });
 
     // Skipping due to resize observer loop limit error
@@ -113,17 +114,60 @@ context('Market page', { tags: '@regression' }, function () {
       cy.common_switch_to_mobile_and_click_toggle();
       cy.navigate_to('markets', true);
       cy.getByTestId(marketHeaders).should('be.visible');
-      cy.get(`[row-id="${createdMarketId}"]`)
+      cy.get(`[row-id="${this.createdMarketId}"]`)
         .should('be.visible')
         .within(() => {
           cy.get_element_by_col_id('code').should('have.text', 'TEST.24h');
           cy.get_element_by_col_id('name').should('have.text', 'Test market 1');
           cy.get_element_by_col_id('state').should('have.text', 'Pending');
           cy.get_element_by_col_id('asset').should('have.text', 'fUSDC');
-          cy.get_element_by_col_id('id').should('have.text', createdMarketId);
+          cy.get_element_by_col_id('id').should(
+            'have.text',
+            this.createdMarketId
+          );
           cy.get_element_by_col_id('actions')
             .find('a')
-            .should('have.attr', 'href', `/markets/${createdMarketId}`);
+            .should('have.attr', 'href', `/markets/${this.createdMarketId}`);
+        });
+    });
+
+    it('Able to go to market details page for successor market', function () {
+      const successionLineItem = 'succession-line-item';
+      const successionLineMarketId = 'succession-line-item-market-id';
+
+      createSuccessorMarketProposal(this.createdMarketId);
+      cy.navigate_to('markets');
+      cy.reload();
+      cy.contains('Token test market', { timeout: 8000 }).should('be.visible');
+      cy.get('[row-index="0"]')
+        .invoke('attr', 'row-id')
+        .as('successorMarketId');
+      cy.contains('Token test market').click();
+      cy.getByTestId(marketHeaders).should('have.text', 'Token test market');
+      cy.validate_proposal_change_type('Triggering Ratio', 'Added');
+      cy.validate_element_from_table('Triggering Ratio', '0.7');
+      cy.validate_proposal_change_type('Time Window', 'Added');
+      cy.validate_element_from_table('Time Window', '3,600');
+      cy.validate_proposal_change_type('Scaling Factor', 'Added');
+      cy.validate_element_from_table('Scaling Factor', '10');
+
+      cy.getByTestId(successionLineItem)
+        .first()
+        .within(() => {
+          cy.contains('Test market 1');
+          cy.getByTestId(successionLineMarketId).should(
+            'have.text',
+            this.createdMarketId
+          );
+        });
+      cy.getByTestId(successionLineItem)
+        .eq(1)
+        .within(() => {
+          cy.contains('Token test market');
+          cy.getByTestId(successionLineMarketId).should(
+            'have.text',
+            this.successorMarketId
+          );
         });
     });
   });

apps/explorer-e2e/src/integration/proposal.cy.js

@@ -13,28 +13,31 @@ context('Proposal page', { tags: '@smoke' }, function () {
     it('Able to view proposal', function () {
       cy.navigate_to('governanceProposals');
       cy.getByTestId(proposalHeading).should('be.visible');
-      // get first proposal in list
-      cy.get('[row-index="0"]').within(() => {
-        cy.get_element_by_col_id('title').should('have.text', proposalTitle);
-        cy.get_element_by_col_id('type').should('have.text', 'NewMarket');
-        cy.get_element_by_col_id('state').should('have.text', 'Enacted');
-        cy.getByTestId('vote-progress').should('be.visible');
-        cy.get('[col-id="cDate"]')
-          .invoke('text')
-          .should('match', dateTimeRegex);
-        cy.get('[col-id="eDate"]')
-          .invoke('text')
-          .should('match', dateTimeRegex);
-        cy.getByTestId('external-link')
-          .should('have.attr', 'href')
-          .and('contains', 'https://governance.fairground.wtf/proposals/');
-        cy.contains('View terms').should('exist').click();
-      });
+      cy.contains(proposalTitle)
+        .parent()
+        .parent()
+        .parent()
+        .within(() => {
+          cy.get_element_by_col_id('title').should('have.text', proposalTitle);
+          cy.get_element_by_col_id('type').should('have.text', 'NewMarket');
+          cy.get_element_by_col_id('state').should('have.text', 'Enacted');
+          cy.getByTestId('vote-progress').should('be.visible');
+          cy.get('[col-id="cDate"]')
+            .invoke('text')
+            .should('match', dateTimeRegex);
+          cy.get('[col-id="eDate"]')
+            .invoke('text')
+            .should('match', dateTimeRegex);
+          cy.getByTestId('external-link')
+            .should('have.attr', 'href')
+            .and('contains', 'https://governance.fairground.wtf/proposals/');
+          cy.contains('View terms').should('exist').click();
+        });
       cy.getByTestId('dialog-title').should('have.text', proposalTitle);
       cy.get('.language-json').should('exist');
     });
 
-    it('Proposal page displayed on mobile', function () {
+    it.skip('Proposal page displayed on mobile', function () {
       cy.common_switch_to_mobile_and_click_toggle();
       cy.navigate_to('governanceProposals', true);
       cy.getByTestId(proposalHeading).should('be.visible');

apps/explorer-e2e/src/support/common.functions.js

@@ -127,3 +127,10 @@ Cypress.Commands.add(
       .should('have.text', tableRowValue);
   }
 );
+
+Cypress.Commands.add(
+  'validate_proposal_change_type',
+  (tableRowName, changeType) => {
+    cy.contains(tableRowName).siblings().should('have.text', changeType);
+  }
+);

apps/explorer-e2e/src/support/governance.functions.js

@@ -0,0 +1,130 @@
+export function createSuccessorMarketProposal(parentMarketId) {
+  cy.VegaWalletSubmitProposal(getSuccessorTxBody(parentMarketId));
+}
+
+function getSuccessorTxBody(parentMarketId) {
+  return {
+    proposalSubmission: {
+      rationale: {
+        title: 'Test successor market proposal details',
+        description: 'E2E test for successor market',
+      },
+      terms: {
+        newMarket: {
+          changes: {
+            decimalPlaces: '5',
+            positionDecimalPlaces: '5',
+            linearSlippageFactor: '0.001',
+            quadraticSlippageFactor: '0',
+            lpPriceRange: '10',
+            instrument: {
+              name: 'Token test market',
+              code: 'TEST.24h',
+              future: {
+                settlementAsset:
+                  '816af99af60d684502a40824758f6b5377e6af48e50a9ee8ef478ecb879ea8bc',
+                quoteName: 'fUSDC',
+                dataSourceSpecForSettlementData: {
+                  external: {
+                    oracle: {
+                      signers: [
+                        {
+                          pubKey: {
+                            key: '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680',
+                          },
+                        },
+                      ],
+                      filters: [
+                        {
+                          key: {
+                            name: 'prices.BTC.value',
+                            type: 'TYPE_INTEGER',
+                            numberDecimalPlaces: '0',
+                          },
+                          conditions: [
+                            {
+                              operator: 'OPERATOR_GREATER_THAN',
+                              value: '0',
+                            },
+                          ],
+                        },
+                      ],
+                    },
+                  },
+                },
+                dataSourceSpecForTradingTermination: {
+                  external: {
+                    oracle: {
+                      signers: [
+                        {
+                          pubKey: {
+                            key: '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680',
+                          },
+                        },
+                      ],
+                      filters: [
+                        {
+                          key: {
+                            name: 'trading.terminated.ETH5',
+                            type: 'TYPE_BOOLEAN',
+                          },
+                          conditions: [
+                            {
+                              operator: 'OPERATOR_EQUALS',
+                              value: 'true',
+                            },
+                          ],
+                        },
+                      ],
+                    },
+                  },
+                },
+                dataSourceSpecBinding: {
+                  settlementDataProperty: 'prices.BTC.value',
+                  tradingTerminationProperty: 'trading.terminated.ETH5',
+                },
+              },
+            },
+            metadata: [
+              'sector:food',
+              'sector:materials',
+              'source:docs.vega.xyz',
+            ],
+            priceMonitoringParameters: {
+              triggers: [
+                {
+                  horizon: '43200',
+                  probability: '0.9999999',
+                  auctionExtension: '600',
+                },
+              ],
+            },
+            liquidityMonitoringParameters: {
+              targetStakeParameters: {
+                timeWindow: '3600',
+                scalingFactor: 10,
+              },
+              triggeringRatio: '0.7',
+              auctionExtension: '1',
+            },
+            logNormal: {
+              tau: 0.0001140771161,
+              riskAversionParameter: 0.01,
+              params: {
+                mu: 0,
+                r: 0.016,
+                sigma: 0.5,
+              },
+            },
+            successor: {
+              parentMarketId: parentMarketId,
+              insurancePoolFraction: '0.75',
+            },
+          },
+        },
+        closingTimestamp: 1695666618,
+        enactmentTimestamp: 1695666618,
+      },
+    },
+  };
+}

apps/explorer/src/app/components/markets/market-details.tsx

@@ -1,6 +1,9 @@
 import { t } from '@vegaprotocol/i18n';
 import type { MarketInfoWithData } from '@vegaprotocol/markets';
-import { PriceMonitoringBoundsInfoPanel } from '@vegaprotocol/markets';
+import {
+  PriceMonitoringBoundsInfoPanel,
+  SuccessionLineInfoPanel,
+} from '@vegaprotocol/markets';
 import {
   LiquidityInfoPanel,
   LiquidityMonitoringParametersInfoPanel,
@@ -103,6 +106,8 @@ export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
           <OracleInfoPanel market={market} type="settlementData" />
         </>
       )}
+      <h2 className={`${headerClassName} mb-4`}>{t('Succession line')}</h2>
+      <SuccessionLineInfoPanel market={market} />
     </div>
   );
 };

apps/explorer/src/app/components/txs/details/tx-proposal.tsx

@@ -10,6 +10,8 @@ import Hash from '../../links/hash';
 import { t } from '@vegaprotocol/i18n';
 import { ProposalSignatureBundleNewAsset } from './proposal/signature-bundle-new';
 import { ProposalSignatureBundleUpdateAsset } from './proposal/signature-bundle-update';
+import { MarketLink } from '../../links';
+import { formatNumber } from '@vegaprotocol/utils';
 
 export type Proposal = components['schemas']['v1ProposalSubmission'];
 export type ProposalTerms = components['schemas']['vegaProposalTerms'];
@@ -53,7 +55,11 @@ export function proposalTypeLabel(terms?: ProposalTerms): string {
   } else if (has(terms, 'updateAsset')) {
     return t('Update asset proposal');
   } else if (has(terms, 'newMarket')) {
-    return t('New market proposal');
+    if (terms?.newMarket?.changes?.successor) {
+      return t('Successor market proposal');
+    } else {
+      return t('New market proposal');
+    }
   } else if (has(terms, 'updateMarket')) {
     return t('Update market proposal');
   } else if (has(terms, 'updateNetworkParameter')) {
@@ -85,6 +91,13 @@ export const TxProposal = ({ txData, pubKey, blockData }: TxProposalProps) => {
   }
 
   const tx = proposal.terms?.newAsset || proposal.terms?.updateAsset;
+  const isSuccessorMarketProposal =
+    proposal?.terms?.newMarket?.changes?.successor;
+  const parentMarketId =
+    isSuccessorMarketProposal &&
+    proposal?.terms.newMarket?.changes?.successor?.parentMarketId;
+  const insurancePoolFraction =
+    proposal?.terms?.newMarket?.changes?.successor?.insurancePoolFraction;
 
   // This component is not rendered if no bundle is required
   const SignatureBundleComponent = proposal.terms?.newAsset
@@ -111,6 +124,30 @@ export const TxProposal = ({ txData, pubKey, blockData }: TxProposalProps) => {
             <Hash text={deterministicId} />
           </TableCell>
         </TableRow>
+        {isSuccessorMarketProposal ? (
+          <>
+            {parentMarketId ? (
+              <TableRow modifier="bordered">
+                <TableCell>{t('Previous market')}</TableCell>
+                <TableCell>
+                  <MarketLink
+                    id={
+                      proposal.terms?.newMarket.changes.successor.parentMarketId
+                    }
+                  />
+                </TableCell>
+              </TableRow>
+            ) : null}
+            {insurancePoolFraction ? (
+              <TableRow modifier="bordered">
+                <TableCell>{t('Insurance pool fraction')}</TableCell>
+                <TableCell>
+                  {formatNumber(Number(insurancePoolFraction) * 100, 0)}%
+                </TableCell>
+              </TableRow>
+            ) : null}
+          </>
+        ) : null}
       </TableWithTbody>
       <ProposalSummary
         id={deterministicId}

apps/explorer/src/app/components/txs/tx-order-type.tsx

@@ -78,7 +78,11 @@ export function getLabelForProposal(
   } else if (proposal.terms?.updateAsset) {
     return t('Proposal: Update asset');
   } else if (proposal.terms?.newMarket) {
-    return t('Proposal: New market');
+    if (proposal.terms?.newMarket.changes?.successor) {
+      return t('Proposal: Successor market');
+    } else {
+      return t('Proposal: New market');
+    }
   } else if (proposal.terms?.updateMarket) {
     return t('Proposal: Update market');
   } else if (proposal.terms?.updateNetworkParameter) {

apps/explorer/src/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+  "short_name": "Mainnet Stats",
+  "name": "Vega Mainnet statistics",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

apps/explorer/src/assets/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

apps/explorer/src/index.html

@@ -1,23 +1,39 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="utf-8" />
-    <title>Explorer</title>
-    <base href="/" />
-    <link
-      rel="preload"
-      href="https://static.vega.xyz/AlphaLyrae-Medium.woff2"
-      as="font"
-      type="font/woff2"
-      crossorigin="anonymous"
-    />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta charset="utf-8" />
     <link
       rel="icon"
       type="image/x-icon"
       href="https://static.vega.xyz/favicon.ico"
     />
-    <link rel="stylesheet" href="https://static.vega.xyz/fonts.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="Vega Protocol - VEGA Explorer" />
+    <meta name="og:type" content="website" />
+    <meta name="og:url" content="https://explorer.vega.xyz/" />
+    <meta name="og:title" content="Vega Protocol - Explorer" />
+    <meta name="og:site_name" content="Vega Protocol - Explorer" />
+    <meta name="og:image" content="https://static.vega.xyz/favicon.ico" />
+
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Vega Protocol - Explorer" />
+    <meta name="twitter:description" content="Vega Protocol - Explorer" />
+    <meta name="twitter:image" content="https://static.vega.xyz/favicon.ico" />
+    <meta name="twitter:image:alt" content="VEGA logo" />
+    <meta name="twitter:site" content="@vegaprotocol" />
+
+    <meta name="description" content="Vega Protocol - Explorer" />
+    <link rel="apple-touch-icon" href="assets/apple-touch-icon.png" />
+    <link rel="manifest" href="assets/manifest.json" />
+    <link
+      rel="preload"
+      href="https://static.vega.xyz/AlphaLyrae-Medium.woff2"
+      as="font"
+      type="font/woff2"
+    />
+    <title>VEGA Explorer</title>
     <script src="./assets/env-config.js"></script>
   </head>
   <body class="dark:bg-black h-full w-full">

apps/governance-e2e/.env

@@ -18,6 +18,7 @@ NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/annou
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72
 NX_VEGA_REST_URL=http://localhost:3008/api/v2/
+NX_SUCCESSOR_MARKETS=true
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false

apps/governance-e2e/cypress.config.js

@@ -28,6 +28,7 @@ module.exports = defineConfig({
     numTestsKeptInMemory: 5,
     downloadsFolder: 'cypress/downloads',
     testIsolation: false,
+    experimentalMemoryManagement: true,
   },
   env: {
     ethProviderUrl: 'http://localhost:8545/',

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

@@ -11,7 +11,9 @@ import {
   getDateFormatForSpecifiedDays,
   getProposalFromTitle,
   getProposalInformationFromTable,
+  proposalChangeType,
   submitUniqueRawProposal,
+  validateProposalDetailsDiff,
   voteForProposal,
 } from '../../../../governance-e2e/src/support/governance.functions';
 import {
@@ -26,7 +28,9 @@ import {
 } from '../../support/wallet-functions';
 import type { testFreeformProposal } from '../../support/common-interfaces';
 import { formatDateWithLocalTimezone } from '@vegaprotocol/utils';
+import { createSuccessorMarketProposalTxBody } from '../../support/proposal.functions';
 
+const proposalListItem = '[data-testid="proposals-list-item"]';
 const proposalVoteProgressForPercentage =
   'vote-progress-indicator-percentage-for';
 const proposalVoteProgressAgainstPercentage =
@@ -42,6 +46,7 @@ const viewProposalButton = 'view-proposal-btn';
 const proposalDescriptionToggle = 'proposal-description-toggle';
 const voteBreakdownToggle = 'vote-breakdown-toggle';
 const proposalTermsToggle = 'proposal-json-toggle';
+const marketDataToggle = 'proposal-market-data-toggle';
 
 describe(
   'Governance flow for proposal details',
@@ -50,12 +55,12 @@ describe(
     before('connect wallets and set approval limit', function () {
       cy.visit('/');
       ethereumWalletConnect();
-      // cy.associateTokensToVegaWallet('1');
     });
 
     beforeEach('visit proposals tab', function () {
       cy.clearLocalStorage();
       turnTelemetryOff();
+      cy.mockChainId();
       cy.reload();
       waitForSpinner();
       cy.connectVegaWallet();
@@ -354,5 +359,98 @@ describe(
       switchVegaWalletPubKey();
       stakingPageDisassociateAllTokens();
     });
+
+    it('Able to see successor market details with new and updated values', function () {
+      cy.createMarket();
+      cy.reload();
+      waitForSpinner();
+      cy.getByTestId('closed-proposals').within(() => {
+        cy.contains('Add Lorem Ipsum market')
+          .parentsUntil(proposalListItem)
+          .last()
+          .within(() => {
+            cy.getByTestId(viewProposalButton).click();
+          });
+      });
+      getProposalInformationFromTable('ID')
+        .invoke('text')
+        .as('parentMarketId')
+        .then(() => {
+          cy.VegaWalletSubmitProposal(
+            createSuccessorMarketProposalTxBody(this.parentMarketId)
+          );
+        });
+      navigateTo(navigation.proposals);
+      cy.reload();
+      getProposalFromTitle('Test successor market proposal details').within(
+        () => cy.getByTestId(viewProposalButton).click()
+      );
+      // #3003-PMAN-010
+      cy.getByTestId(proposalTermsToggle).click();
+      cy.get('.language-json').within(() => {
+        cy.get('.hljs-attr').should('contain.text', 'parentMarketId');
+        cy.get('.hljs-string').should('contain.text', this.parentMarketId);
+        cy.get('.hljs-attr').should('contain.text', 'insurancePoolFraction');
+        cy.get('.hljs-string').should('contain.text', '0.75');
+      });
+      // 3003-PMAN-011 3003-PMAN-012
+      cy.getByTestId(marketDataToggle).click();
+      cy.getByTestId('proposal-market-data').within(() => {
+        cy.contains('Key details').click();
+        validateProposalDetailsDiff(
+          'Name',
+          proposalChangeType.UPDATED,
+          'Token test market',
+          'Test market 1'
+        );
+        validateProposalDetailsDiff(
+          'Parent Market ID',
+          proposalChangeType.ADDED,
+          this.parentMarketId
+        );
+        validateProposalDetailsDiff(
+          'Insurance Pool Fraction',
+          proposalChangeType.ADDED,
+          '0.75'
+        );
+        validateProposalDetailsDiff(
+          'Trading Mode',
+          proposalChangeType.UPDATED,
+          'No trading',
+          'Opening auction'
+        );
+
+        cy.contains('Instrument').click();
+        validateProposalDetailsDiff(
+          'Market Name',
+          proposalChangeType.UPDATED,
+          'Token test market',
+          'Test market 1'
+        );
+
+        cy.contains('Metadata').click();
+        validateProposalDetailsDiff(
+          'Sector',
+          proposalChangeType.UPDATED,
+          'materials',
+          'tech'
+        );
+      });
+
+      // 3003-PMAN-011
+      cy.get('.underline').contains('Parent Market ID').realHover();
+      cy.getByTestId('tooltip-content', { timeout: 8000 }).should(
+        'contain.text',
+        'The ID of the market this market succeeds.'
+      );
+      cy.get('.underline')
+        .contains('Insurance Pool Fraction')
+        .realMouseUp()
+        .realHover();
+      cy.getByTestId('tooltip-content', { timeout: 8000 }).should(
+        'contain.text',
+        'The fraction of the insurance pool balance that is carried over from the parent market to the successor.'
+      );
+    });
   }
 );

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

@@ -42,6 +42,7 @@ context(
     beforeEach('visit proposals', function () {
       cy.clearLocalStorage();
       turnTelemetryOff();
+      cy.mockChainId();
       cy.reload();
       waitForSpinner();
       cy.connectVegaWallet();

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

@@ -82,6 +82,7 @@ context(
       cy.clearLocalStorage();
       turnTelemetryOff();
       cy.reload();
+      cy.mockChainId();
       waitForSpinner();
       cy.connectVegaWallet();
       ethereumWalletConnect();

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

@@ -74,6 +74,7 @@ context(
     beforeEach('visit governance tab', function () {
       cy.clearLocalStorage();
       turnTelemetryOff();
+      cy.mockChainId();
       cy.reload();
       waitForSpinner();
       cy.connectVegaWallet();
@@ -654,44 +655,7 @@ context(
           .find('a')
           .should('have.attr', 'href')
           .and('contain', this.parentMarketId);
-        cy.getByTestId('view-proposal-btn').click();
       });
-      // #3003-PMAN-010
-      cy.getByTestId(proposalJsonToggle).click();
-      cy.get('.language-json').within(() => {
-        cy.get('.hljs-attr').should('contain.text', 'parentMarketId');
-        cy.get('.hljs-string').should('contain.text', this.parentMarketId);
-        cy.get('.hljs-attr').should('contain.text', 'insurancePoolFraction');
-        cy.get('.hljs-string').should('contain.text', '0.75');
-      });
-      cy.getByTestId('proposal-market-data').within(() => {
-        cy.getByTestId('proposal-market-data-toggle').click();
-        cy.contains('Key details').click();
-        // 3003-PMAN-009
-        getMarketProposalDetailsFromTable('Parent Market ID').should(
-          'have.text',
-          this.parentMarketId
-        );
-        getMarketProposalDetailsFromTable('Insurance Pool Fraction').should(
-          'have.text',
-          '0.75'
-        );
-        getMarketProposalDetailsFromTable('Trading Mode').should(
-          'have.text',
-          'No trading'
-        );
-      });
-      // 3003-PMAN-011
-      cy.contains('Parent Market ID').realHover();
-      cy.getByTestId('tooltip-content').should(
-        'contain.text',
-        'The ID of the market this market succeeds.'
-      );
-      cy.contains('Insurance Pool Fraction').realHover();
-      cy.getByTestId('tooltip-content').should(
-        'contain.text',
-        'The fraction of the insurance pool balance that is carried over from the parent market to the successor.'
-      );
     });
 
     after('Disassociate from second wallet key if present', function () {
@@ -730,6 +694,7 @@ context(
         .getByTestId('key-value-table-row')
         .contains(heading)
         .parent()
+        .parent()
         .siblings();
     }
   }

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

@@ -42,6 +42,7 @@ describe('Governance flow for proposal list', { tags: '@slow' }, function () {
     cy.clearLocalStorage();
     turnTelemetryOff();
     cy.reload();
+    cy.mockChainId();
     waitForSpinner();
     cy.connectVegaWallet();
     ethereumWalletConnect();

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

@@ -26,6 +26,7 @@ context('rewards - flow', { tags: '@slow' }, function () {
   before('set up environment to allow rewards', function () {
     cy.clearLocalStorage();
     turnTelemetryOff();
+    cy.mockChainId();
     cy.visit('/');
     waitForSpinner();
     ethereumWalletConnect();

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

@@ -25,6 +25,7 @@ import {
   vegaWalletSetSpecifiedApprovalAmount,
   vegaWalletTeardown,
 } from '../../support/wallet-functions';
+
 const stakeValidatorListTotalStake = 'total-stake';
 const stakeValidatorListTotalShare = 'total-stake-share';
 const stakeValidatorListStakePercentage = 'stake-percentage';
@@ -67,6 +68,7 @@ context(
         function () {
           cy.clearLocalStorage();
           turnTelemetryOff();
+          cy.mockChainId();
           // Go to homepage to allow wallet teardown without epoch timer refreshing page
           navigateTo(navigation.home);
           vegaWalletTeardown();

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

@@ -56,6 +56,7 @@ context(
         function () {
           cy.clearLocalStorage();
           turnTelemetryOff();
+          cy.mockChainId();
           cy.reload();
           waitForSpinner();
           cy.connectVegaWallet();

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

@@ -50,6 +50,7 @@ context(
     beforeEach('Navigate to withdrawal page', function () {
       cy.clearLocalStorage();
       turnTelemetryOff();
+      cy.mockChainId();
       cy.reload();
       waitForSpinner();
       navigateTo(navigation.withdraw);
@@ -96,7 +97,8 @@ context(
       });
     });
 
-    it(
+    // eslint-disable-next-line
+    it.skip(
       'Able to withdraw asset: -eth wallet connected -withdraw funds button',
       { tags: '@smoke' },
       function () {

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

@@ -231,7 +231,7 @@ context(
     });
 
     // 3009-NTWU-001 3009-NTWU-002 3009-NTWU-006 3009-NTWU-009
-    it('should display network upgrade banner with estimate', function () {
+    it.skip('should display network upgrade banner with estimate', function () {
       mockNetworkUpgradeProposal();
       cy.visit('/');
       cy.getByTestId('banners').within(() => {

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

@@ -11,6 +11,7 @@ import {
   waitForBeginningOfEpoch,
 } from '../../support/staking.functions';
 import { previousEpochData } from '../../fixtures/mocks/previous-epoch';
+import { chainIdQuery, statisticsQuery } from '@vegaprotocol/mock';
 
 const guideLink = 'staking-guide-link';
 const validatorTitle = 'validator-node-title';
@@ -33,11 +34,22 @@ const overstakedPenaltyToolTip = 'overstaked-penalty-tooltip';
 const multisigPenaltyToolTip = 'multisig-error-tooltip';
 const epochCountDown = 'epoch-countdown';
 const stakeNumberRegex = /^\d{1,3}(,\d{3})*(\.\d+)?$/;
+const txTimeout = Cypress.env('txTimeout');
 
 context('Validators Page - verify elements on page', function () {
-  before('navigate to validators page', function () {
+  before('navigate to validators page', () => {
+    cy.mockGQL((req) => {
+      aliasGQLQuery(req, 'ChainId', chainIdQuery());
+      aliasGQLQuery(req, 'Statistics', statisticsQuery());
+    });
     cy.visit('/validators');
   });
+  beforeEach(() => {
+    cy.mockGQL((req) => {
+      aliasGQLQuery(req, 'ChainId', chainIdQuery());
+      aliasGQLQuery(req, 'Statistics', statisticsQuery());
+    });
+  });
 
   describe('with wallets disconnected', { tags: '@smoke' }, function () {
     it('Should have validators tab highlighted', function () {
@@ -177,6 +189,11 @@ context('Validators Page - verify elements on page', function () {
     { tags: '@smoke' },
     function () {
       before('connect wallets and click on validator', function () {
+        cy.mockGQL((req) => {
+          aliasGQLQuery(req, 'ChainId', chainIdQuery());
+          aliasGQLQuery(req, 'Statistics', statisticsQuery());
+        });
+        cy.visit('/validators');
         cy.connectVegaWallet();
         clickOnValidatorFromList(0);
       });
@@ -263,7 +280,7 @@ context('Validators Page - verify elements on page', function () {
 
         cy.getByTestId(epochCountDown).within(() => {
           cy.get(epochTitle).should('not.be.empty');
-          cy.get(nextEpochInfo).should('contain.text', 'Next epoch');
+          cy.get(nextEpochInfo, txTimeout).should('contain.text', 'Next epoch');
         });
       });
     }

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

@@ -4,6 +4,8 @@ import {
   vegaWalletFaucetAssetsWithoutCheck,
   vegaWalletTeardown,
 } from '../../support/wallet-functions';
+import { aliasGQLQuery } from '@vegaprotocol/cypress';
+import { chainIdQuery, statisticsQuery } from '@vegaprotocol/mock';
 
 const walletContainer = 'aside [data-testid="vega-wallet"]';
 const walletHeader = '[data-testid="wallet-header"] h1';
@@ -14,10 +16,6 @@ const dialogHeader = 'dialog-title';
 const walletDialogHeader = 'wallet-dialog-title';
 const connectorsList = 'connectors-list';
 const dialogCloseBtn = 'dialog-close';
-const restConnectorForm = 'rest-connector-form';
-const restWallet = '#wallet';
-const restPassphrase = '#passphrase';
-const restConnectBtn = '[type="submit"]';
 const accountNo = 'vega-account-truncated';
 const currencyTitle = 'currency-title';
 const currencyValue = 'currency-value';
@@ -69,7 +67,7 @@ context(
         cy.get(dialog).within(() => {
           cy.getByTestId(walletDialogHeader)
             .should('be.visible')
-            .and('have.text', 'Connect');
+            .and('have.text', 'Get a Vega wallet');
         });
       });
 
@@ -77,10 +75,7 @@ context(
         cy.getByTestId(connectorsList).within(() => {
           cy.getByTestId('connector-jsonRpc')
             .should('be.visible')
-            .and('have.text', 'Connect Vega wallet');
-          cy.getByTestId('connector-rest')
-            .should('be.visible')
-            .and('have.text', 'Hosted Fairground wallet');
+            .and('have.text', 'Use the Desktop App/CLI');
         });
       });
 
@@ -91,48 +86,14 @@ context(
       });
     });
 
-    describe('when rest connector form opened', function () {
-      before('click hosted wallet app button', function () {
-        cy.getByTestId(connectorsList).within(() => {
-          cy.getByTestId('connector-rest').click();
-        });
-      });
-
-      // 0002-WCON-002
-      it('should have wallet field visible', function () {
-        cy.getByTestId(restConnectorForm).within(() => {
-          cy.get(restWallet).should('be.visible');
-        });
-      });
-
-      it('should have password field visible', function () {
-        cy.getByTestId(restConnectorForm).within(() => {
-          cy.get(restPassphrase).should('be.visible');
-        });
-      });
-
-      it('should have connect button visible', function () {
-        cy.getByTestId(restConnectorForm).within(() => {
-          cy.get(restConnectBtn)
-            .should('be.visible')
-            .and('have.text', 'Connect');
-        });
-      });
-
-      it('should have close button visible', function () {
-        cy.get(dialog).within(() => {
-          cy.getByTestId(dialogCloseBtn).should('be.visible');
-        });
-      });
-
-      after('close dialog', function () {
-        cy.getByTestId(dialogCloseBtn).click().should('not.exist');
-      });
-    });
-
     describe('when vega wallet connected', function () {
       before('connect vega wallet', function () {
+        cy.mockGQL((req) => {
+          aliasGQLQuery(req, 'ChainId', chainIdQuery());
+          aliasGQLQuery(req, 'Statistics', statisticsQuery());
+        });
         cy.visit('/');
+        cy.wait('@ChainId');
         cy.connectVegaWallet();
         vegaWalletTeardown();
       });
@@ -315,6 +276,10 @@ context(
         ];
 
         before('faucet assets to connected vega wallet', function () {
+          cy.mockGQL((req) => {
+            aliasGQLQuery(req, 'ChainId', chainIdQuery());
+            aliasGQLQuery(req, 'Statistics', statisticsQuery());
+          });
           for (const { id, amount } of assets) {
             vegaWalletFaucetAssetsWithoutCheck(id, amount, vegaWalletPublicKey);
           }

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

@@ -232,6 +232,23 @@ export function getDownloadedProposalJsonPath(proposalType: string) {
   return filepath;
 }
 
+export function validateProposalDetailsDiff(
+  RowName: string,
+  changeType: proposalChangeType,
+  newValue: string,
+  oldValue?: string
+) {
+  cy.contains(RowName)
+    .parentsUntil(proposalInformationTableRows)
+    .parent()
+    .first()
+    .within(() => {
+      cy.contains(changeType).should('be.visible');
+      cy.contains(newValue).should('be.visible');
+      if (oldValue) cy.contains(oldValue).should('have.class', 'line-through');
+    });
+}
+
 function getFormattedTime() {
   const now = new Date();
   const day = now.getDate().toString().padStart(2, '0');
@@ -252,3 +269,8 @@ export enum governanceProposalType {
   FREEFORM = 'Freeform',
   RAW = 'raw proposal',
 }
+
+export enum proposalChangeType {
+  UPDATED = 'Updated',
+  ADDED = 'Added',
+}

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

@@ -211,6 +211,143 @@ export function createNewMarketProposalTxBody(): ProposalSubmissionBody {
   };
 }
 
+// Requires cy.createMarket() to be run to set up parent market
+export function createSuccessorMarketProposalTxBody(
+  parentMarketId: string
+): ProposalSubmissionBody {
+  const MIN_CLOSE_SEC = 10000;
+  const MIN_ENACT_SEC = 10000;
+
+  const closingDate = addSeconds(new Date(), MIN_CLOSE_SEC);
+  const enactmentDate = addSeconds(closingDate, MIN_ENACT_SEC);
+  const closingTimestamp = millisecondsToSeconds(closingDate.getTime());
+  const enactmentTimestamp = millisecondsToSeconds(enactmentDate.getTime());
+  return {
+    proposalSubmission: {
+      rationale: {
+        title: 'Test successor market proposal details',
+        description: 'E2E test for successor market',
+      },
+      terms: {
+        newMarket: {
+          changes: {
+            decimalPlaces: '5',
+            positionDecimalPlaces: '5',
+            linearSlippageFactor: '0.001',
+            quadraticSlippageFactor: '0',
+            lpPriceRange: '10',
+            instrument: {
+              name: 'Token test market',
+              code: 'TEST.24h',
+              future: {
+                settlementAsset:
+                  '816af99af60d684502a40824758f6b5377e6af48e50a9ee8ef478ecb879ea8bc',
+                quoteName: 'fUSDC',
+                dataSourceSpecForSettlementData: {
+                  external: {
+                    oracle: {
+                      signers: [
+                        {
+                          pubKey: {
+                            key: '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680',
+                          },
+                        },
+                      ],
+                      filters: [
+                        {
+                          key: {
+                            name: 'prices.BTC.value',
+                            type: 'TYPE_INTEGER' as const,
+                            numberDecimalPlaces: '0',
+                          },
+                          conditions: [
+                            {
+                              operator: 'OPERATOR_GREATER_THAN' as const,
+                              value: '0',
+                            },
+                          ],
+                        },
+                      ],
+                    },
+                  },
+                },
+                dataSourceSpecForTradingTermination: {
+                  external: {
+                    oracle: {
+                      signers: [
+                        {
+                          pubKey: {
+                            key: '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680',
+                          },
+                        },
+                      ],
+                      filters: [
+                        {
+                          key: {
+                            name: 'trading.terminated.ETH5',
+                            type: 'TYPE_BOOLEAN' as const,
+                          },
+                          conditions: [
+                            {
+                              operator: 'OPERATOR_EQUALS' as const,
+                              value: 'true',
+                            },
+                          ],
+                        },
+                      ],
+                    },
+                  },
+                },
+                dataSourceSpecBinding: {
+                  settlementDataProperty: 'prices.BTC.value',
+                  tradingTerminationProperty: 'trading.terminated.ETH5',
+                },
+              },
+            },
+            metadata: [
+              'sector:food',
+              'sector:materials',
+              'source:docs.vega.xyz',
+            ],
+            priceMonitoringParameters: {
+              triggers: [
+                {
+                  horizon: '43200',
+                  probability: '0.9999999',
+                  auctionExtension: '600',
+                },
+              ],
+            },
+            liquidityMonitoringParameters: {
+              targetStakeParameters: {
+                timeWindow: '3600',
+                scalingFactor: 10,
+              },
+              triggeringRatio: '0.7',
+              auctionExtension: '1',
+            },
+            logNormal: {
+              tau: 0.0001140771161,
+              riskAversionParameter: 0.01,
+              params: {
+                mu: 0,
+                r: 0.016,
+                sigma: 0.5,
+              },
+            },
+            successor: {
+              parentMarketId: parentMarketId,
+              insurancePoolFraction: '0.75',
+            },
+          },
+        },
+        closingTimestamp,
+        enactmentTimestamp,
+      },
+    },
+  };
+}
+
 export function mockNetworkUpgradeProposal() {
   cy.mockGQL((req) => {
     aliasGQLQuery(req, 'Nodes', nodeData);

apps/governance/.env

@@ -9,6 +9,7 @@ NX_VEGA_NETWORKS='{"DEVNET":"https://dev.governance.vega.xyz","STAGNET1":"https:
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_EXPLORER_URL=https://explorer.stagnet1.vega.rocks
+NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
@@ -21,9 +22,12 @@ NX_VEGA_REST_URL=https://api.n00.stagnet1.vega.xyz/api/v2/
 NX_TENDERMINT_URL=https://tm.n01.stagnet1.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n01.stagnet1.vega.xyz/websocket
 
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
+
 #Test configuration variables
 CYPRESS_FAIRGROUND=false
 LC_ALL="en_US.UTF-8"
 
 # Cosmic elevator flags
-NX_SUCCESSOR_MARKETS=true
+NX_SUCCESSOR_MARKETS=true

apps/governance/src/components/vega-wallet/vega-wallet-prompt.tsx

@@ -15,6 +15,7 @@ export const VegaWalletPrompt = () => {
         </Link>
         <ButtonLink
           className="text-neutral-500"
+          data-testid="view-as-user"
           onClick={() => setViewAsDialog(true)}
         >
           {t('viewAsParty')}

apps/governance/src/index.html

@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <html lang="en" class="dark bg-black w-full h-full">
   <head>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta charset="utf-8" />
-    <link rel="stylesheet" href="//static.vega.xyz/fonts.css" />
     <link
       rel="icon"
       type="image/x-icon"
@@ -10,35 +10,42 @@
     />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
-    <meta name="description" content="Vega Protocol - VEGA Token Vesting" />
+    <meta name="description" content="Vega Protocol - VEGA Governance" />
+    <meta name="og:type" content="website" />
+    <meta name="og:url" content="https://governance.vega.xyz/" />
+    <meta name="og:title" content="Vega Protocol - Governance" />
+    <meta name="og:site_name" content="Vega Protocol - Governance" />
+    <meta name="og:image" content="https://static.vega.xyz/favicon.ico" />
+
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Vega Protocol - Governance" />
+    <meta name="twitter:description" content="Vega Protocol - Governance" />
+    <meta name="twitter:image" content="https://static.vega.xyz/favicon.ico" />
+    <meta name="twitter:image:alt" content="VEGA logo" />
+    <meta name="twitter:site" content="@vegaprotocol" />
+
+    <meta name="description" content="Vega Protocol - Governance" />
     <link rel="apple-touch-icon" href="assets/apple-touch-icon.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
     <link rel="manifest" href="assets/manifest.json" />
     <link
       rel="preload"
       href="https://static.vega.xyz/AlphaLyrae-Medium.woff2"
       as="font"
       type="font/woff2"
-      crossorigin="anonymous"
     />
-    <title>Vega Governance dApp</title>
+    <title>VEGA Governance</title>
     <script src="./assets/env-config.js"></script>
   </head>
   <body class="h-full">
-    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <noscript> You need to enable JavaScript to run this app. </noscript>
     <div id="root" class="h-full"></div>
-    <!--
-      This HTML file is a template.
+    <!-- This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.
 
       You can add webfonts, meta tags, or analytics to this file.
       The build step will place the bundled scripts into the <body> tag.
 
       To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
+      To create a production bundle, use `npm run build` or `yarn build`. -->
   </body>
 </html>

apps/governance/src/lib/vega-connectors.ts

@@ -1,5 +1,4 @@
 import {
-  RestConnector,
   JsonRpcConnector,
   ViewConnector,
   InjectedConnector,
@@ -8,13 +7,11 @@ import {
 const urlParams = new URLSearchParams(window.location.search);
 
 export const injected = new InjectedConnector();
-export const rest = new RestConnector();
 export const jsonRpc = new JsonRpcConnector();
 export const view = new ViewConnector(urlParams.get('address'));
 
 export const Connectors = {
   injected,
-  rest,
   jsonRpc,
   view,
 };

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

@@ -25,7 +25,7 @@ import {
 } from '@vegaprotocol/ui-toolkit';
 import { SubHeading } from '../../../../components/heading';
 import { CollapsibleToggle } from '../../../../components/collapsible-toggle';
-import type { MarketInfoWithData } from '@vegaprotocol/markets';
+import type { MarketInfo } from '@vegaprotocol/markets';
 import type { DataSourceDefinition } from '@vegaprotocol/types';
 import { create } from 'zustand';
 
@@ -45,8 +45,10 @@ export const useMarketDataDialogStore = create<MarketDataDialogState>(
 
 export const ProposalMarketData = ({
   marketData,
+  parentMarketData,
 }: {
-  marketData: MarketInfoWithData;
+  marketData: MarketInfo;
+  parentMarketData?: MarketInfo;
 }) => {
   const { t } = useTranslation();
   const { isOpen, open, close } = useMarketDataDialogStore();
@@ -58,8 +60,21 @@ export const ProposalMarketData = ({
 
   const settlementData = marketData.tradableInstrument.instrument.product
     .dataSourceSpecForSettlementData.data as DataSourceDefinition;
+  const parentSettlementData =
+    parentMarketData?.tradableInstrument.instrument?.product
+      ?.dataSourceSpecForSettlementData?.data;
   const terminationData = marketData.tradableInstrument.instrument.product
     .dataSourceSpecForTradingTermination.data as DataSourceDefinition;
+  const parentTerminationData =
+    parentMarketData?.tradableInstrument.instrument?.product
+      ?.dataSourceSpecForTradingTermination?.data;
+
+  const isParentSettlementDataEqual =
+    parentSettlementData !== undefined &&
+    isEqual(settlementData, parentSettlementData);
+  const isParentTerminationDataEqual =
+    parentTerminationData !== undefined &&
+    isEqual(terminationData, parentTerminationData);
 
   const getSigners = (data: DataSourceDefinition) => {
     if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
@@ -97,12 +112,22 @@ export const ProposalMarketData = ({
               <AccordionItem
                 itemId="key-details"
                 title={t('Key details')}
-                content={<KeyDetailsInfoPanel market={marketData} />}
+                content={
+                  <KeyDetailsInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               <AccordionItem
                 itemId="instrument"
                 title={t('Instrument')}
-                content={<InstrumentInfoPanel market={marketData} />}
+                content={
+                  <InstrumentInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               {isEqual(
                 getSigners(settlementData),
@@ -115,6 +140,11 @@ export const ProposalMarketData = ({
                     <OracleInfoPanel
                       market={marketData}
                       type="settlementData"
+                      parentMarket={
+                        isParentSettlementDataEqual
+                          ? undefined
+                          : parentMarketData
+                      }
                     />
                   }
                 />
@@ -127,6 +157,11 @@ export const ProposalMarketData = ({
                       <OracleInfoPanel
                         market={marketData}
                         type="settlementData"
+                        parentMarket={
+                          isParentSettlementDataEqual
+                            ? undefined
+                            : parentMarketData
+                        }
                       />
                     }
                   />
@@ -135,11 +170,21 @@ export const ProposalMarketData = ({
                     itemId="termination-oracle"
                     title={t('Termination Oracle')}
                     content={
-                      <OracleInfoPanel market={marketData} type="termination" />
+                      <OracleInfoPanel
+                        market={marketData}
+                        type="termination"
+                        parentMarket={
+                          isParentTerminationDataEqual
+                            ? undefined
+                            : parentMarketData
+                        }
+                      />
                     }
                   />
                 </>
               )}
+              {/*Note: successor markets will not differ in their settlement*/}
+              {/*assets, so no need to pass in parent market data for comparison.*/}
               <AccordionItem
                 itemId="settlement-asset"
                 title={t('Settlement asset')}
@@ -148,22 +193,42 @@ export const ProposalMarketData = ({
               <AccordionItem
                 itemId="metadata"
                 title={t('Metadata')}
-                content={<MetadataInfoPanel market={marketData} />}
+                content={
+                  <MetadataInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               <AccordionItem
                 itemId="risk-model"
                 title={t('Risk model')}
-                content={<RiskModelInfoPanel market={marketData} />}
+                content={
+                  <RiskModelInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               <AccordionItem
                 itemId="risk-parameters"
                 title={t('Risk parameters')}
-                content={<RiskParametersInfoPanel market={marketData} />}
+                content={
+                  <RiskParametersInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               <AccordionItem
                 itemId="risk-factors"
                 title={t('Risk factors')}
-                content={<RiskFactorsInfoPanel market={marketData} />}
+                content={
+                  <RiskFactorsInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
               {(
                 marketData.priceMonitoringSettings?.parameters?.triggers || []
@@ -174,6 +239,7 @@ export const ProposalMarketData = ({
                   content={
                     <PriceMonitoringBoundsInfoPanel
                       market={marketData}
+                      parentMarket={parentMarketData}
                       triggerIndex={triggerIndex}
                     />
                   }
@@ -183,13 +249,21 @@ export const ProposalMarketData = ({
                 itemId="liqudity-monitoring-parameters"
                 title={t('Liquidity monitoring parameters')}
                 content={
-                  <LiquidityMonitoringParametersInfoPanel market={marketData} />
+                  <LiquidityMonitoringParametersInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
                 }
               />
               <AccordionItem
                 itemId="liquidity-price-range"
                 title={t('Liquidity price range')}
-                content={<LiquidityPriceRangeInfoPanel market={marketData} />}
+                content={
+                  <LiquidityPriceRangeInfoPanel
+                    market={marketData}
+                    parentMarket={parentMarketData}
+                  />
+                }
               />
             </Accordion>
           </div>

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

@@ -13,7 +13,7 @@ import Routes from '../../../routes';
 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';
+import type { MarketInfo } from '@vegaprotocol/markets';
 import type { AssetQuery } from '@vegaprotocol/assets';
 import { removePaginationWrapper } from '@vegaprotocol/utils';
 import { ProposalState } from '@vegaprotocol/types';
@@ -31,7 +31,8 @@ export enum ProposalType {
 export interface ProposalProps {
   proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
   networkParams: Partial<NetworkParamsResult>;
-  newMarketData?: MarketInfoWithData | null;
+  newMarketData?: MarketInfo | null;
+  parentMarketData?: MarketInfo | null;
   assetData?: AssetQuery | null;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   restData: any;
@@ -46,6 +47,7 @@ export const Proposal = ({
   networkParams,
   restData,
   newMarketData,
+  parentMarketData,
   assetData,
   originalMarketProposalRestData,
   mostRecentlyEnactedAssociatedMarketProposal,
@@ -157,7 +159,10 @@ export const Proposal = ({
 
         {newMarketData && (
           <div className="mb-4">
-            <ProposalMarketData marketData={newMarketData} />
+            <ProposalMarketData
+              marketData={newMarketData}
+              parentMarketData={parentMarketData ? parentMarketData : undefined}
+            />
           </div>
         )}
 

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

@@ -8,12 +8,15 @@ 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';
+import { marketInfoProvider } from '@vegaprotocol/markets';
 import { useAssetQuery } from '@vegaprotocol/assets';
 import {
   NetworkParams,
   useNetworkParams,
 } from '@vegaprotocol/network-parameters';
+import { useParentMarketIdQuery } from '@vegaprotocol/markets';
+import { FLAGS } from '@vegaprotocol/environment';
+import { useSuccessorMarketProposalDetails } from '@vegaprotocol/proposals';
 
 export const ProposalContainer = () => {
   const [
@@ -54,6 +57,10 @@ export const ProposalContainer = () => {
     skip: !params.proposalId,
   });
 
+  const successor = useSuccessorMarketProposalDetails(params.proposalId);
+
+  const isSuccessor = !!successor?.parentMarketId || !!successor.code;
+
   const {
     state: {
       data: originalMarketProposalRestData,
@@ -88,7 +95,7 @@ export const ProposalContainer = () => {
     loading: newMarketLoading,
     error: newMarketError,
   } = useDataProvider({
-    dataProvider: marketInfoWithDataProvider,
+    dataProvider: marketInfoProvider,
     skipUpdates: true,
     variables: {
       marketId: data?.proposal?.id || '',
@@ -96,6 +103,33 @@ export const ProposalContainer = () => {
     },
   });
 
+  const {
+    data: parentMarketId,
+    loading: parentMarketIdLoading,
+    error: parentMarketIdError,
+  } = useParentMarketIdQuery({
+    variables: {
+      marketId: newMarketData?.id || '',
+    },
+    skip: !FLAGS.SUCCESSOR_MARKETS || !isSuccessor || !newMarketData?.id,
+  });
+
+  const {
+    data: parentMarketData,
+    loading: parentMarketLoading,
+    error: parentMarketError,
+  } = useDataProvider({
+    dataProvider: marketInfoProvider,
+    skipUpdates: true,
+    variables: {
+      marketId: parentMarketId?.market?.parentMarketID || '',
+      skip:
+        !FLAGS.SUCCESSOR_MARKETS ||
+        !isSuccessor ||
+        !parentMarketId?.market?.parentMarketID,
+    },
+  });
+
   const {
     data: assetData,
     loading: assetLoading,
@@ -160,6 +194,8 @@ export const ProposalContainer = () => {
         newMarketLoading ||
         assetLoading ||
         networkParamsLoading ||
+        parentMarketIdLoading ||
+        parentMarketLoading ||
         (restLoading ? (restLoading as boolean) : false) ||
         (originalMarketProposalRestLoading
           ? (originalMarketProposalRestLoading as boolean)
@@ -172,15 +208,18 @@ export const ProposalContainer = () => {
         error ||
         newMarketError ||
         assetError ||
+        networkParamsError ||
+        parentMarketIdError ||
+        parentMarketError ||
         restError ||
         originalMarketProposalRestError ||
-        previouslyEnactedMarketProposalsRestError ||
-        networkParamsError
+        previouslyEnactedMarketProposalsRestError
       }
       data={{
         ...data,
         ...networkParams,
         ...(newMarketData ? { newMarketData } : {}),
+        ...(parentMarketData ? { parentMarketData } : {}),
         ...(assetData ? { assetData } : {}),
         ...(restData ? { restData } : {}),
         ...(originalMarketProposalRestData
@@ -197,6 +236,7 @@ export const ProposalContainer = () => {
           networkParams={networkParams}
           restData={restData}
           newMarketData={newMarketData}
+          parentMarketData={parentMarketData}
           assetData={assetData}
           originalMarketProposalRestData={originalMarketProposalRestData}
           mostRecentlyEnactedAssociatedMarketProposal={

apps/trading-e2e/cypress.config.js

@@ -26,6 +26,7 @@ module.exports = defineConfig({
     requestTimeout: 20000,
     retries: 1,
     testIsolation: false,
+    experimentalMemoryManagement: true,
   },
   env: {
     ETHERSCAN_URL: 'https://sepolia.etherscan.io',

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

@@ -1,177 +0,0 @@
-// #region consts
-const assetColId = '[col-id="asset.symbol"]';
-const assetDetailsDialog = 'dialog-content';
-const assetRow = 'key-value-table-row';
-const contractAddress = '7_value';
-const dialogCloseBtn = 'close-asset-details-dialog';
-const dialogCloseX = 'dialog-close';
-const dialogTitle = 'dialog-title';
-
-const indicesWithLabelTooltips = [4, 5, 6, 7, 8, 9, 11, 12, 13, 14];
-const indicesWithValueTooltips = [1, 6];
-
-const labelValueToolTipPairs = [
-  {
-    label: 'ID',
-    value: 'asset-id',
-  },
-  {
-    label: 'Type',
-    value: 'ERC20',
-    valueToolTip: 'An asset originated from an Ethereum ERC20 Token',
-  },
-  {
-    label: 'Name',
-    value: 'Euro',
-  },
-  {
-    label: 'Symbol',
-    value: 'tEURO',
-  },
-  {
-    label: 'Decimals',
-    value: '5',
-    labelTooltip: 'Number of decimal / precision handled by this asset',
-  },
-  {
-    label: 'Quantum',
-    value: '0.00001',
-    labelTooltip: 'The minimum economically meaningful amount of the asset',
-  },
-  {
-    label: 'Status',
-    value: 'Enabled',
-    labelTooltip: 'The status of the asset in the Vega network',
-    valueToolTip: 'Asset can be used on the Vega network',
-  },
-  {
-    label: 'Contract address',
-    value: '0x0158031158Bb4dF2AD02eAA31e8963E84EA978a4 ',
-    labelTooltip:
-      'The address of the contract for the token, on the ethereum network',
-  },
-  {
-    label: 'Withdrawal threshold',
-    value: '0.0005',
-    labelTooltip:
-      "The maximum you can withdraw instantly. There's no limit on the size of a withdrawal, but all withdrawals over the threshold will have a delay time added to them",
-  },
-  {
-    label: 'Lifetime limit',
-    value: '1,230.00',
-    labelTooltip:
-      'The lifetime deposit limit per address. Note: this is a temporary measure that can be changed or removed through governance',
-  },
-  { label: '', value: '' },
-  {
-    label: 'Infrastructure fee account balance',
-    value: '0.00001',
-    labelTooltip: 'The infrastructure fee account in this asset',
-  },
-  {
-    label: 'Global reward pool account balance',
-    value: '0.00002',
-    labelTooltip: 'The global rewards acquired in this asset',
-  },
-  {
-    label: 'Maker paid fees account balance',
-    value: '0.00003',
-    labelTooltip:
-      'The rewards acquired based on the fees paid to makers in this asset',
-  },
-  {
-    label: 'Maker received fees account balance',
-    value: '0.00004',
-    labelTooltip:
-      'The rewards acquired based on fees received for being a maker on trades',
-  },
-  {
-    label: 'Liquidity provision fee reward account balance',
-    value: '0.00005',
-    labelTooltip:
-      'The rewards acquired based on the liquidity provision fees in this asset',
-  },
-  {
-    label: 'Market proposer reward account balance',
-    value: '0.00006',
-    labelTooltip:
-      'The rewards acquired based on the market proposer reward in this asset',
-  },
-];
-//endregion
-
-beforeEach(() => {
-  cy.mockTradingPage();
-  cy.mockSubscription();
-  cy.setVegaWallet();
-});
-
-const visitPortfolioAndClickAsset = (assetName: string) => {
-  cy.visit('/#/portfolio');
-  cy.get(assetColId).contains(assetName).click();
-};
-
-const testTooltip = (index: number, testId: string, tooltip: string) => {
-  cy.getByTestId(`${index}_${testId}`).realHover();
-  cy.get('[role="tooltip"]').find('div').should('have.text', tooltip);
-  cy.getByTestId(dialogTitle).click();
-};
-
-describe('assets', { tags: '@smoke', testIsolation: true }, () => {
-  it('asset details', () => {
-    visitPortfolioAndClickAsset('tBTC');
-
-    cy.getByTestId(assetRow).each((element, index) => {
-      if (index === 10) {
-        return;
-      }
-      const { label, value, labelTooltip, valueToolTip } =
-        labelValueToolTipPairs[index];
-      // 6501-ASSE-001
-      // 6501-ASSE-002
-      // 6501-ASSE-003
-      // 6501-ASSE-004
-      // 6501-ASSE-005
-      // 6501-ASSE-006
-      // 6501-ASSE-007
-      // 6501-ASSE-008
-      // 6501-ASSE-009
-      // 6501-ASSE-010
-      // 6501-ASSE-011
-      cy.getByTestId(`${index}_label`).should('have.text', label);
-      cy.getByTestId(`${index}_value`).should('have.text', value);
-
-      // 6501-ASSE-012
-      if (indicesWithLabelTooltips.includes(index)) {
-        if (labelTooltip) {
-          testTooltip(index, 'label', labelTooltip);
-        }
-      }
-      if (indicesWithValueTooltips.includes(index)) {
-        if (valueToolTip) {
-          testTooltip(index, 'value', valueToolTip);
-        }
-      }
-    });
-    // 6501-ASSE-013
-    cy.getByTestId(dialogCloseX).click();
-    cy.document().then((doc) => {
-      expect(doc.querySelector(assetDetailsDialog)).to.not.exist;
-    });
-  });
-
-  it('ERC20 Contract address', () => {
-    visitPortfolioAndClickAsset('tBTC');
-    cy.getByTestId(contractAddress).within(() => {
-      // 6501-ASSE-014
-      cy.getByTestId('external-link')
-        .should('have.attr', 'target', '_blank')
-        .should('have.text', '0x0158031158Bb4dF2AD02eAA31e8963E84EA978a4');
-    });
-    // 6501-ASSE-013
-    cy.getByTestId(dialogCloseBtn).click();
-    cy.document().then((doc) => {
-      expect(doc.querySelector(assetDetailsDialog)).to.not.exist;
-    });
-  });
-});

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

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

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

@@ -1,208 +0,0 @@
-import { aliasGQLQuery } from '@vegaprotocol/cypress';
-import type { ProposalListFieldsFragment } from '@vegaprotocol/proposals';
-import * as Schema from '@vegaprotocol/types';
-
-const dialogContent = 'welcome-dialog';
-
-const generateProposal = (code: string): ProposalListFieldsFragment => ({
-  __typename: 'Proposal',
-  reference: '',
-  state: Schema.ProposalState.STATE_OPEN,
-  datetime: '',
-  votes: {
-    __typename: undefined,
-    yes: {
-      __typename: undefined,
-      totalTokens: '',
-      totalNumber: '',
-      totalWeight: '',
-    },
-    no: {
-      __typename: undefined,
-      totalTokens: '',
-      totalNumber: '',
-      totalWeight: '',
-    },
-  },
-  requiredMajority: '',
-  party: {
-    __typename: 'Party',
-    id: '',
-  },
-  rationale: {
-    __typename: 'ProposalRationale',
-    description: '',
-    title: '',
-  },
-  requiredParticipation: '',
-  errorDetails: '',
-  rejectionReason: null,
-  requiredLpMajority: '',
-  requiredLpParticipation: '',
-  terms: {
-    __typename: 'ProposalTerms',
-    closingDatetime: '',
-    enactmentDatetime: undefined,
-    change: {
-      __typename: 'NewMarket',
-      decimalPlaces: 1,
-      lpPriceRange: '',
-      riskParameters: {
-        __typename: 'SimpleRiskModel',
-        params: {
-          __typename: 'SimpleRiskModelParams',
-          factorLong: 0,
-          factorShort: 1,
-        },
-      },
-      metadata: [],
-      instrument: {
-        __typename: 'InstrumentConfiguration',
-        code: code,
-        name: code,
-        futureProduct: {
-          __typename: 'FutureProduct',
-          settlementAsset: {
-            __typename: 'Asset',
-            id: 'A',
-            name: 'A',
-            symbol: 'A',
-            decimals: 1,
-            quantum: '',
-          },
-          quoteName: '',
-          dataSourceSpecBinding: {
-            __typename: 'DataSourceSpecToFutureBinding',
-            settlementDataProperty: '',
-            tradingTerminationProperty: '',
-          },
-          dataSourceSpecForSettlementData: {
-            __typename: 'DataSourceDefinition',
-            sourceType: {
-              __typename: 'DataSourceDefinitionInternal',
-            },
-          },
-          dataSourceSpecForTradingTermination: {
-            __typename: 'DataSourceDefinition',
-            sourceType: {
-              __typename: 'DataSourceDefinitionInternal',
-            },
-          },
-        },
-      },
-    },
-  },
-});
-
-describe('home', { tags: '@regression' }, () => {
-  beforeEach(() => {
-    cy.clearLocalStorage();
-    cy.mockTradingPage();
-    cy.mockSubscription();
-  });
-
-  describe('default market found', () => {
-    it('redirects to a default market with the landing dialog open', () => {
-      cy.visit('/');
-      cy.wait('@Markets');
-
-      cy.get('[data-testid^="pathname-/markets/"]');
-
-      // the choose market overlay is no longer showing
-      cy.contains('Loading...').should('not.exist');
-      cy.url().should('eq', Cypress.config().baseUrl + '/#/markets/market-0');
-    });
-  });
-
-  describe('no markets found', () => {
-    beforeEach(() => {
-      cy.mockGQL((req) => {
-        const data = {
-          marketsConnection: {
-            __typename: 'MarketConnection',
-            edges: [],
-          },
-        };
-        const proposalA: ProposalListFieldsFragment =
-          generateProposal('AAAZZZ');
-
-        aliasGQLQuery(req, 'Markets', data);
-        aliasGQLQuery(req, 'MarketsData', data);
-        aliasGQLQuery(req, 'ProposalsList', {
-          proposalsConnection: {
-            __typename: 'ProposalsConnection',
-            edges: [{ __typename: 'ProposalEdge', node: proposalA }],
-          },
-        });
-      });
-      cy.visit('/');
-      cy.wait('@Markets');
-      cy.wait('@MarketsData');
-    });
-
-    it('close welcome dialog should redirect to market/all', () => {
-      cy.url().should('eq', Cypress.config().baseUrl + `/#/markets/all`);
-      cy.getByTestId('welcome-dialog').should('be.visible');
-      cy.getByTestId('welcome-title').should('contain.text', 'Console CUSTOM');
-      cy.getByTestId('browse-markets-button').should('not.be.disabled');
-      cy.getByTestId('get-started-banner').should('be.visible');
-      cy.getByTestId('get-started-button').should('not.be.disabled');
-      cy.getByTestId('dialog-close').click();
-      cy.url().should('eq', Cypress.config().baseUrl + `/#/markets/all`);
-      cy.window().then((window) => {
-        expect(window.localStorage.getItem('vega_onboarding_viewed')).to.equal(
-          'true'
-        );
-      });
-    });
-
-    it('click browse markets button should redirect to market/all', () => {
-      cy.getByTestId('welcome-dialog').should('be.visible');
-      cy.getByTestId('browse-markets-button').click();
-      cy.url().should('eq', Cypress.config().baseUrl + `/#/markets/all`);
-      cy.window().then((window) => {
-        expect(window.localStorage.getItem('vega_onboarding_viewed')).to.equal(
-          'true'
-        );
-      });
-    });
-
-    it('click get started button should open connect dialog', () => {
-      cy.getByTestId('welcome-dialog').should('be.visible');
-      cy.getByTestId('get-started-button').click();
-      cy.url().should('eq', Cypress.config().baseUrl + `/#/markets/all`);
-      cy.window().then((window) => {
-        expect(window.localStorage.getItem('vega_onboarding_viewed')).to.equal(
-          'true'
-        );
-      });
-      cy.getByTestId('wallet-dialog-title').should('contain.text', 'Connect');
-    });
-  });
-
-  describe('redirect should take last visited market into consideration', () => {
-    it('marketId comes from existing market', () => {
-      cy.window().then((window) => {
-        window.localStorage.setItem('marketId', 'market-1');
-        cy.visit('/');
-        cy.getByTestId('dialog-close').click();
-        cy.location('hash').should('equal', '#/markets/market-1');
-        cy.getByTestId(dialogContent).should('not.exist');
-      });
-    });
-
-    it('marketId comes from not-existing market', () => {
-      cy.window().then((window) => {
-        window.localStorage.setItem('marketId', 'market-not-existing');
-        cy.mockGQL((req) => {
-          aliasGQLQuery(req, 'Market', null);
-        });
-        cy.visit('/');
-        cy.wait('@Markets');
-        cy.getByTestId('dialog-close').click();
-        cy.location('hash').should('equal', '#/markets/market-not-existing');
-        cy.getByTestId(dialogContent).should('not.exist');
-      });
-    });
-  });
-});

apps/trading-e2e/src/integration/markets-proposed.cy.ts

@@ -217,7 +217,7 @@ describe('no markets proposed', { tags: '@smoke', testIsolation: true }, () => {
     cy.setOnBoardingViewed();
   });
 
-  it('can see no markets message', () => {
+  it.skip('can see no markets message', () => {
     cy.visit('/#/markets/all');
     cy.get('[data-testid="Proposed markets"]').click();
 

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

@@ -1,73 +0,0 @@
-import * as Schema from '@vegaprotocol/types';
-import { aliasGQLQuery } from '@vegaprotocol/cypress';
-import { marketsQuery } from '@vegaprotocol/mock';
-import { getDateTimeFormat } from '@vegaprotocol/utils';
-
-describe('markets table', { tags: '@smoke' }, () => {
-  beforeEach(() => {
-    cy.clearLocalStorage().then(() => {
-      cy.mockTradingPage(
-        Schema.MarketState.STATE_ACTIVE,
-        Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION,
-        Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY_TARGET_NOT_MET
-      );
-      cy.mockSubscription();
-      cy.setOnBoardingViewed();
-      cy.visit('/#/markets/all');
-    });
-  });
-
-  it('opening auction subsets should be properly displayed', () => {
-    cy.mockTradingPage(
-      Schema.MarketState.STATE_ACTIVE,
-      Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION
-    );
-    cy.mockGQL((req) => {
-      const override = {
-        marketsConnection: {
-          edges: [
-            {
-              node: {
-                tradableInstrument: {
-                  instrument: {
-                    name: `opening auction MARKET`,
-                  },
-                },
-                state: Schema.MarketState.STATE_ACTIVE,
-                tradingMode:
-                  Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION,
-              },
-            },
-          ],
-        },
-      };
-      // @ts-ignore partial deep check failing
-      const market = marketsQuery(override);
-      aliasGQLQuery(req, 'Market', market);
-      aliasGQLQuery(req, 'ProposalOfMarket', {
-        proposal: { terms: { enactmentDatetime: '2023-01-31 12:00:01' } },
-      });
-    });
-    cy.visit('#/markets/market-0');
-    cy.url().should('contain', 'market-0');
-    cy.getByTestId('item-value').contains('Opening auction').realHover();
-    cy.getByTestId('opening-auction-sub-status').should(
-      'contain.text',
-      'Opening auction: Not enough liquidity to open'
-    );
-
-    const now = new Date(Date.parse('2023-01-30 12:00:01')).getTime();
-    cy.clock(now, ['Date']); // Set "now" to BEFORE reservation
-    cy.reload();
-    cy.getByTestId('item-value').contains('Opening auction').realHover();
-    cy.getByTestId('opening-auction-sub-status').should(
-      'contain.text',
-      `Opening auction: Closing on ${getDateTimeFormat().format(
-        new Date('2023-01-31 12:00:01')
-      )}`
-    );
-    cy.clock().then((clock) => {
-      clock.restore();
-    });
-  });
-});

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

@@ -53,7 +53,7 @@ describe('fills', { tags: '@regression' }, () => {
     cy.getByTestId(tabFills).contains('Market');
     cy.getByTestId(tabFills)
       .get(
-        '[role="gridcell"][col-id="market.tradableInstrument.instrument.name"]'
+        '[role="gridcell"][col-id="market.tradableInstrument.instrument.code"]'
       )
       .each(($marketSymbol) => {
         cy.wrap($marketSymbol).invoke('text').should('not.be.empty');

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

@@ -27,7 +27,8 @@ describe('positions', { tags: '@smoke', testIsolation: true }, () => {
     validatePositionsDisplayed();
   });
 
-  it('renders positions on portfolio page', () => {
+  // TODO: move this to sim, its flakey
+  it.skip('renders positions on portfolio page', () => {
     cy.mockGQL((req) => {
       const positions = positionsQuery();
       if (positions.positions?.edges) {
@@ -142,22 +143,22 @@ describe('positions', { tags: '@regression', testIsolation: true }, () => {
   it('sorting by Market', () => {
     visitAndClickPositions();
     const marketsSortedDefault = [
-      'ACTIVE MARKET',
-      'Apple Monthly (30 Jun 2022)',
-      'ETHBTC Quarterly (30 Jun 2022)',
-      'SUSPENDED MARKET',
+      'AAPL.MF21',
+      'BTCUSD.MF21',
+      'ETHBTC.QM21',
+      'SOLUSD',
     ];
     const marketsSortedAsc = [
-      'ACTIVE MARKET',
-      'Apple Monthly (30 Jun 2022)',
-      'ETHBTC Quarterly (30 Jun 2022)',
-      'SUSPENDED MARKET',
+      'AAPL.MF21',
+      'BTCUSD.MF21',
+      'ETHBTC.QM21',
+      'SOLUSD',
     ];
     const marketsSortedDesc = [
-      'SUSPENDED MARKET',
-      'ETHBTC Quarterly (30 Jun 2022)',
-      'Apple Monthly (30 Jun 2022)',
-      'ACTIVE MARKET',
+      'SOLUSD',
+      'ETHBTC.QM21',
+      'BTCUSD.MF21',
+      'AAPL.MF21',
     ];
     cy.getByTestId(positions).click();
     // 7004-POSI-003
@@ -230,7 +231,7 @@ describe('positions', { tags: '@regression', testIsolation: true }, () => {
       deltaX: 500,
     });
     // 7004-POSI-004
-    cy.get('[col-id="updatedAt"]').should('be.visible');
+    cy.get('[col-id="unrealisedPNL"]').should('be.visible');
   });
 
   it('Drag and drop columns', () => {
@@ -310,7 +311,7 @@ function validatePositionsDisplayed(multiKey = false) {
   cy.getByTestId('tab-positions').should('be.visible');
   cy.getByTestId('tab-positions')
     .get('.ag-center-cols-container .ag-row')
-    .first()
+    .eq(multiKey ? 3 : 1)
     .within(() => {
       cy.get('[col-id="marketName"]')
         .should('be.visible')

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

@@ -59,8 +59,7 @@ describe('trades', { tags: '@smoke' }, () => {
     cy.getByTestId(tradesTable) // order table shares identical col id
       .find(`${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;
+    const dateTimeRegex = /(\d{1,2}):(\d{1,2}):(\d{1,2})/gm;
     cy.getByTestId(tradesTable)
       .get(`.ag-center-cols-container ${colIdCreatedAt}`)
       .each(($tradeDateTime) => {
@@ -87,6 +86,7 @@ describe('trades', { tags: '@smoke' }, () => {
   });
 
   it('copy price to deal ticket form', () => {
+    cy.getByTestId('Order').click();
     // 6005-THIS-007
     cy.get(colIdPrice).last().should('be.visible').click();
     cy.getByTestId('order-price').should('have.value', '171.16898');

apps/trading-e2e/src/integration/wallet-vega.cy.ts

@@ -5,118 +5,8 @@ import {
 
 const connectVegaBtn = 'connect-vega-wallet';
 const manageVegaBtn = 'manage-vega-wallet';
-const form = 'rest-connector-form';
 const dialogContent = 'dialog-content';
 
-describe(
-  'connect hosted wallet',
-  { tags: '@smoke', testIsolation: true },
-  () => {
-    beforeEach(() => {
-      // Using portfolio page as it requires vega wallet connection
-      cy.visit('/#/portfolio');
-      cy.mockTradingPage();
-      cy.mockSubscription();
-      cy.setOnBoardingViewed();
-      cy.get('[data-testid="pathname-/portfolio"]').should('exist');
-    });
-
-    it('can connect', () => {
-      // 0002-WCON-002
-      // 0002-WCON-003
-      // 0002-WCON-039
-      // 0002-WCON-017
-      // 0002-WCON-018
-      // 0002-WCON-019
-
-      // Mock authentication
-      cy.intercept(
-        'POST',
-        'https://wallet.testnet.vega.xyz/api/v1/auth/token',
-        {
-          body: {
-            token: 'test-token',
-          },
-        }
-      );
-      // Mock getting keys from wallet
-      cy.intercept('GET', 'https://wallet.testnet.vega.xyz/api/v1/keys', {
-        body: {
-          keys: [
-            {
-              algorithm: {
-                name: 'algo',
-                version: 1,
-              },
-              index: 0,
-              meta: [],
-              pub: 'HOSTED_PUBKEY',
-              tainted: false,
-            },
-          ],
-        },
-      });
-      cy.getByTestId(connectVegaBtn).click();
-      cy.contains(
-        'Choose wallet app to connect, or to change port or server URL enter a custom wallet location first'
-      );
-      cy.contains('Connect Vega wallet');
-      cy.contains('Hosted Fairground wallet');
-
-      cy.getByTestId('connectors-list')
-        .find('[data-testid="connector-rest"]')
-        .click();
-      cy.getByTestId(form).find('#wallet').click().type('user');
-      cy.getByTestId(form).find('#passphrase').click().type('pass');
-      cy.getByTestId('rest-connector-form').find('button[type=submit]').click();
-      cy.getByTestId(manageVegaBtn).should('exist');
-      cy.getByTestId('manage-vega-wallet').click();
-      cy.getByTestId('keypair-list').should('exist');
-    });
-
-    it('doesnt connect with invalid credentials', () => {
-      // 0002-WCON-020
-
-      // Mock incorrect username/password
-      cy.intercept(
-        'POST',
-        'https://wallet.testnet.vega.xyz/api/v1/auth/token',
-        {
-          body: {
-            error: 'No wallet',
-          },
-          statusCode: 403, // 403 forbidden invalid crednetials
-        }
-      );
-      cy.getByTestId(connectVegaBtn).click();
-      cy.getByTestId('connectors-list')
-        .find('[data-testid="connector-rest"]')
-        .click();
-      cy.getByTestId(form).find('#wallet').click().type('invalid name');
-      cy.getByTestId(form).find('#passphrase').click().type('invalid password');
-      cy.getByTestId('rest-connector-form').find('button[type=submit]').click();
-      cy.getByTestId('form-error').should('have.text', 'Invalid credentials');
-    });
-
-    it('doesnt connect with empty fields', () => {
-      cy.getByTestId(connectVegaBtn).click();
-      cy.getByTestId('connectors-list')
-        .find('[data-testid="connector-rest"]')
-        .click();
-
-      cy.getByTestId('rest-connector-form').find('button[type=submit]').click();
-      cy.getByTestId(form)
-        .find('#wallet')
-        .next('[data-testid="input-error-text"]')
-        .should('have.text', 'Required');
-      cy.getByTestId(form)
-        .find('#passphrase')
-        .next('[data-testid="input-error-text"]')
-        .should('have.text', 'Required');
-    });
-  }
-);
-
 describe('connect vega wallet', { tags: '@smoke', testIsolation: true }, () => {
   beforeEach(() => {
     // Using portfolio page as it requires vega wallet connection
@@ -196,8 +86,6 @@ describe('connect vega wallet', { tags: '@smoke', testIsolation: true }, () => {
     cy.getByTestId('connect-vega-wallet').should('exist');
     cy.getByTestId('manage-vega-wallet').should('not.exist');
     cy.getByTestId('connect-vega-wallet').click();
-    cy.contains(
-      'Choose wallet app to connect, or to change port or server URL enter a custom wallet location first'
-    );
+    cy.contains('Enter a custom wallet location');
   });
 });

apps/trading/.env

@@ -1,4 +1,3 @@
-NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9edefb8
 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
@@ -13,9 +12,11 @@ NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_VEGA_REPO_URL=https://github.com/vegaprotocol/vega/releases
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/main/announcements.json
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72
+NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true
 NX_STOP_ORDERS=true
 # NX_ICEBERG_ORDERS
-# NX_PRODUCT_PERPETUALS
+# NX_PRODUCT_PERPETUALS

apps/trading/assets/env-config.js

@@ -0,0 +1 @@
+window._env_ = {};

apps/trading/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+  "short_name": "Mainnet Stats",
+  "name": "Vega Mainnet statistics",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

apps/trading/assets/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

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

@@ -1,6 +1,5 @@
 import type { ComponentProps } from 'react';
 import { Splash } from '@vegaprotocol/ui-toolkit';
-import { TradesContainer } from '@vegaprotocol/trades';
 import { DepthChartContainer } from '@vegaprotocol/market-depth';
 import {
   CandlesChartContainer,
@@ -8,6 +7,7 @@ import {
 } from '@vegaprotocol/candles-chart';
 import { Filter, OpenOrdersMenu } from '@vegaprotocol/orders';
 import { NO_MARKET } from './constants';
+import { TradesContainer } from '../../components/trades-container';
 import { OrderbookContainer } from '../../components/orderbook-container';
 import { FillsContainer } from '../../components/fills-container';
 import { PositionsContainer } from '../../components/positions-container';

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

@@ -411,24 +411,26 @@ describe('Closed', () => {
         },
       },
     };
-    render(
-      <MemoryRouter>
-        <MockedProvider
-          mocks={[
-            mixedMarketsMock,
-            marketsDataMock,
-            oracleDataMock,
-            successorMarketsMock,
-          ]}
-        >
-          <VegaWalletContext.Provider
-            value={{ pubKey } as VegaWalletContextShape}
+    await act(() => {
+      render(
+        <MemoryRouter>
+          <MockedProvider
+            mocks={[
+              mixedMarketsMock,
+              marketsDataMock,
+              oracleDataMock,
+              successorMarketsMock,
+            ]}
           >
-            <Closed />
-          </VegaWalletContext.Provider>
-        </MockedProvider>
-      </MemoryRouter>
-    );
+            <VegaWalletContext.Provider
+              value={{ pubKey } as VegaWalletContextShape}
+            >
+              <Closed />
+            </VegaWalletContext.Provider>
+          </MockedProvider>
+        </MemoryRouter>
+      );
+    });
 
     await waitFor(() => {
       expect(

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

@@ -276,15 +276,9 @@ const ClosedMarketsDataGrid = ({
 
   return (
     <AgGrid
-      style={{ width: '100%', height: '100%' }}
       rowData={rowData}
       columnDefs={colDefs}
       getRowId={({ data }) => data.id}
-      defaultColDef={{
-        resizable: true,
-        minWidth: 100,
-        flex: 1,
-      }}
       components={{ SuccessorMarketRenderer }}
       overlayNoRowsTemplate={error ? error.message : t('No markets')}
     />

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

@@ -134,6 +134,20 @@ describe('MarketSelector', () => {
     error: undefined,
   });
 
+  it('Button "All" should be selected by default', () => {
+    const buttons = ['All', 'Futures', 'Spot', 'Perpetuals'];
+    render(
+      <MemoryRouter>
+        <MarketSelector currentMarketId="market-0" onSelect={jest.fn()} />
+      </MemoryRouter>
+    );
+    screen
+      .getAllByTestId(/^product-(All|Future|Spot|Perpetual)$/)
+      .forEach((elem, i) => {
+        expect(elem.textContent).toEqual(buttons[i]);
+      });
+  });
+
   it('renders only active markets', () => {
     render(
       <MemoryRouter>
@@ -169,6 +183,12 @@ describe('MarketSelector', () => {
       activeMarkets.length
     );
     expect(screen.queryByTestId('no-items')).not.toBeInTheDocument();
+
+    await userEvent.click(screen.getByTestId('product-All'));
+    expect(screen.queryAllByTestId(/market-\d/)).toHaveLength(
+      activeMarkets.length
+    );
+    expect(screen.queryByTestId('no-items')).not.toBeInTheDocument();
   });
 
   it('filters by search term', async () => {

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

@@ -39,7 +39,7 @@ export const MarketSelector = ({
 }) => {
   const [filter, setFilter] = useState<Filter>({
     searchTerm: '',
-    product: Product.Future,
+    product: Product.All,
     sort: Sort.None,
     assets: [],
   });

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

@@ -6,6 +6,7 @@ import { VegaIcon, VegaIconNames } from '@vegaprotocol/ui-toolkit';
 
 // Make sure these match the available __typename properties on product
 export const Product = {
+  All: 'All',
   Future: 'Future',
   Spot: 'Spot',
   Perpetual: 'Perpetual',
@@ -16,6 +17,7 @@ export type ProductType = keyof typeof Product;
 const ProductTypeMapping: {
   [key in ProductType]: string;
 } = {
+  [Product.All]: 'All',
   [Product.Future]: 'Futures',
   [Product.Spot]: 'Spot',
   [Product.Perpetual]: 'Perpetuals',
@@ -49,8 +51,12 @@ export const ProductSelector = ({
           </button>
         );
       })}
-      <Link to={Routes.MARKETS} className="flex items-center gap-2 ml-auto">
-        <span className="underline underline-offset-4">{t('All markets')}</span>
+      <Link
+        to={Routes.MARKETS}
+        className="flex items-center gap-2 ml-auto"
+        title={t('See all markets')}
+      >
+        <span className="underline underline-offset-4">{t('Browse')}</span>
         <VegaIcon name={VegaIconNames.ARROW_RIGHT} />
       </Link>
     </div>

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

@@ -120,6 +120,13 @@ describe('useMarketSelectorList', () => {
       assets: [],
     });
     expect(result.current.markets).toEqual([markets[2]]);
+    rerender({
+      searchTerm: '',
+      product: Product.All,
+      sort: Sort.None,
+      assets: [],
+    });
+    expect(result.current.markets).toEqual(markets);
   });
 
   it('filters by asset', () => {

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

@@ -5,6 +5,7 @@ import { calcCandleVolume, useMarketList } from '@vegaprotocol/markets';
 import { priceChangePercentage } from '@vegaprotocol/utils';
 import type { Filter } from '../../components/market-selector/market-selector';
 import { Sort } from './sort-dropdown';
+import { Product } from './product-selector';
 
 // Used for sort order and filter
 const MARKET_TEMPLATE = [
@@ -28,7 +29,10 @@ export const useMarketSelectorList = ({
       .filter((m) => isMarketActive(m.state))
       // only selected product type
       .filter((m) => {
-        if (m.tradableInstrument.instrument.product.__typename === product) {
+        if (
+          product === Product.All ||
+          m.tradableInstrument.instrument.product.__typename === product
+        ) {
           return true;
         }
         return false;

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

@@ -15,9 +15,7 @@ export const PositionsContainer = ({ allKeys }: { allKeys?: boolean }) => {
 
   const gridStore = usePositionsStore((store) => store.gridStore);
   const updateGridStore = usePositionsStore((store) => store.updateGridStore);
-  const gridStoreCallbacks = useDataGridEvents(gridStore, (colState) => {
-    updateGridStore(colState);
-  });
+  const gridStoreCallbacks = useDataGridEvents(gridStore, updateGridStore);
 
   if (!pubKey) {
     return (

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

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

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

@@ -0,0 +1,24 @@
+import { TradesManager } from '@vegaprotocol/trades';
+import type { DataGridSlice } from '../../stores/datagrid-store-slice';
+import { createDataGridSlice } from '../../stores/datagrid-store-slice';
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import { useDataGridEvents } from '@vegaprotocol/datagrid';
+
+interface TradesContainerProps {
+  marketId: string;
+}
+
+export const TradesContainer = ({ marketId }: TradesContainerProps) => {
+  const gridStore = useTradesStore((store) => store.gridStore);
+  const updateGridStore = useTradesStore((store) => store.updateGridStore);
+  const gridStoreCallbacks = useDataGridEvents(gridStore, updateGridStore);
+
+  return <TradesManager marketId={marketId} gridProps={gridStoreCallbacks} />;
+};
+
+const useTradesStore = create<DataGridSlice>()(
+  persist(createDataGridSlice, {
+    name: 'vega_trades_store',
+  })
+);

apps/trading/lib/vega-connectors.ts

@@ -1,11 +1,9 @@
 import {
-  RestConnector,
   JsonRpcConnector,
   ViewConnector,
   InjectedConnector,
 } from '@vegaprotocol/wallet';
 
-export const rest = new RestConnector();
 export const jsonRpc = new JsonRpcConnector();
 export const injected = new InjectedConnector();
 
@@ -19,7 +17,6 @@ if (typeof window !== 'undefined') {
 
 export const Connectors = {
   injected,
-  rest,
   jsonRpc,
   view,
 };

apps/trading/pages/index.page.tsx

@@ -1,3 +1,4 @@
+import Head from 'next/head';
 import { ClientRouter } from './client-router';
 
 /**
@@ -6,5 +7,30 @@ import { ClientRouter } from './client-router';
  * have to serve a static site via next export
  */
 export default function Index() {
-  return <ClientRouter />;
+  return (
+    <>
+      <Head>
+        <meta charSet="utf-8" />
+        <link
+          rel="icon"
+          type="image/x-icon"
+          href="https://static.vega.xyz/favicon.ico"
+        />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <meta name="theme-color" content="#000000" />
+        <meta name="description" content="Vega Protocol - Console" />
+
+        <link rel="apple-touch-icon" href="assets/apple-touch-icon.png" />
+        <link rel="manifest" href="assets/manifest.json" />
+        <link
+          rel="preload"
+          href="https://static.vega.xyz/AlphaLyrae-Medium.woff2"
+          as="font"
+          type="font/woff2"
+        />
+        <title>VEGA Console dApp</title>
+      </Head>
+      <ClientRouter />
+    </>
+  );
 }

apps/trading/pages/styles.css

@@ -142,12 +142,19 @@ html [data-theme='dark'] {
   border-width: 0;
 }
 
+.vega-ag-grid .ag-cell .ag-cell-wrapper {
+  height: 100%;
+}
+
 .vega-ag-grid .ag-header-row {
   @apply font-alpha font-normal;
 }
 
 /* Light variables */
 .ag-theme-balham {
+  --ag-grid-size: 2px; /* Used for compactness */
+  --ag-row-height: 36px;
+  --ag-header-height: 36px;
   --ag-background-color: theme(colors.white);
   --ag-border-color: theme(colors.vega.clight.600);
   --ag-header-background-color: theme(colors.vega.clight.700);
@@ -160,6 +167,9 @@ html [data-theme='dark'] {
 
 /* Dark variables */
 .ag-theme-balham-dark {
+  --ag-grid-size: 2px; /* Used for compactness */
+  --ag-row-height: 36px;
+  --ag-header-height: 36px;
   --ag-background-color: theme(colors.vega.cdark.900);
   --ag-border-color: theme(colors.vega.cdark.600);
   --ag-header-background-color: theme(colors.vega.cdark.700);

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

@@ -58,6 +58,12 @@ export const accountValuesComparator = (
   return valueA > valueB ? 1 : -1;
 };
 
+const defaultColDef = {
+  resizable: true,
+  sortable: true,
+  tooltipComponent: TooltipCellComponent,
+  comparator: accountValuesComparator,
+};
 export interface GetRowsParams extends Omit<IGetRowsParams, 'successCallback'> {
   successCallback(rowsThisBlock: AccountFields[], lastRow?: number): void;
 }
@@ -306,16 +312,10 @@ export const AccountTable = ({
   return (
     <AgGrid
       {...props}
-      style={{ width: '100%', height: '100%' }}
       getRowId={({ data }: { data: AccountFields }) => data.asset.id}
       tooltipShowDelay={500}
       rowData={data}
-      defaultColDef={{
-        resizable: true,
-        tooltipComponent: TooltipCellComponent,
-        sortable: true,
-        comparator: accountValuesComparator,
-      }}
+      defaultColDef={defaultColDef}
       columnDefs={colDefs}
       getRowHeight={getPinnedAssetRowHeight}
       pinnedTopRowData={pinnedRow ? [pinnedRow] : undefined}

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

@@ -23,6 +23,7 @@ const singleRow = {
       instrument: {
         __typename: 'Instrument',
         name: 'BTCUSD Monthly (30 Jun 2022)',
+        code: 'BTCUSD.MF21',
       },
     },
     id: '10cd0a793ad2887b340940337fa6d97a212e0e517fe8e9eab2b5ef3a38633f35',
@@ -57,7 +58,7 @@ describe('BreakdownTable', () => {
     });
     const cells = await screen.findAllByRole('gridcell');
     const expectedValues = [
-      'BTCUSD Monthly (30 Jun 2022)',
+      'BTCUSD.MF21',
       'Margin',
       '1,256.00 (50%)',
       '1,256.00',
@@ -118,6 +119,7 @@ describe('BreakdownTable', () => {
                 instrument: {
                   __typename: 'Instrument',
                   name: 'BTCUSD Monthly (30 Jun 2022)',
+                  code: 'BTCUSD.MF21',
                 },
               },
             },

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

@@ -20,6 +20,10 @@ import { MarginHealthChart } from './margin-health-chart';
 import { MarketNameCell } from '@vegaprotocol/datagrid';
 import { AccountType } from '@vegaprotocol/types';
 
+const defaultColDef = {
+  resizable: true,
+  sortable: true,
+};
 interface BreakdownTableProps extends AgGridReactProps {
   data: AccountFields[] | null;
   onMarketClick?: (marketId: string, metaKey?: boolean) => void;
@@ -31,17 +35,16 @@ const BreakdownTable = forwardRef<AgGridReact, BreakdownTableProps>(
       const defs: ColDef[] = [
         {
           headerName: t('Market'),
-          field: 'market.tradableInstrument.instrument.name',
+          field: 'market.tradableInstrument.instrument.code',
           valueFormatter: ({
             value,
           }: VegaValueFormatterParams<
             AccountFields,
-            'market.tradableInstrument.instrument.name'
+            'market.tradableInstrument.instrument.code'
           >) => {
             if (!value) return 'None';
             return value;
           },
-          minWidth: 200,
         },
         {
           headerName: t('Account type'),
@@ -58,7 +61,6 @@ const BreakdownTable = forwardRef<AgGridReact, BreakdownTableProps>(
         {
           headerName: t('Balance'),
           field: 'used',
-          flex: 2,
           maxWidth: 500,
           type: 'rightAligned',
           tooltipComponent: TooltipCellComponent,
@@ -97,7 +99,6 @@ const BreakdownTable = forwardRef<AgGridReact, BreakdownTableProps>(
         {
           headerName: t('Margin health'),
           field: 'market.id',
-          flex: 2,
           maxWidth: 500,
           sortable: false,
           cellRenderer: ({
@@ -118,7 +119,6 @@ const BreakdownTable = forwardRef<AgGridReact, BreakdownTableProps>(
 
     return (
       <AgGrid
-        style={{ width: '100%', height: '100%' }}
         overlayNoRowsTemplate={t('Collateral not used')}
         rowData={data}
         getRowId={({ data }: { data: AccountFields }) =>
@@ -128,11 +128,7 @@ const BreakdownTable = forwardRef<AgGridReact, BreakdownTableProps>(
         rowHeight={34}
         components={{ PriceCell, MarketNameCell, ProgressBarCell }}
         tooltipShowDelay={500}
-        defaultColDef={{
-          flex: 1,
-          resizable: true,
-          sortable: true,
-        }}
+        defaultColDef={defaultColDef}
         columnDefs={coldefs}
       />
     );

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

@@ -7,21 +7,12 @@ import {
 } from '@vegaprotocol/network-parameters';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import type { Transfer } from '@vegaprotocol/wallet';
-import {
-  useVegaTransactionStore,
-  useVegaWallet,
-  useVegaWalletDialogStore,
-} from '@vegaprotocol/wallet';
+import { useVegaTransactionStore, useVegaWallet } from '@vegaprotocol/wallet';
 import { useCallback, useMemo } from 'react';
 import { accountsDataProvider } from './accounts-data-provider';
 import { TransferForm } from './transfer-form';
 import sortBy from 'lodash/sortBy';
-import {
-  ExternalLink,
-  Intent,
-  Lozenge,
-  Notification,
-} from '@vegaprotocol/ui-toolkit';
+import { Lozenge } from '@vegaprotocol/ui-toolkit';
 
 export const TransferContainer = ({ assetId }: { assetId?: string }) => {
   const { pubKey, pubKeys } = useVegaWallet();
@@ -32,10 +23,6 @@ export const TransferContainer = ({ assetId }: { assetId?: string }) => {
     skip: !pubKey,
   });
 
-  const openVegaWalletDialog = useVegaWalletDialogStore(
-    (store) => store.openVegaWalletDialog
-  );
-
   const create = useVegaTransactionStore((store) => store.create);
 
   const transfer = useCallback(
@@ -74,28 +61,6 @@ export const TransferContainer = ({ assetId }: { assetId?: string }) => {
         )}
         {t('. If you are at all unsure, stop and seek advice.')}
       </p>
-      {!pubKey && (
-        <div className="mb-4">
-          <Notification
-            intent={Intent.Warning}
-            message={
-              <p className="text-sm pb-2">
-                You need a{' '}
-                <ExternalLink href="https://vega.xyz/wallet">
-                  Vega wallet
-                </ExternalLink>{' '}
-                to make a transfer.
-              </p>
-            }
-            buttonProps={{
-              text: t('Connect wallet'),
-              action: openVegaWalletDialog,
-              dataTestId: 'order-connect-wallet',
-              size: 'small',
-            }}
-          />
-        </div>
-      )}
       <TransferForm
         pubKey={pubKey}
         pubKeys={pubKeys ? pubKeys?.map((pk) => pk.publicKey) : null}

libs/assets/src/lib/asset-data-provider.ts

@@ -28,10 +28,10 @@ export const assetProvider = makeDataProvider<
   getData,
 });
 
-export const useAssetDataProvider = (assetId: string) => {
+export const useAssetDataProvider = (assetId: string, skip?: boolean) => {
   return useDataProvider({
     dataProvider: assetProvider,
     variables: { assetId: assetId || '' },
-    skip: !assetId,
+    skip: !assetId || skip,
   });
 };

libs/cypress/src/index.ts

@@ -24,6 +24,7 @@ import { addVegaWalletSubmitLiquidityProvision } from './lib/commands/vega-walle
 import { addImportNodeWallets } from './lib/commands/import-node-wallets';
 import { addVegaWalletTopUpRewardsPool } from './lib/commands/vega-wallet-top-up-rewards-pool';
 import { addAssociateTokensToVegaWallet } from './lib/commands/associate-tokens-to-vega-wallet';
+import { addMockChainId } from './lib/commands/mock-chain-id';
 
 addGetTestIdcommand();
 addMockGQLCommand();
@@ -49,6 +50,7 @@ addVegaWalletSubmitLiquidityProvision();
 addImportNodeWallets();
 addVegaWalletTopUpRewardsPool();
 addAssociateTokensToVegaWallet();
+addMockChainId();
 
 export {
   mockConnectWallet,

libs/cypress/src/lib/commands/add-connect-public-key.ts

@@ -10,14 +10,11 @@ declare global {
 
 export const addConnectPublicKey = () => {
   Cypress.Commands.add('connectPublicKey', (publicKey) => {
-    const connectVegaWaletBtn = Cypress.$(
-      `[data-testid="connect-vega-wallet"]`
-    );
+    const connectVegaWaletBtn = Cypress.$(`[data-testid="view-as-user"]`);
     if (connectVegaWaletBtn.length > 0) {
-      cy.get('aside [data-testid="connect-vega-wallet"]').click();
-      cy.getByTestId('connector-view').should('be.visible').click();
-      cy.getByTestId('address').click();
-      cy.getByTestId('address').type(publicKey);
+      cy.get('aside button').contains('View as party').click();
+      cy.getByTestId('address').should('be.visible').focus();
+      cy.getByTestId('address').type(publicKey, { delay: 50 });
       cy.getByTestId('connect').click();
     }
   });

libs/cypress/src/lib/commands/mock-chain-id.ts

@@ -0,0 +1,22 @@
+import { aliasGQLQuery } from '../mock-gql';
+// eslint-disable-next-line @nx/enforce-module-boundaries
+import { chainIdQuery, statisticsQuery } from '@vegaprotocol/mock';
+
+declare global {
+  // eslint-disable-next-line @typescript-eslint/no-namespace
+  namespace Cypress {
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    interface Chainable<Subject> {
+      mockChainId(): void;
+    }
+  }
+}
+
+export function addMockChainId() {
+  Cypress.Commands.add('mockChainId', () => {
+    cy.mockGQL((req) => {
+      aliasGQLQuery(req, 'ChainId', chainIdQuery());
+      aliasGQLQuery(req, 'Statistics', statisticsQuery());
+    });
+  });
+}

libs/cypress/src/lib/commands/vega-wallet-connect.ts

@@ -29,7 +29,7 @@ export const mockConnectWallet = () => {
 
 export const mockConnectWalletWithUserError = () => {
   cy.mockWallet((req) => {
-    aliasWalletConnectWithUserError(req);
+    aliasWalletConnectWithUserError(req, Cypress.env('VEGA_WALLET_API_TOKEN'));
   });
 };
 

libs/cypress/src/lib/mock-rest.ts

@@ -62,10 +62,27 @@ export const aliasWalletConnectQuery = (
       },
     });
   }
+  if (hasMethod(req, 'client.get_chain_id')) {
+    req.reply({
+      statusCode: 200,
+      headers: {
+        'Access-Control-Expose-Headers': 'Authorization',
+        Authorization: `VWT ${token}`,
+      },
+      body: {
+        jsonrpc: '2.0',
+        result: {
+          chainID: 'test-id',
+        },
+        id: '1',
+      },
+    });
+  }
 };
 
 export const aliasWalletConnectWithUserError = (
-  req: CyHttpMessages.IncomingHttpRequest
+  req: CyHttpMessages.IncomingHttpRequest,
+  token: string
 ) => {
   if (hasMethod(req, 'client.connect_wallet')) {
     req.alias = 'client.connect_wallet';
@@ -82,4 +99,20 @@ export const aliasWalletConnectWithUserError = (
       },
     });
   }
+  if (hasMethod(req, 'client.get_chain_id')) {
+    req.reply({
+      statusCode: 200,
+      headers: {
+        'Access-Control-Expose-Headers': 'Authorization',
+        Authorization: `VWT ${token}`,
+      },
+      body: {
+        jsonrpc: '2.0',
+        result: {
+          chainID: 'test-id',
+        },
+        id: '1',
+      },
+    });
+  }
 };

libs/datagrid/src/lib/ag-grid/ag-grid-lazy-themed.tsx

@@ -3,6 +3,20 @@ import { AgGridReact } from 'ag-grid-react';
 import { useThemeSwitcher } from '@vegaprotocol/react-helpers';
 import { t } from '@vegaprotocol/i18n';
 import classNames from 'classnames';
+import type { ColDef } from 'ag-grid-community';
+
+const defaultProps: AgGridReactProps = {
+  enableCellTextSelection: true,
+  overlayLoadingTemplate: t('Loading...'),
+  overlayNoRowsTemplate: t('No data'),
+  suppressCellFocus: true,
+  suppressColumnMoveAnimation: true,
+};
+
+const defaultColDef: ColDef = {
+  resizable: true,
+  sortable: true,
+};
 
 export const AgGridThemed = ({
   style,
@@ -13,23 +27,20 @@ export const AgGridThemed = ({
   gridRef?: React.ForwardedRef<AgGridReact>;
 }) => {
   const { theme } = useThemeSwitcher();
-  const defaultProps = {
-    rowHeight: 22,
-    headerHeight: 22,
-    enableCellTextSelection: true,
-    overlayLoadingTemplate: t('Loading...'),
-    overlayNoRowsTemplate: t('No data'),
-    suppressCellFocus: true,
-  };
 
-  const wrapperClasses = classNames('vega-ag-grid', {
+  const wrapperClasses = classNames('vega-ag-grid', 'w-full h-full', {
     'ag-theme-balham': theme === 'light',
     'ag-theme-balham-dark': theme === 'dark',
   });
 
   return (
-    <div className={wrapperClasses} style={style}>
-      <AgGridReact {...defaultProps} {...props} ref={gridRef} />
+    <div className={wrapperClasses}>
+      <AgGridReact
+        defaultColDef={defaultColDef}
+        ref={gridRef}
+        {...defaultProps}
+        {...props}
+      />
     </div>
   );
 };

libs/datagrid/src/lib/cells/market-name-cell.tsx

@@ -29,7 +29,11 @@ export const MarketNameCell = ({
   );
   if (!value || !data) return null;
   return onMarketClick ? (
-    <button onClick={handleOnClick} tabIndex={0}>
+    <button
+      onClick={handleOnClick}
+      tabIndex={0}
+      className="block text-left text-ellipsis overflow-hidden whitespace-nowrap w-full"
+    >
       {value}
     </button>
   ) : (

libs/datagrid/src/lib/column-definitions.ts

@@ -4,8 +4,8 @@ export const COL_DEFS = {
     sortable: false,
     resizable: false,
     filter: false,
-    minWidth: 45,
-    maxWidth: 45,
+    minWidth: 30,
+    maxWidth: 30,
     type: 'rightAligned',
     pinned: 'right' as const,
   },

libs/datagrid/src/lib/use-datagrid-events.spec.tsx

@@ -14,7 +14,6 @@ const gridProps = {
     {
       field: 'id',
       width: 100,
-      resizable: true,
       filter: 'agNumberColumnFilter',
     },
   ],
@@ -50,7 +49,7 @@ describe('useDataGridEvents', () => {
     console.warn = originalWarn;
   });
 
-  it('default state is set and callback is called on column or filter event', async () => {
+  it('default state is set and callback is called on filter event', async () => {
     const callback = jest.fn();
     const initialState = {
       filterModel: undefined,
@@ -67,45 +66,6 @@ describe('useDataGridEvents', () => {
     // no filters set
     expect(result.current.api.getFilterModel()).toEqual({});
 
-    const newWidth = 400;
-
-    // Set col width
-    await act(async () => {
-      result.current.columnApi.setColumnWidth('id', newWidth);
-    });
-
-    act(() => {
-      jest.advanceTimersByTime(GRID_EVENT_DEBOUNCE_TIME);
-    });
-
-    expect(callback).toHaveBeenCalledWith({
-      columnState: [expect.objectContaining({ colId: 'id', width: newWidth })],
-      filterModel: {},
-    });
-    callback.mockClear();
-    expect(result.current.columnApi.getColumnState()[0].width).toEqual(
-      newWidth
-    );
-
-    // Set filter
-    await act(async () => {
-      result.current.columnApi.applyColumnState({
-        state: [{ colId: 'id', sort: 'asc' }],
-        applyOrder: true,
-      });
-    });
-
-    act(() => {
-      jest.advanceTimersByTime(GRID_EVENT_DEBOUNCE_TIME);
-    });
-
-    expect(callback).toHaveBeenCalledWith({
-      columnState: [expect.objectContaining({ colId: 'id', sort: 'asc' })],
-      filterModel: {},
-    });
-    callback.mockClear();
-    expect(result.current.columnApi.getColumnState()[0].sort).toEqual('asc');
-
     // Set filter
     const idFilter = {
       filter: 1,
@@ -123,7 +83,7 @@ describe('useDataGridEvents', () => {
     });
 
     expect(callback).toHaveBeenCalledWith({
-      columnState: expect.any(Object),
+      columnState: undefined,
       filterModel: {
         id: idFilter,
       },
@@ -138,7 +98,7 @@ describe('useDataGridEvents', () => {
       filterType: 'number',
       type: 'equals',
     };
-    const colState = { colId: 'id', width: 300, sort: 'desc' as const };
+    const colState = { colId: 'id', sort: 'desc' as const };
     const initialState = {
       filterModel: {
         id: idFilter,
@@ -156,7 +116,7 @@ describe('useDataGridEvents', () => {
     });
   });
 
-  it('debounces events', async () => {
+  it('ignores events that were not made via the UI', async () => {
     const callback = jest.fn();
     const initialState = {
       filterModel: undefined,
@@ -170,8 +130,6 @@ describe('useDataGridEvents', () => {
     // Set col width multiple times
     await act(async () => {
       result.current.columnApi.setColumnWidth('id', newWidth);
-      result.current.columnApi.setColumnWidth('id', newWidth);
-      result.current.columnApi.setColumnWidth('id', newWidth);
     });
 
     expect(callback).not.toHaveBeenCalled();
@@ -180,6 +138,6 @@ describe('useDataGridEvents', () => {
       jest.advanceTimersByTime(GRID_EVENT_DEBOUNCE_TIME);
     });
 
-    expect(callback).toHaveBeenCalledTimes(1);
+    expect(callback).toHaveBeenCalledTimes(0);
   });
 });

libs/datagrid/src/lib/use-datagrid-events.ts

@@ -1,12 +1,13 @@
-import debounce from 'lodash/debounce';
 import type {
+  ColumnMovedEvent,
   ColumnResizedEvent,
   ColumnState,
+  ColumnVisibleEvent,
   FilterChangedEvent,
-  GridReadyEvent,
+  FirstDataRenderedEvent,
   SortChangedEvent,
 } from 'ag-grid-community';
-import { useCallback, useMemo } from 'react';
+import { useCallback } from 'react';
 
 type State = {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -14,30 +15,70 @@ type State = {
   columnState?: ColumnState[];
 };
 
-type Event = ColumnResizedEvent | FilterChangedEvent | SortChangedEvent;
-
-export const GRID_EVENT_DEBOUNCE_TIME = 300;
-
 export const useDataGridEvents = (
   state: State,
   callback: (data: State) => void
 ) => {
-  // This function can be called very frequently by the onColumnResized
-  // grid callback, so its memoized to only update after resizing is finished
-  const onGridChange = useMemo(
-    () =>
-      debounce(({ api, columnApi }: Event) => {
-        if (!api || !columnApi) return;
-        const columnState = columnApi.getColumnState();
-        const filterModel = api.getFilterModel();
-        callback({ columnState, filterModel });
-      }, GRID_EVENT_DEBOUNCE_TIME),
+  /**
+   * Callback for filter events
+   */
+  const onFilterChanged = useCallback(
+    ({ api }: FilterChangedEvent) => {
+      if (!api) return;
+      const filterModel = api.getFilterModel();
+      callback({ filterModel });
+    },
     [callback]
   );
 
-  // check if we have stored column states or filter models and apply if we do
+  /**
+   * Callback for column resized and column moved events, which can be
+   * triggered in quick succession. Uses the finished flag to not call the
+   * store callback unnecessarily
+   */
+  const onDebouncedColumnChange = useCallback(
+    ({
+      columnApi,
+      source,
+      finished,
+    }: ColumnResizedEvent | ColumnMovedEvent) => {
+      if (!finished) return;
+
+      // only call back on user interactions, and not events triggered from the api
+      const permittedEvents = [
+        'uiColumnResized',
+        'uiColumnDragged',
+        'uiColumnMoved',
+      ];
+
+      if (!permittedEvents.includes(source)) {
+        return;
+      }
+
+      const columnState = columnApi.getColumnState();
+
+      callback({ columnState });
+    },
+    [callback]
+  );
+
+  /**
+   * Callback for sort and visible events
+   */
+  const onColumnChange = useCallback(
+    ({ columnApi }: SortChangedEvent | ColumnVisibleEvent) => {
+      const columnState = columnApi.getColumnState();
+      callback({ columnState });
+    },
+    [callback]
+  );
+
+  /**
+   * Callback for grid startup to apply stored column and filter states.
+   * State only applied if found, otherwise columns sized to fit available space
+   */
   const onGridReady = useCallback(
-    ({ api, columnApi }: GridReadyEvent) => {
+    ({ api, columnApi }: FirstDataRenderedEvent) => {
       if (!api || !columnApi) return;
 
       if (state.columnState) {
@@ -46,7 +87,6 @@ export const useDataGridEvents = (
           applyOrder: true,
         });
       } else {
-        // ensure columns fit available space if no widths are set
         api.sizeColumnsToFit();
       }
 
@@ -59,8 +99,12 @@ export const useDataGridEvents = (
 
   return {
     onGridReady,
-    onColumnResized: onGridChange,
-    onFilterChanged: onGridChange,
-    onSortChanged: onGridChange,
+    // these events don't use the 'finished' flag
+    onFilterChanged,
+    onSortChanged: onColumnChange,
+    onColumnVisible: onColumnChange,
+    // these trigger a lot so this callback uses the 'finished' flag
+    onColumnMoved: onDebouncedColumnChange,
+    onColumnResized: onDebouncedColumnChange,
   };
 };

libs/deal-ticket/src/components/deal-ticket/deal-ticket-container.tsx

@@ -9,7 +9,7 @@ import {
   useMarket,
   useMarketPrice,
 } from '@vegaprotocol/markets';
-import { AsyncRenderer, Splash } from '@vegaprotocol/ui-toolkit';
+import { AsyncRendererInline } from '@vegaprotocol/ui-toolkit';
 import { t } from '@vegaprotocol/i18n';
 import { DealTicket } from './deal-ticket';
 import { FLAGS } from '@vegaprotocol/environment';
@@ -42,7 +42,7 @@ export const DealTicketContainer = ({
   const { data: marketPrice } = useMarketPrice(market?.id);
   const create = useVegaTransactionStore((state) => state.create);
   return (
-    <AsyncRenderer
+    <AsyncRendererInline
       data={market && marketData}
       loading={marketLoading || marketDataLoading}
       error={marketError || marketDataError}
@@ -65,10 +65,8 @@ export const DealTicketContainer = ({
           />
         )
       ) : (
-        <Splash>
-          <p>{t('Could not load market')}</p>
-        </Splash>
+        <p>{t('Could not load market')}</p>
       )}
-    </AsyncRenderer>
+    </AsyncRendererInline>
   );
 };

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

@@ -70,17 +70,9 @@ export const DepositsTable = (
             </EtherscanLink>
           );
         },
-        flex: 1,
       },
     ],
     []
   );
-  return (
-    <AgGrid
-      defaultColDef={{ flex: 1 }}
-      columnDefs={columnDefs}
-      style={{ width: '100%', height: '100%' }}
-      {...props}
-    />
-  );
+  return <AgGrid columnDefs={columnDefs} {...props} />;
 };

libs/environment/src/hooks/use-environment.ts

@@ -371,6 +371,14 @@ function compileEnvVars() {
       'NX_TENDERMINT_WEBSOCKET_URL',
       process.env['NX_TENDERMINT_WEBSOCKET_URL']
     ),
+    CHROME_EXTENSION_URL: windowOrDefault(
+      'NX_CHROME_EXTENSION_URL',
+      process.env['NX_CHROME_EXTENSION_URL']
+    ),
+    MOZILLA_EXTENSION_URL: windowOrDefault(
+      'NX_MOZILLA_EXTENSION_URL',
+      process.env['NX_MOZILLA_EXTENSION_URL']
+    ),
   };
 
   return env;

libs/environment/src/hooks/use-links.ts

@@ -160,7 +160,9 @@ export const ExternalLinks = {
   MARGIN_CREDIT_RISK:
     'https://vega.xyz/papers/margins-and-credit-risk.pdf#page=7',
   VEGA_WALLET_URL: 'https://vega.xyz/wallet',
+  VEGA_WALLET_URL_ABOUT: 'https://vega.xyz/wallet/#overview',
   VEGA_WALLET_HOSTED_URL: 'https://vega-hosted-wallet.on.fleek.co/',
+  VEGA_WALLET_BROWSER_LIST: '',
   BLOG: 'https://blog.vega.xyz/',
 };
 

libs/environment/src/utils/validate-environment.ts

@@ -59,6 +59,8 @@ export const envSchema = z
     SENTRY_DSN: z.optional(z.string()),
     TENDERMINT_URL: z.optional(z.string()),
     TENDERMINT_WEBSOCKET_URL: z.optional(z.string()),
+    CHROME_EXTENSION_URL: z.optional(z.string()),
+    MOZILLA_EXTENSION_URL: z.optional(z.string()),
   })
   .refine(
     (data) => {

libs/fills/src/lib/fills-table.spec.tsx

@@ -20,7 +20,7 @@ describe('FillsTable', () => {
         positionDecimalPlaces: 5,
         tradableInstrument: {
           instrument: {
-            name: 'test market',
+            code: 'test market',
             product: {
               settlementAsset: {
                 decimals: 2,
@@ -71,7 +71,7 @@ describe('FillsTable', () => {
     render(<FillsTable partyId={partyId} rowData={[{ ...buyerFill }]} />);
     const cells = screen.getAllByRole('gridcell');
     const expectedValues = [
-      buyerFill.market?.tradableInstrument.instrument.name || '',
+      buyerFill.market?.tradableInstrument.instrument.code || '',
       '+3.00',
       '1.00 BTC',
       '3.00 BTC',
@@ -106,7 +106,7 @@ describe('FillsTable', () => {
 
     const cells = screen.getAllByRole('gridcell');
     const expectedValues = [
-      buyerFill.market?.tradableInstrument.instrument.name || '',
+      buyerFill.market?.tradableInstrument.instrument.code || '',
       '-3.00',
       '1.00 BTC',
       '3.00 BTC',
@@ -141,7 +141,7 @@ describe('FillsTable', () => {
 
     const cells = screen.getAllByRole('gridcell');
     const expectedValues = [
-      buyerFill.market?.tradableInstrument.instrument.name || '',
+      buyerFill.market?.tradableInstrument.instrument.code || '',
       '-3.00',
       '1.00 BTC',
       '3.00 BTC',

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

@@ -47,7 +47,7 @@ export const FillsTable = forwardRef<AgGridReact, Props>(
       () => [
         {
           headerName: t('Market'),
-          field: 'market.tradableInstrument.instrument.name',
+          field: 'market.tradableInstrument.instrument.code',
           cellRenderer: 'MarketNameCell',
           cellRendererParams: { idPath: 'market.id', onMarketClick },
         },
@@ -124,8 +124,6 @@ export const FillsTable = forwardRef<AgGridReact, Props>(
         ref={ref}
         columnDefs={columnDefs}
         overlayNoRowsTemplate={t('No fills')}
-        defaultColDef={{ resizable: true }}
-        style={{ width: '100%', height: '100%' }}
         getRowId={({ data }) => data?.id}
         tooltipShowDelay={0}
         tooltipHideDelay={2000}

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

@@ -42,6 +42,16 @@ const dateRangeFilterParams = {
   maxNextDays: 0,
   defaultValue,
 };
+const defaultColDef = {
+  resizable: true,
+  sortable: true,
+  tooltipComponent: TransferTooltipCellComponent,
+  filterParams: {
+    ...dateRangeFilterParams,
+    buttons: ['reset'],
+  },
+};
+
 type LedgerEntryProps = TypedDataAgGrid<LedgerEntry>;
 
 export const LedgerTable = (props: LedgerEntryProps) => {
@@ -177,24 +187,14 @@ export const LedgerTable = (props: LedgerEntryProps) => {
           value ? getDateTimeFormat().format(fromNanoSeconds(value)) : '-',
         filterParams: dateRangeFilterParams,
         filter: DateRangeFilter,
-        flex: 1,
       },
     ],
     []
   );
   return (
     <AgGrid
-      style={{ width: '100%', height: '100%' }}
       tooltipShowDelay={500}
-      defaultColDef={{
-        resizable: true,
-        sortable: true,
-        tooltipComponent: TransferTooltipCellComponent,
-        filterParams: {
-          ...dateRangeFilterParams,
-          buttons: ['reset'],
-        },
-      }}
+      defaultColDef={defaultColDef}
       columnDefs={columnDefs}
       {...props}
     />

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

@@ -31,6 +31,12 @@ const dateValueFormatter = ({ value }: { value?: string | null }) => {
   return getDateTimeFormat().format(new Date(value));
 };
 
+const defaultColDef = {
+  resizable: true,
+  sortable: true,
+  tooltipComponent: TooltipCellComponent,
+};
+
 export interface LiquidityTableProps
   extends TypedDataAgGrid<LiquidityProvisionData> {
   symbol?: string;
@@ -124,7 +130,6 @@ export const LiquidityTable = ({
         headerTooltip: t(
           'The valuation of the market at the time the liquidity commitment was made. Commitments made at a lower valuation earlier in the lifetime of the market would be expected to have a higher equity-like share if the market has grown. If a commitment is amended, value will reflect the average of the market valuations across the lifetime of the commitment.'
         ),
-        minWidth: 160,
         valueFormatter: assetDecimalsQuantumFormatter,
         tooltipValueGetter: assetDecimalsFormatter,
       },
@@ -183,16 +188,10 @@ export const LiquidityTable = ({
 
   return (
     <AgGrid
-      style={{ width: '100%', height: '100%' }}
       overlayNoRowsTemplate={t('No liquidity provisions')}
       getRowId={({ data }: { data: LiquidityProvisionData }) => data.id || ''}
       tooltipShowDelay={500}
-      defaultColDef={{
-        resizable: true,
-        minWidth: 100,
-        tooltipComponent: TooltipCellComponent,
-        sortable: true,
-      }}
+      defaultColDef={defaultColDef}
       {...props}
       columnDefs={colDefs}
     />

libs/markets/src/lib/components/market-info/info-key-value-table.tsx

@@ -4,8 +4,10 @@ import {
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import {
+  Intent,
   KeyValueTable,
   KeyValueTableRow,
+  Lozenge,
   Tooltip,
 } from '@vegaprotocol/ui-toolkit';
 import BigNumber from 'bignumber.js';
@@ -22,9 +24,11 @@ interface RowProps {
   unformatted?: boolean;
   assetSymbol?: string;
   noBorder?: boolean;
+  parentValue?: ReactNode;
+  hasParentData?: boolean;
 }
 
-const Row = ({
+export const Row = ({
   field,
   value,
   decimalPlaces,
@@ -32,7 +36,14 @@ const Row = ({
   unformatted,
   assetSymbol = '',
   noBorder = true,
+  parentValue,
+  hasParentData,
 }: RowProps) => {
+  // Note: we need both 'parentValue' and 'hasParentData' to do a conditional
+  // check to differentiate between when parentData itself is missing and when
+  // a specific parentValue is missing. These values are only used when we
+  // have successor market parent data.
+
   const className = 'text-sm';
 
   const getFormattedValue = (value: ReactNode) => {
@@ -55,6 +66,10 @@ const Row = ({
   const formattedValue = getFormattedValue(value);
 
   if (!formattedValue) return null;
+
+  const newValueInSuccessorMarket = hasParentData && value && !parentValue;
+  const valueDiffersFromParentMarket = parentValue && parentValue !== value;
+
   return (
     <KeyValueTableRow
       key={field}
@@ -63,10 +78,35 @@ const Row = ({
       dtClassName={className}
       ddClassName={className}
     >
-      <Tooltip description={tooltipMapping[field]} align="start">
-        <div tabIndex={-1}>{startCase(t(field))}</div>
-      </Tooltip>
-      <span style={{ wordBreak: 'break-word' }}>{formattedValue}</span>
+      <div className="flex items-center gap-3">
+        <Tooltip description={tooltipMapping[field]} align="start">
+          <div tabIndex={-1}>{startCase(t(field))}</div>
+        </Tooltip>
+
+        {valueDiffersFromParentMarket && (
+          <Lozenge className="py-0" variant={Intent.Primary}>
+            {t('Updated')}
+          </Lozenge>
+        )}
+
+        {newValueInSuccessorMarket && (
+          <Lozenge className="py-0" variant={Intent.Primary}>
+            {t('Added')}
+          </Lozenge>
+        )}
+      </div>
+      <div style={{ wordBreak: 'break-word' }}>
+        {valueDiffersFromParentMarket ? (
+          <div className="flex items-center gap-3">
+            <span className="line-through">
+              {getFormattedValue(parentValue)}
+            </span>
+            <span>{formattedValue}</span>
+          </div>
+        ) : (
+          formattedValue
+        )}
+      </div>
     </KeyValueTableRow>
   );
 };
@@ -79,6 +119,7 @@ export interface MarketInfoTableProps {
   children?: ReactNode;
   assetSymbol?: string;
   noBorder?: boolean;
+  parentData?: Record<string, ReactNode> | null | undefined;
 }
 
 export const MarketInfoTable = ({
@@ -89,25 +130,33 @@ export const MarketInfoTable = ({
   children,
   assetSymbol,
   noBorder,
+  parentData,
 }: MarketInfoTableProps) => {
   if (!data || typeof data !== 'object') {
     return null;
   }
+
+  const hasParentData = parentData !== undefined;
+
   return (
     <>
       <KeyValueTable>
-        {Object.entries(data).map(([key, value]) => (
-          <Row
-            key={key}
-            field={key}
-            value={value}
-            decimalPlaces={decimalPlaces}
-            assetSymbol={assetSymbol}
-            asPercentage={asPercentage}
-            unformatted={unformatted}
-            noBorder={noBorder}
-          />
-        ))}
+        <>
+          {Object.entries(data).map(([key, value]) => (
+            <Row
+              key={key}
+              field={key}
+              value={value}
+              decimalPlaces={decimalPlaces}
+              assetSymbol={assetSymbol}
+              asPercentage={asPercentage}
+              unformatted={unformatted}
+              noBorder={noBorder}
+              parentValue={parentData?.[key]}
+              hasParentData={hasParentData}
+            />
+          ))}
+        </>
       </KeyValueTable>
       <div className="flex flex-col gap-2">{children}</div>
     </>

libs/markets/src/lib/components/market-info/market-info-panels.tsx

@@ -1,3 +1,4 @@
+import isEqual from 'lodash/isEqual';
 import type { ReactNode } from 'react';
 import { Fragment, useState } from 'react';
 import { useMemo } from 'react';
@@ -47,11 +48,14 @@ import {
   useSuccessorMarketQuery,
 } from '../../__generated__';
 import { useSuccessorMarketProposalDetailsQuery } from '@vegaprotocol/proposals';
+import type { MarketTradingMode } from '@vegaprotocol/types';
+import type { Signer } from '@vegaprotocol/types';
 import classNames from 'classnames';
 import compact from 'lodash/compact';
 
 type MarketInfoProps = {
   market: MarketInfo;
+  parentMarket?: MarketInfo;
   children?: ReactNode;
 };
 
@@ -156,21 +160,43 @@ export const InsurancePoolInfoPanel = ({
   );
 };
 
-export const KeyDetailsInfoPanel = ({ market }: MarketInfoProps) => {
-  const { data: parentData } = useParentMarketIdQuery({
+export const KeyDetailsInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => {
+  const { data: parentMarketIdData } = useParentMarketIdQuery({
     variables: {
       marketId: market.id,
     },
     skip: !FLAGS.SUCCESSOR_MARKETS,
   });
 
-  const { data: successor } = useSuccessorMarketProposalDetailsQuery({
+  const { data: successorProposalDetails } =
+    useSuccessorMarketProposalDetailsQuery({
+      variables: {
+        proposalId: market.proposal?.id || '',
+      },
+      skip: !FLAGS.SUCCESSOR_MARKETS || !market.proposal?.id,
+    });
+
+  // The following queries are needed as the parent market could also have been a successor market.
+  // Note: the parent market is only passed to this component if the successor markets flag is enabled,
+  // so that check is not needed in the skip.
+  const { data: grandparentMarketIdData } = useParentMarketIdQuery({
     variables: {
-      proposalId: market.proposal?.id || '',
+      marketId: parentMarket?.id || '',
     },
-    skip: !FLAGS.SUCCESSOR_MARKETS || !market.proposal?.id,
+    skip: !parentMarket?.id,
   });
 
+  const { data: parentSuccessorProposalDetails } =
+    useSuccessorMarketProposalDetailsQuery({
+      variables: {
+        proposalId: parentMarket?.proposal?.id || '',
+      },
+      skip: !parentMarket?.proposal?.id,
+    });
+
   const assetDecimals =
     market.tradableInstrument.instrument.product.settlementAsset.decimals;
 
@@ -181,11 +207,12 @@ export const KeyDetailsInfoPanel = ({ market }: MarketInfoProps) => {
           ? {
               name: market.tradableInstrument.instrument.name,
               marketID: market.id,
-              parentMarketID: parentData?.market?.parentMarketID || '-',
+              parentMarketID: parentMarketIdData?.market?.parentMarketID || '-',
               insurancePoolFraction:
-                (successor?.proposal?.terms.change.__typename === 'NewMarket' &&
-                  successor.proposal.terms.change.successorConfiguration
-                    ?.insurancePoolFraction) ||
+                (successorProposalDetails?.proposal?.terms.change.__typename ===
+                  'NewMarket' &&
+                  successorProposalDetails.proposal.terms.change
+                    .successorConfiguration?.insurancePoolFraction) ||
                 '-',
               tradingMode:
                 market.tradingMode &&
@@ -205,6 +232,28 @@ export const KeyDetailsInfoPanel = ({ market }: MarketInfoProps) => {
               settlementAssetDecimalPlaces: assetDecimals,
             }
       }
+      parentData={
+        parentMarket && {
+          name: parentMarket?.tradableInstrument?.instrument?.name,
+          marketID: parentMarket?.id,
+          parentMarketID: grandparentMarketIdData?.market?.parentMarketID,
+          insurancePoolFraction:
+            parentSuccessorProposalDetails?.proposal?.terms.change
+              .__typename === 'NewMarket' &&
+            parentSuccessorProposalDetails.proposal.terms.change
+              .successorConfiguration?.insurancePoolFraction,
+          tradingMode:
+            parentMarket?.tradingMode &&
+            MarketTradingModeMapping[
+              parentMarket.tradingMode as MarketTradingMode
+            ],
+          marketDecimalPlaces: parentMarket?.decimalPlaces,
+          positionDecimalPlaces: parentMarket?.positionDecimalPlaces,
+          settlementAssetDecimalPlaces:
+            parentMarket?.tradableInstrument?.instrument?.product
+              ?.settlementAsset?.decimals,
+        }
+      }
     />
   );
 };
@@ -329,7 +378,10 @@ export const SuccessionLineInfoPanel = ({
   );
 };
 
-export const InstrumentInfoPanel = ({ market }: MarketInfoProps) => (
+export const InstrumentInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => (
   <MarketInfoTable
     data={{
       marketName: market.tradableInstrument.instrument.name,
@@ -337,6 +389,16 @@ export const InstrumentInfoPanel = ({ market }: MarketInfoProps) => (
       productType: market.tradableInstrument.instrument.product.__typename,
       quoteName: market.tradableInstrument.instrument.product.quoteName,
     }}
+    parentData={
+      parentMarket && {
+        marketName: parentMarket?.tradableInstrument?.instrument?.name,
+        code: parentMarket?.tradableInstrument?.instrument?.code,
+        productType:
+          parentMarket?.tradableInstrument?.instrument?.product?.__typename,
+        quoteName:
+          parentMarket?.tradableInstrument?.instrument?.product?.quoteName,
+      }
+    }
   />
 );
 
@@ -349,6 +411,7 @@ export const SettlementAssetInfoPanel = ({ market }: MarketInfoProps) => {
     () => market?.tradableInstrument.instrument.product?.settlementAsset.id,
     [market]
   );
+
   const { data: asset } = useAssetDataProvider(assetId ?? '');
   return asset ? (
     <>
@@ -371,54 +434,148 @@ export const SettlementAssetInfoPanel = ({ market }: MarketInfoProps) => {
   );
 };
 
-export const MetadataInfoPanel = ({ market }: MarketInfoProps) => (
+const getMarketMetadata = (market: MarketInfo) =>
+  market.tradableInstrument.instrument.metadata.tags
+    ?.map((tag) => {
+      const [key, value] = tag.split(':');
+      return { [key]: value };
+    })
+    .reduce((acc, curr) => ({ ...acc, ...curr }), {});
+
+export const MetadataInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => (
   <MarketInfoTable
     data={{
       expiryDate: getMarketExpiryDateFormatted(
         market.tradableInstrument.instrument.metadata.tags
       ),
-      ...market.tradableInstrument.instrument.metadata.tags
-        ?.map((tag) => {
-          const [key, value] = tag.split(':');
-          return { [key]: value };
-        })
-        .reduce((acc, curr) => ({ ...acc, ...curr }), {}),
+      ...(getMarketMetadata(market) || {}),
     }}
+    parentData={
+      parentMarket && {
+        expiryDate: getMarketExpiryDateFormatted(
+          parentMarket.tradableInstrument.instrument.metadata.tags
+        ),
+        ...(getMarketMetadata(parentMarket) || {}),
+      }
+    }
   />
 );
 
-export const RiskModelInfoPanel = ({ market }: MarketInfoProps) => {
+export const RiskModelInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => {
   if (market.tradableInstrument.riskModel.__typename !== 'LogNormalRiskModel') {
     return null;
   }
+
   const { tau, riskAversionParameter } = market.tradableInstrument.riskModel;
-  return <MarketInfoTable data={{ tau, riskAversionParameter }} unformatted />;
+
+  let parentData;
+
+  if (
+    parentMarket?.tradableInstrument?.riskModel?.__typename ===
+    'LogNormalRiskModel'
+  ) {
+    const {
+      tau: parentTau,
+      riskAversionParameter: parentRiskAversionParameter,
+    } = market.tradableInstrument.riskModel;
+
+    parentData = {
+      tau: parentTau,
+      riskAversionParameter: parentRiskAversionParameter,
+    };
+  }
+
+  return (
+    <MarketInfoTable
+      data={{ tau, riskAversionParameter }}
+      parentData={parentData}
+      unformatted
+    />
+  );
 };
 
-export const RiskParametersInfoPanel = ({ market }: MarketInfoProps) => {
-  if (market.tradableInstrument.riskModel.__typename === 'LogNormalRiskModel') {
+export const RiskParametersInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => {
+  const marketType = market.tradableInstrument.riskModel.__typename;
+
+  let data, parentData;
+
+  if (marketType === 'LogNormalRiskModel') {
     const { r, sigma, mu } = market.tradableInstrument.riskModel.params;
-    return <MarketInfoTable data={{ r, sigma, mu }} unformatted />;
-  }
-  if (market.tradableInstrument.riskModel.__typename === 'SimpleRiskModel') {
+    data = { r, sigma, mu };
+
+    if (
+      parentMarket?.tradableInstrument?.riskModel.__typename ===
+      'LogNormalRiskModel'
+    ) {
+      const parentParams = parentMarket.tradableInstrument.riskModel.params;
+      parentData = {
+        r: parentParams.r,
+        sigma: parentParams.sigma,
+        mu: parentParams.mu,
+      };
+    }
+  } else if (marketType === 'SimpleRiskModel') {
     const { factorLong, factorShort } =
       market.tradableInstrument.riskModel.params;
-    return <MarketInfoTable data={{ factorLong, factorShort }} unformatted />;
+    data = { factorLong, factorShort };
+
+    if (
+      parentMarket?.tradableInstrument?.riskModel.__typename ===
+      'SimpleRiskModel'
+    ) {
+      const parentParams = parentMarket.tradableInstrument.riskModel.params;
+      parentData = {
+        factorLong: parentParams.factorLong,
+        factorShort: parentParams.factorShort,
+      };
+    }
   }
-  return null;
+
+  if (!data) return null;
+
+  return <MarketInfoTable data={data} parentData={parentData} unformatted />;
 };
 
-export const RiskFactorsInfoPanel = ({ market }: MarketInfoProps) => {
+export const RiskFactorsInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => {
   if (!market.riskFactors) {
     return null;
   }
+
   const { short, long } = market.riskFactors;
-  return <MarketInfoTable data={{ short, long }} unformatted />;
+
+  let parentData;
+
+  if (parentMarket?.riskFactors) {
+    const parentShort = parentMarket.riskFactors.short;
+    const parentLong = parentMarket.riskFactors.long;
+    parentData = { short: parentShort, long: parentLong };
+  }
+
+  return (
+    <MarketInfoTable
+      data={{ short, long }}
+      parentData={parentData}
+      unformatted
+    />
+  );
 };
 
 export const PriceMonitoringBoundsInfoPanel = ({
   market,
   triggerIndex,
+  parentMarket,
 }: MarketInfoProps & {
   triggerIndex: number;
 }) => {
@@ -426,11 +583,35 @@ export const PriceMonitoringBoundsInfoPanel = ({
     dataProvider: marketDataProvider,
     variables: { marketId: market.id },
   });
+
+  const { data: parentData } = useDataProvider({
+    dataProvider: marketDataProvider,
+    variables: { marketId: parentMarket?.id || '' },
+    skip:
+      !parentMarket ||
+      !parentMarket?.priceMonitoringSettings?.parameters?.triggers?.[
+        triggerIndex
+      ],
+  });
+
   const quoteUnit =
     market?.tradableInstrument.instrument.product?.quoteName || '';
+  const parentQuoteUnit =
+    parentMarket?.tradableInstrument.instrument.product?.quoteName || '';
+  const isParentQuoteUnitEqual = quoteUnit === parentQuoteUnit;
+
   const trigger =
     market.priceMonitoringSettings?.parameters?.triggers?.[triggerIndex];
+  const parentTrigger =
+    parentMarket?.priceMonitoringSettings?.parameters?.triggers?.[triggerIndex];
+  const isParentTriggerEqual = isEqual(trigger, parentTrigger);
+
   const bounds = data?.priceMonitoringBounds?.[triggerIndex];
+  const parentBounds = parentData?.priceMonitoringBounds?.[triggerIndex];
+
+  const shouldShowParentData =
+    isParentQuoteUnitEqual && isParentTriggerEqual && !!parentBounds;
+
   if (!trigger) {
     console.error(
       `Could not find data for trigger ${triggerIndex} (market id: ${market.id})`
@@ -457,6 +638,14 @@ export const PriceMonitoringBoundsInfoPanel = ({
             highestPrice: bounds.maxValidPrice,
             lowestPrice: bounds.minValidPrice,
           }}
+          parentData={
+            shouldShowParentData
+              ? {
+                  highestPrice: parentBounds.maxValidPrice,
+                  lowestPrice: parentBounds.minValidPrice,
+                }
+              : undefined
+          }
           decimalPlaces={market.decimalPlaces}
           assetSymbol={quoteUnit}
         />
@@ -472,18 +661,31 @@ export const PriceMonitoringBoundsInfoPanel = ({
 
 export const LiquidityMonitoringParametersInfoPanel = ({
   market,
-}: MarketInfoProps) => (
-  <MarketInfoTable
-    data={{
-      triggeringRatio: market.liquidityMonitoringParameters.triggeringRatio,
-      timeWindow:
-        market.liquidityMonitoringParameters.targetStakeParameters.timeWindow,
-      scalingFactor:
-        market.liquidityMonitoringParameters.targetStakeParameters
-          .scalingFactor,
-    }}
-  />
-);
+  parentMarket,
+}: MarketInfoProps) => {
+  const marketData = {
+    triggeringRatio: market.liquidityMonitoringParameters.triggeringRatio,
+    timeWindow:
+      market.liquidityMonitoringParameters.targetStakeParameters.timeWindow,
+    scalingFactor:
+      market.liquidityMonitoringParameters.targetStakeParameters.scalingFactor,
+  };
+
+  const parentMarketData = parentMarket
+    ? {
+        triggeringRatio:
+          parentMarket.liquidityMonitoringParameters.triggeringRatio,
+        timeWindow:
+          parentMarket.liquidityMonitoringParameters.targetStakeParameters
+            .timeWindow,
+        scalingFactor:
+          parentMarket.liquidityMonitoringParameters.targetStakeParameters
+            .scalingFactor,
+      }
+    : {};
+
+  return <MarketInfoTable data={marketData} parentData={parentMarketData} />;
+};
 
 export const LiquidityInfoPanel = ({ market, children }: MarketInfoProps) => {
   const assetDecimals =
@@ -510,16 +712,61 @@ export const LiquidityInfoPanel = ({ market, children }: MarketInfoProps) => {
   );
 };
 
-export const LiquidityPriceRangeInfoPanel = ({ market }: MarketInfoProps) => {
+export const LiquidityPriceRangeInfoPanel = ({
+  market,
+  parentMarket,
+}: MarketInfoProps) => {
   const quoteUnit =
     market?.tradableInstrument.instrument.product?.quoteName || '';
+  const parentQuoteUnit =
+    parentMarket?.tradableInstrument.instrument.product?.quoteName || '';
+
   const liquidityPriceRange = formatNumberPercentage(
     new BigNumber(market.lpPriceRange).times(100)
   );
+  const parentLiquidityPriceRange = parentMarket
+    ? formatNumberPercentage(
+        new BigNumber(parentMarket.lpPriceRange).times(100)
+      )
+    : null;
+
   const { data } = useDataProvider({
     dataProvider: marketDataProvider,
     variables: { marketId: market.id },
   });
+
+  const { data: parentMarketData } = useDataProvider({
+    dataProvider: marketDataProvider,
+    variables: { marketId: parentMarket?.id || '' },
+    skip: !parentMarket,
+  });
+
+  let parentData;
+
+  if (parentMarket && parentMarketData && quoteUnit === parentQuoteUnit) {
+    parentData = {
+      liquidityPriceRange: `${parentLiquidityPriceRange} of mid price`,
+      lowestPrice:
+        parentMarketData?.midPrice &&
+        `${addDecimalsFormatNumber(
+          new BigNumber(1)
+            .minus(parentMarket.lpPriceRange)
+            .times(parentMarketData.midPrice)
+            .toString(),
+          parentMarket.decimalPlaces
+        )} ${quoteUnit}`,
+      highestPrice:
+        parentMarketData?.midPrice &&
+        `${addDecimalsFormatNumber(
+          new BigNumber(1)
+            .plus(parentMarket.lpPriceRange)
+            .times(parentMarketData.midPrice)
+            .toString(),
+          parentMarket.decimalPlaces
+        )} ${quoteUnit}`,
+    };
+  }
+
   return (
     <>
       <p className="text-sm mb-2">
@@ -552,6 +799,7 @@ export const LiquidityPriceRangeInfoPanel = ({ market }: MarketInfoProps) => {
               market.decimalPlaces
             )} ${quoteUnit}`,
         }}
+        parentData={parentData}
       />
     </>
   );
@@ -560,8 +808,12 @@ export const LiquidityPriceRangeInfoPanel = ({ market }: MarketInfoProps) => {
 export const OracleInfoPanel = ({
   market,
   type,
+  parentMarket,
 }: MarketInfoProps & { type: 'settlementData' | 'termination' }) => {
+  // If this is a successor market, this component will only receive parent market
+  // data if the termination or settlement data is different from the parent.
   const product = market.tradableInstrument.instrument.product;
+  const parentProduct = parentMarket?.tradableInstrument?.instrument?.product;
   const { VEGA_EXPLORER_URL, ORACLE_PROOFS_URL } = useEnvironment();
   const { data } = useOracleProofs(ORACLE_PROOFS_URL);
 
@@ -570,12 +822,33 @@ export const OracleInfoPanel = ({
       ? product.dataSourceSpecForSettlementData.id
       : product.dataSourceSpecForTradingTermination.id;
 
+  const parentDataSourceSpecId =
+    type === 'settlementData'
+      ? parentProduct?.dataSourceSpecForSettlementData?.id
+      : parentProduct?.dataSourceSpecForTradingTermination?.id;
+
   const dataSourceSpec = (
     type === 'settlementData'
       ? product.dataSourceSpecForSettlementData.data
       : product.dataSourceSpecForTradingTermination.data
   ) as DataSourceDefinition;
 
+  const parentDataSourceSpec =
+    type === 'settlementData'
+      ? parentProduct?.dataSourceSpecForSettlementData?.data
+      : (parentProduct?.dataSourceSpecForTradingTermination
+          ?.data as DataSourceDefinition);
+
+  const isParentDataSourceSpecEqual =
+    parentDataSourceSpec !== undefined &&
+    dataSourceSpec === parentDataSourceSpec;
+  const isParentDataSourceSpecIdEqual =
+    parentDataSourceSpecId !== undefined &&
+    dataSourceSpecId === parentDataSourceSpecId;
+
+  // We'll only provide successor parent data (if it differs) to the
+  // DataSourceProof component. Having an old external link struck through
+  // is unlikely to be useful.
   return (
     <div className="flex flex-col gap-2">
       <DataSourceProof
@@ -584,7 +857,14 @@ export const OracleInfoPanel = ({
         providers={data}
         type={type}
         dataSourceSpecId={dataSourceSpecId}
+        parentData={
+          isParentDataSourceSpecEqual ? undefined : parentDataSourceSpec
+        }
+        parentDataSourceSpecId={
+          isParentDataSourceSpecIdEqual ? undefined : parentDataSourceSpecId
+        }
       />
+
       <ExternalLink
         data-testid="oracle-spec-links"
         href={`${VEGA_EXPLORER_URL}/oracles/${
@@ -606,14 +886,28 @@ export const DataSourceProof = ({
   providers,
   type,
   dataSourceSpecId,
+  parentData,
+  parentDataSourceSpecId,
 }: {
   data: DataSourceDefinition;
   providers: Provider[] | undefined;
   type: 'settlementData' | 'termination';
   dataSourceSpecId: string;
+  parentData?: DataSourceDefinition;
+  parentDataSourceSpecId?: string;
 }) => {
+  // If this is a successor market, we'll only pass parent data to child
+  // components for comparison if the data differs from the parent market.
   if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
     const signers = data.sourceType.sourceType.signers || [];
+    let parentSigners: Signer[];
+
+    if (
+      parentData &&
+      parentData.sourceType.__typename === 'DataSourceDefinitionExternal'
+    ) {
+      parentSigners = parentData.sourceType.sourceType?.signers || [];
+    }
 
     if (!providers?.length) {
       return <NoOracleProof type={type} />;
@@ -622,7 +916,14 @@ export const DataSourceProof = ({
     return (
       <div className="flex flex-col gap-2">
         {signers.map(({ signer }, i) => {
-          return (
+          const parentSigner = parentSigners?.find(
+            ({ signer: ParentSigner }) =>
+              ParentSigner.__typename === signer.__typename
+          )?.signer;
+
+          const isParentSignerEqual = isEqual(signer, parentSigner);
+
+          return isParentSignerEqual ? (
             <OracleLink
               key={i}
               providers={providers}
@@ -630,6 +931,16 @@ export const DataSourceProof = ({
               type={type}
               dataSourceSpecId={dataSourceSpecId}
             />
+          ) : (
+            <OracleLink
+              key={i}
+              providers={providers}
+              signer={signer}
+              type={type}
+              dataSourceSpecId={dataSourceSpecId}
+              parentSigner={parentSigner}
+              parentDataSourceSpecId={parentDataSourceSpecId}
+            />
           );
         })}
       </div>
@@ -663,18 +974,8 @@ export const DataSourceProof = ({
   return <div>{t('Invalid data source')}</div>;
 };
 
-const OracleLink = ({
-  providers,
-  signer,
-  type,
-  dataSourceSpecId,
-}: {
-  providers: Provider[];
-  signer: SignerKind;
-  type: 'settlementData' | 'termination';
-  dataSourceSpecId: string;
-}) => {
-  const signerProviders = providers.filter((p) => {
+const getSignerProviders = (signer: SignerKind, providers: Provider[]) =>
+  providers.filter((p) => {
     if (signer.__typename === 'PubKey') {
       if (
         p.oracle.type === 'public_key' &&
@@ -696,19 +997,62 @@ const OracleLink = ({
     return false;
   });
 
+const OracleLink = ({
+  providers,
+  signer,
+  type,
+  dataSourceSpecId,
+  parentSigner,
+  parentDataSourceSpecId,
+}: {
+  providers: Provider[];
+  signer: SignerKind;
+  type: 'settlementData' | 'termination';
+  dataSourceSpecId: string;
+  parentSigner?: SignerKind;
+  parentDataSourceSpecId?: string;
+}) => {
+  // If this is a successor market, the parent market data will only have been passed
+  // in if it differs from the current data.
+  const signerProviders = getSignerProviders(signer, providers);
+  const parentSignerProviders = parentSigner
+    ? getSignerProviders(parentSigner, providers)
+    : [];
+
   if (!signerProviders.length) {
     return <NoOracleProof type={type} />;
   }
 
   return (
     <div className="mt-2">
-      {signerProviders.map((provider) => (
-        <OracleProfile
-          key={dataSourceSpecId}
-          provider={provider}
-          dataSourceSpecId={dataSourceSpecId}
-        />
-      ))}
+      {signerProviders.map((provider) => {
+        // Making the assumption here that if the provider name is the same,
+        // that it is the same provider that the parent market used.
+        const parentProvider = parentSignerProviders.find(
+          (p) => p.name === provider.name
+        );
+
+        const isParentProviderEqual =
+          parentProvider !== undefined && isEqual(provider, parentProvider);
+
+        // We only want to pass the parent data to the child component if the
+        // data differs from the parent market.
+        return isParentProviderEqual ? (
+          <OracleProfile
+            key={dataSourceSpecId}
+            provider={provider}
+            dataSourceSpecId={dataSourceSpecId}
+          />
+        ) : (
+          <OracleProfile
+            key={dataSourceSpecId}
+            provider={provider}
+            dataSourceSpecId={dataSourceSpecId}
+            parentProvider={parentProvider}
+            parentDataSourceSpecId={parentDataSourceSpecId}
+          />
+        );
+      })}
     </div>
   );
 };
@@ -731,13 +1075,18 @@ const NoOracleProof = ({
 const OracleProfile = (props: {
   provider: Provider;
   dataSourceSpecId: string;
+  parentProvider?: Provider;
+  parentDataSourceSpecId?: string;
 }) => {
+  // If this is a successor market, the parent market data will only have been passed
+  // in if it differs from the current data.
   const [open, onChange] = useState(false);
   return (
     <div key={props.provider.name}>
       <OracleBasicProfile
         provider={props.provider}
         onClick={() => onChange(!open)}
+        parentProvider={props.parentProvider}
       />
       <OracleDialog {...props} open={open} onChange={onChange} />
     </div>

libs/markets/src/lib/components/markets-container/market-list-table.tsx

@@ -35,11 +35,9 @@ const MarketName = (props: MarketNameCellProps) => (
 );
 
 const defaultColDef = {
-  resizable: true,
   sortable: true,
   filter: true,
   filterParams: { buttons: ['reset'] },
-  minWidth: 100,
 };
 type Props = TypedDataAgGrid<MarketMaybeWithData> & {
   onMarketClick: (marketId: string, metaKey?: boolean) => void;
@@ -58,7 +56,6 @@ export const MarketListTable = ({
   };
   return (
     <AgGrid
-      style={{ width: '100%', height: '100%' }}
       getRowId={getRowId}
       defaultColDef={defaultColDef}
       columnDefs={columnDefs}

libs/markets/src/lib/components/markets-container/use-column-defs.tsx

@@ -40,7 +40,6 @@ export const useColumnDefs = ({ onMarketClick }: Props) => {
         {
           headerName: t('Trading mode'),
           field: 'tradingMode',
-          minWidth: 170,
           valueFormatter: ({
             data,
           }: VegaValueFormatterParams<MarketMaybeWithData, 'data'>) => {

libs/markets/src/lib/components/oracle-basic-profile/oracle-basic-profile.tsx

@@ -5,6 +5,7 @@ import {
   ExternalLink,
   Icon,
   Intent,
+  Lozenge,
   VegaIcon,
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
@@ -59,10 +60,12 @@ export const OracleBasicProfile = ({
   provider,
   onClick,
   markets: oracleMarkets,
+  parentProvider,
 }: {
   provider: Provider;
   markets?: OracleMarketSpecFieldsFragment[] | undefined;
   onClick?: (value?: boolean) => void;
+  parentProvider?: Provider;
 }) => {
   const { icon, message, intent } = getVerifiedStatusIcon(provider);
 
@@ -78,8 +81,14 @@ export const OracleBasicProfile = ({
       icon: getLinkIcon(proof.type),
     }));
 
+  // If this is a successor market and there's a different parent provider,
+  // we'll just show that there's been a change, rather than add old data
+  // in alongside the new provider.
   return (
     <>
+      {parentProvider && (
+        <Lozenge variant={Intent.Primary}>{t('Updated')}</Lozenge>
+      )}
       <span className="flex gap-1">
         {provider.url && (
           <span className="flex align-items-bottom text-md gap-1">