fix: trades table layout

.github/workflows/cypress-manual-trigger.yml

@@ -11,7 +11,7 @@ on:
         type: choice
         options:
           - explorer-e2e
-          - governance-e2e
+          - token-e2e
           - trading-e2e
       tags:
         description: 'Test tags to run'

.github/workflows/cypress-nightly.yml

@@ -10,5 +10,5 @@ jobs:
     uses: ./.github/workflows/cypress-run.yml
     secrets: inherit
     with:
-      projects: '["explorer-e2e","governance-e2e","trading-e2e"]'
+      projects: '["explorer-e2e","token-e2e","trading-e2e"]'
       tags: '@smoke @regression @slow'

.github/workflows/cypress-pr.yml

@@ -42,10 +42,10 @@ jobs:
           affected=$(yarn nx print-affected --base=${{ env.NX_BASE }} --head=${{ env.NX_HEAD }} --select=projects)
           echo -n "Affected projects: $affected"
           projects=""
-          if [[ $affected == *"governance"* ]]; then projects+='"governance-e2e" '; fi
+          if [[ $affected == *"token"* ]]; then projects+='"token-e2e" '; fi
           if [[ $affected == *"trading"* ]]; then projects+='"trading-e2e" '; fi
           if [[ $affected == *"explorer"* ]]; then projects+='"explorer-e2e" '; fi
-          if [[ -z "$projects" ]]; then projects+='"governance-e2e" "trading-e2e" "explorer-e2e" '; fi
+          if [[ -z "$projects" ]]; then projects+='"token-e2e" "trading-e2e" "explorer-e2e" '; fi
           projects=${projects%?}
           projects=[${projects// /,}]
           echo PROJECTS=$projects >> $GITHUB_ENV

.github/workflows/publish-npm.yml

@@ -12,8 +12,6 @@ on:
           - react-helpers
           - tailwindcss-config
           - types
-          - utils
-          - i18n
 
 jobs:
   publish:

README.md

@@ -161,7 +161,7 @@ In order to setup and run vegawallet for e2e capsule tests, in a separate termin
 bash setup-vegawallet.sh
 ```
 
-3. copy generated `api-token` and paste the token into `CYPRESS_VEGA_WALLET_API_TOKEN` environment variable in either `apps/governance-e2e/.env` or `apps/explorer-e2e/.env` depending on which project needs testing.
+3. copy generated `api-token` and paste the token into `CYPRESS_VEGA_WALLET_API_TOKEN` environment variable in either `apps/token-e2e/.env` or `apps/explorer-e2e/.env` depending on which project needs testing.
 
 Note: The script is only needed if capsule was built for first time or fresh. To run existing wallet service for capsule:
 

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

@@ -8,7 +8,7 @@ context('Asset page', { tags: '@regression' }, () => {
 
     it('should be able to see full assets list', () => {
       cy.getAssets().then((assets) => {
-        assets.forEach((asset) => {
+        Object.values(assets).forEach((asset) => {
           cy.get(`[row-id="${asset.id}"]`).should('be.visible');
         });
       });
@@ -25,7 +25,7 @@ context('Asset page', { tags: '@regression' }, () => {
       });
 
       cy.getAssets().then((assets) => {
-        assets.forEach((asset) => {
+        Object.values(assets).forEach((asset) => {
           cy.get(`[row-id="${asset.id}"]`).should('be.visible');
         });
       });
@@ -33,7 +33,7 @@ context('Asset page', { tags: '@regression' }, () => {
 
     it('should open details page when clicked on "View details"', () => {
       cy.getAssets().then((assets) => {
-        assets.forEach((asset) => {
+        Object.values(assets).forEach((asset) => {
           cy.get(`[row-id="${asset.id}"] [col-id="actions"] button`)
             .eq(0)
             .should('contain.text', 'View details');

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

@@ -1,15 +1,303 @@
 context('Validator page', { tags: '@smoke' }, function () {
+  const validatorMenuHeading = 'a[href="/validators"]';
+  const tendermintDataHeader = '[data-testid="tendermint-header"]';
+  const vegaDataHeader = '[data-testid="vega-header"]';
+  const jsonSection = '.language-json';
+
   before('Visit validators page and obtain data', function () {
-    cy.visit('/validators');
+    cy.visit('/');
+    cy.get(validatorMenuHeading).click();
+    cy.get_validators().as('validators');
+    cy.get_nodes().as('nodes');
   });
 
   describe('Verify elements on page', function () {
-    it('should be able to see validator tiles', function () {
-      cy.getNodes().then((nodes) => {
-        nodes.forEach((node) => {
-          cy.get(`[validator-id="${node.id}"]`).should('be.visible');
+    before('Ensure at least two validators are present', function () {
+      assert.isAtLeast(
+        this.validators.length,
+        2,
+        'Ensuring at least two validators exist'
+      );
+    });
+
+    it('should be able to see validator page sections', function () {
+      cy.get(vegaDataHeader)
+        .contains('Vega data')
+        .and('is.visible')
+        .next()
+        .within(() => {
+          cy.get(jsonSection).should('not.be.empty');
+        });
+
+      cy.get(tendermintDataHeader)
+        .contains('Tendermint data')
+        .and('is.visible')
+        .next()
+        .within(() => {
+          cy.get(jsonSection).should('not.be.empty');
+        });
+    });
+
+    it('should be able to see relevant validator information in tendermint section', function () {
+      cy.get(tendermintDataHeader)
+        .contains('Tendermint data')
+        .next()
+        .within(() => {
+          cy.get(jsonSection)
+            .invoke('text')
+            .convert_string_json_to_js_object()
+            .then((validatorsInJson) => {
+              this.validators.forEach((validator, index) => {
+                const validatorInJson =
+                  validatorsInJson.result.validators[index];
+
+                assert.equal(
+                  validatorInJson.address,
+                  validator.address,
+                  `Checking that validator address shown in json matches system data`
+                );
+                cy.contains(validator.address).should('be.visible');
+
+                assert.equal(
+                  validatorInJson.pub_key.type,
+                  validator.pub_key.type,
+                  `Checking that validator public key type shown in json matches system data`
+                );
+                cy.contains(validator.pub_key.type).should('be.visible');
+
+                assert.equal(
+                  validatorInJson.pub_key.value,
+                  validator.pub_key.value,
+                  `Checking that validator public key value shown in json matches system data`
+                );
+                cy.contains(validator.pub_key.value).should('be.visible');
+
+                assert.equal(
+                  validatorInJson.voting_power,
+                  validator.voting_power,
+                  `Checking that validator voting power in json matches system data`
+                );
+                cy.contains(validator.voting_power).should('be.visible');
+
+                // Proposer priority can change frequently mid test
+                // Therefore only checking the field name is present.
+                cy.contains('proposer_priority').should('be.visible');
+              });
+            });
+        });
+    });
+
+    // Test disabled 2022/11/15 during the 0.62.1 upgrade. The JSON structure changed, and
+    // this test failed. Rather than fix it, it will be replaced when the validator view displays
+    // something useful rather than just dumping out the JSON.
+    xit('should be able to see relevant node information in vega data section', function () {
+      cy.get(vegaDataHeader)
+        .contains('Vega data')
+        .next()
+        .within(() => {
+          cy.get(jsonSection)
+            .invoke('text')
+            .convert_string_json_to_js_object()
+            .then((nodesInJson) => {
+              this.nodes.forEach((node, index) => {
+                const nodeInJson = nodesInJson.edges[index].node;
+
+                // Vegacapsule shows no info or null for following fields:
+                // name, infoURL, avatarUrl, location, epoch data
+                // Therefore, these values remain unchecked.
+
+                assert.equal(
+                  nodeInJson.__typename,
+                  node.__typename,
+                  `Checking that node __typename shown in json matches system data`
+                );
+                cy.contains(node.__typename).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.id,
+                  node.id,
+                  `Checking that node id shown in json matches system data`
+                );
+                cy.contains(node.id).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.pubkey,
+                  node.pubkey,
+                  `Checking that node pubkey shown in json matches system data`
+                );
+                cy.contains(node.pubkey).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.tmPubkey,
+                  node.tmPubkey,
+                  `Checking that node tmPubkey shown in json matches system data`
+                );
+                cy.contains(node.tmPubkey).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.ethereumAddress,
+                  node.ethereumAddress,
+                  `Checking that node ethereumAddress shown in json matches system data`
+                );
+                cy.contains(node.ethereumAddress).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.stakedByOperator,
+                  node.stakedByOperator,
+                  `Checking that node stakedByOperator value shown in json matches system data`
+                );
+                cy.contains(node.stakedByOperator).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.stakedByDelegates,
+                  node.stakedByDelegates,
+                  `Checking that node stakedByDelegates value shown in json matches system data`
+                );
+                cy.contains(node.stakedByDelegates).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.stakedTotal,
+                  node.stakedTotal,
+                  `Checking that node stakedTotal shown in json matches system data`
+                );
+                cy.contains(node.stakedTotal).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.pendingStake,
+                  node.pendingStake,
+                  `Checking that node pendingStake shown in json matches system data`
+                );
+                cy.contains(node.pendingStake).should('be.visible');
+
+                assert.equal(
+                  nodeInJson.status,
+                  node.status,
+                  `Checking that node status shown in json matches system data`
+                );
+                cy.contains(node.status).should('be.visible');
+              });
+            });
+        });
+    });
+
+    it('should be able to see validator page displayed on mobile', function () {
+      cy.common_switch_to_mobile_and_click_toggle();
+      cy.get(validatorMenuHeading).click();
+      cy.get(vegaDataHeader)
+        .contains('Vega data')
+        .and('is.visible')
+        .next()
+        .within(() => {
+          cy.get(jsonSection).should('not.be.empty');
+        });
+
+      cy.get(tendermintDataHeader)
+        .contains('Tendermint data')
+        .and('is.visible')
+        .next()
+        .within(() => {
+          cy.get(jsonSection).should('not.be.empty');
+        });
+
+      cy.get(tendermintDataHeader)
+        .contains('Tendermint data')
+        .next()
+        .within(() => {
+          this.validators.forEach((validator) => {
+            cy.contains(validator.address).should('be.visible');
+            cy.contains(validator.pub_key.type).should('be.visible');
+            cy.contains(validator.pub_key.value).should('be.visible');
+            cy.contains(validator.voting_power).should('be.visible');
+            // Proposer priority can change frequently mid test
+            // Therefore only checking the field name is present.
+            cy.contains('proposer_priority').should('be.visible');
+          });
+        });
+    });
+
+    it('should be able to switch validator page between light and dark mode', function () {
+      const whiteThemeSelectedMenuOptionColor = 'rgb(255, 7, 127)';
+      const whiteThemeJsonFieldBackColor = 'rgb(255, 255, 255)';
+      const whiteThemeSideMenuBackgroundColor = 'rgb(255, 255, 255)';
+      const darkThemeSelectedMenuOptionColor = 'rgb(215, 251, 80)';
+      const darkThemeJsonFieldBackColor = 'rgb(38, 38, 38)';
+      const darkThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)';
+      const themeSwitcher = '[data-testid="theme-switcher"]';
+      const jsonFields = '.hljs';
+      const sideMenuBackground = '.absolute';
+
+      // Engage dark mode if not allready set
+      cy.get(sideMenuBackground)
+        .should('have.css', 'background-color')
+        .then((background_color) => {
+          if (background_color.includes(whiteThemeSideMenuBackgroundColor))
+            cy.get(themeSwitcher).click();
+        });
+
+      // Engage white mode
+      cy.get(themeSwitcher).click();
+
+      // White Mode
+      cy.get(validatorMenuHeading)
+        .should('have.css', 'background-color')
+        .and('include', whiteThemeSelectedMenuOptionColor);
+      cy.get(jsonFields)
+        .should('have.css', 'background-color')
+        .and('include', whiteThemeJsonFieldBackColor);
+      cy.get(sideMenuBackground)
+        .should('have.css', 'background-color')
+        .and('include', whiteThemeSideMenuBackgroundColor);
+
+      // Dark Mode
+      cy.get(themeSwitcher).click();
+      cy.get(validatorMenuHeading)
+        .should('have.css', 'background-color')
+        .and('include', darkThemeSelectedMenuOptionColor);
+      cy.get(jsonFields)
+        .should('have.css', 'background-color')
+        .and('include', darkThemeJsonFieldBackColor);
+      cy.get(sideMenuBackground)
+        .should('have.css', 'background-color')
+        .and('include', darkThemeSideMenuBackgroundColor);
+    });
+
+    Cypress.Commands.add('get_validators', () => {
+      cy.request({
+        method: 'GET',
+        url: `http://localhost:26617/validators`,
+        headers: { 'content-type': 'application/json' },
+      })
+        .its(`body.result.validators`)
+        .then(function (response) {
+          let validators = [];
+          response.forEach((account, index) => {
+            validators[index] = account;
+          });
+          return validators;
+        });
+    });
+
+    Cypress.Commands.add('get_nodes', () => {
+      const mutation =
+        '{nodesConnection { edges { node { id name infoUrl avatarUrl pubkey tmPubkey ethereumAddress \
+          location stakedByOperator stakedByDelegates stakedTotal pendingStake \
+          epochData { total offline online __typename } status name __typename}}}}';
+      cy.request({
+        method: 'POST',
+        url: `http://localhost:3028/query`,
+        body: {
+          query: mutation,
+        },
+        headers: { 'content-type': 'application/json' },
+      })
+        .its(`body.data.nodesConnection.edges`)
+        .then(function (response) {
+          let nodes = [];
+          response.forEach((node) => {
+            nodes.push(node);
+          });
+          return nodes;
         });
-      });
     });
   });
 });

apps/explorer/.env.devnet

@@ -1,6 +1,6 @@
 # App configuration variables
 NX_TENDERMINT_URL=https://tm.be.devnet1.vega.xyz/tm
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.devnet1.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://tm.be.devnet1.vega.xyz/websocket
 NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/devnet-network.json
 NX_VEGA_NETWORKS={\"MAINNET"\:\"https://explorer.vega.xyz"\,\"TESTNET\":\"https://explorer.fairground.wtf\"}
 NX_VEGA_ENV=DEVNET

apps/explorer/.env.mainnet

@@ -1,10 +1,10 @@
 # App configuration variables
 NX_TENDERMINT_URL=https://be.explorer.vega.xyz
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.explorer.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://be.explorer.vega.xyz
 NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/mainnet-network.json
 NX_VEGA_NETWORKS={\"MAINNET"\:\"https://explorer.vega.xyz"\,\"TESTNET\":\"https://explorer.fairground.wtf\"}
 NX_VEGA_ENV=MAINNET
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_BLOCK_EXPLORER=https://be.explorer.vega.xyz/rest/
 NX_ETHERSCAN_URL=https://etherscan.io
-NX_VEGA_GOVERNANCE_URL=https://token.vega.xyz
+NX_VEGA_GOVERNANCE_URL=https://token.vega.xyz

apps/explorer/.env.mirror

@@ -1,6 +1,6 @@
 # App configuration variables
 NX_TENDERMINT_URL=https://tm.be.mainnet-mirror.vega.xyz
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.mainnet-mirror.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=https://tm.be.mainnet-mirror.vega.xyz
 NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/mirror-network.json
 NX_VEGA_NETWORKS='{"DEVNET":"https://dev.token.vega.xyz","STAGNET3":"https://stagnet3.token.vega.xyz","TESTNET":"https://token.fairground.wtf","MAINNET":"https://token.vega.xyz"}'
 NX_VEGA_ENV=MIRROR

apps/explorer/.env.sandbox

@@ -7,6 +7,6 @@ NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_VEGA_NETWORKS={\"MAINNET"\:\"https://explorer.vega.xyz"\,\"TESTNET\":\"https://explorer.fairground.wtf\"}
 NX_TENDERMINT_URL=https://tm.sandbox.vega.xyz
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.sandbox.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://tm.sandbox.vega.xyz/websocket
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_VEGA_GOVERNANCE_URL=https://sandbox.token.vega.xyz

apps/explorer/.env.stagnet3

@@ -1,5 +1,5 @@
 NX_TENDERMINT_URL=https://tm.n00.stagnet3.vega.xyz
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.stagnet3.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n00.stagnet3.vega.xyz/websocket
 NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/stagnet3-network.json
 NX_VEGA_NETWORKS={\"MAINNET"\:\"https://explorer.vega.xyz"\,\"TESTNET\":\"https://explorer.fairground.wtf\"}
 NX_VEGA_ENV=STAGNET3

apps/explorer/.env.testnet

@@ -1,7 +1,7 @@
 # App configuration variables
 NX_TENDERMINT_URL=https://tm.be.testnet.vega.xyz
 NX_BLOCK_EXPLORER=https://be.testnet.vega.xyz/rest
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket
+NX_TENDERMINT_WEBSOCKET_URL=wss://tm.be.testnet.vega.xyz/websocket/
 NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/testnet-network.json
 NX_VEGA_NETWORKS={\"MAINNET"\:\"https://explorer.vega.xyz"\,\"TESTNET\":\"https://explorer.fairground.wtf\"}
 NX_VEGA_ENV=TESTNET

apps/explorer/.env.validator-testnet

@@ -1,14 +0,0 @@
-# App configuration variables
-NX_VEGA_ENV=VALIDATOR_TESTNET
-NX_VEGA_CONFIG_URL=https://static.vega.xyz/assets/validator-testnet-network.json
-NX_VEGA_URL=https://api.validators-testnet.vega.xyz/graphql
-NX_VEGA_REST=https://api.validators-testnet.vega.xyz/
-NX_VEGA_NETWORKS='{"DEVNET":"https://dev.token.vega.xyz","STAGNET3":"https://stagnet3.token.vega.xyz","TESTNET":"https://token.fairground.wtf","MAINNET":"https://token.vega.xyz"}'
-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_VEGA_GOVERNANCE_URL=https://validator-testnet.governance.vega.xyz
-NX_TENDERMINT_URL=https://tm.be.validators-testnet.vega.xyz
-NX_BLOCK_EXPLORER=https://be.validators-testnet.vega.xyz/rest
-NX_TENDERMINT_WEBSOCKET_URL=wss://be.validators-testnet.vega.xyz/websocket

apps/explorer/src/__mocks__/react-markdown.js

@@ -1,5 +0,0 @@
-function ReactMarkdown({ children }) {
-  return <div>{children}</div>;
-}
-
-export default ReactMarkdown;

apps/explorer/src/app/app.tsx

@@ -40,9 +40,9 @@ function App() {
       <NetworkLoader cache={DEFAULT_CACHE_CONFIG}>
         <AnnouncementBanner>
           <div className="font-alpha calt uppercase text-center text-lg text-white">
-            <span className="pr-4">Mainnet sim 2 is live!</span>
+            <span className="pr-4">Mainnet sim 2 coming in March!</span>
             <ExternalLink href="https://fairground.wtf/">
-              Come help stress test the network
+              Learn more
             </ExternalLink>
           </div>
         </AnnouncementBanner>

apps/explorer/src/app/components/asset-balance/asset-balance.tsx

@@ -1,5 +1,5 @@
 import { useAssetDataProvider } from '@vegaprotocol/assets';
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/react-helpers';
 import { AssetLink } from '../links';
 
 export type AssetBalanceProps = {

apps/explorer/src/app/components/asset-balance/governance-asset-balance.tsx

@@ -1,4 +1,4 @@
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/react-helpers';
 import { useExplorerGovernanceAssetQuery } from './__generated__/Governance-asset';
 import AssetBalance from './asset-balance';
 

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

@@ -1,11 +1,11 @@
 import type { AssetFieldsFragment } from '@vegaprotocol/assets';
 import { AssetTypeMapping, AssetStatusMapping } from '@vegaprotocol/assets';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
+import type { VegaICellRendererParams } from '@vegaprotocol/ui-toolkit';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 import type { AgGridReact } from 'ag-grid-react';
 import { AgGridColumn } from 'ag-grid-react';
-import { AgGridDynamic as AgGrid } from '@vegaprotocol/datagrid';
-import type { VegaICellRendererParams } from '@vegaprotocol/datagrid';
+import { AgGridDynamic as AgGrid } from '@vegaprotocol/ui-toolkit';
 import { useRef, useLayoutEffect } from 'react';
 import { BREAKPOINT_MD } from '../../config/breakpoints';
 import { useNavigate } from 'react-router-dom';

apps/explorer/src/app/components/blocks/block-data.tsx

@@ -2,11 +2,11 @@ import React from 'react';
 import type { BlockMeta } from '../../routes/blocks/tendermint-blockchain-response';
 import { Routes } from '../../routes/route-names';
 import { Link } from 'react-router-dom';
-import { getDateTimeFormat } from '@vegaprotocol/utils';
+import { getDateTimeFormat } from '@vegaprotocol/react-helpers';
 import { Tooltip } from '@vegaprotocol/ui-toolkit';
 import { TimeAgo } from '../time-ago';
 import { TableWithTbody, TableRow, TableCell } from '../table';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 interface BlockProps {
   block: BlockMeta;

apps/explorer/src/app/components/blocks/blocks-data.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import React from 'react';
 import type { TendermintBlockchainResponse } from '../../routes/blocks/tendermint-blockchain-response';
 import { BlockData } from './block-data';

apps/explorer/src/app/components/blocks/blocks-infinite-list.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FixedSizeList as List } from 'react-window';
 import InfiniteLoader from 'react-window-infinite-loader';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import type { BlockMeta } from '../../routes/blocks/tendermint-blockchain-response';
 import { BlockData } from './block-data';
 import EmptyList from '../empty-list/empty-list';

apps/explorer/src/app/components/blocks/blocks-refetch.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect } from 'react';
 import { useTendermintWebsocket } from '../../hooks/use-tendermint-websocket';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 
 interface BlocksRefetchProps {

apps/explorer/src/app/components/dialogs/json-viewer-dialog.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import {
   Button,
   Dialog,

apps/explorer/src/app/components/empty-list/empty-list.tsx

@@ -19,12 +19,12 @@ const EmptyList = ({ heading, label }: EmptyListProps) => {
 
       <div className="mt-4">
         {heading ? (
-          <h1 className="font-alpha calt text-xl uppercase text-center leading-relaxed">
+          <h1 className="font-alpha text-xl uppercase text-center leading-relaxed">
             {heading}
           </h1>
         ) : null}
         {label ? (
-          <p className="font-alpha calt text-gray-500 text-center">{label}</p>
+          <p className="font-alpha text-gray-500 text-center">{label}</p>
         ) : null}
       </div>
     </div>

apps/explorer/src/app/components/epoch-overview/Epoch.graphql

@@ -22,3 +22,29 @@ query ExplorerFutureEpoch {
     }
   }
 }
+
+# query ExplorerEpoch($id: ID!) {
+#
+##### This could be useful for calculating roughly when a future epoch will
+##### occur, but epoch not exist results in a total error
+#  networkParameter(key: "validators.epoch.length") {
+#    value
+# }
+#
+##### This could be useful for relating where we are in time, but as above
+##### the total failure caused by epoch(id) not existing
+##### means this is useful
+#  currentEpoch: epoch {
+#    id
+#  }
+#
+#  epoch(id: $id) {
+#    id
+#    timestamps {
+#      start
+#      end
+#      firstBlock
+#      lastBlock
+#    }
+#  }
+#}

apps/explorer/src/app/components/epoch-overview/epoch-missing.spec.tsx

@@ -1,7 +1,7 @@
 import { MockedProvider } from '@apollo/client/testing';
 import { render } from '@testing-library/react';
 import EpochMissingOverview, { calculateEpochData } from './epoch-missing';
-import { getSecondsFromInterval } from '@vegaprotocol/utils';
+import { getSecondsFromInterval } from '@vegaprotocol/react-helpers';
 const START_DATE_PAST = 'Monday, 17 February 2022 11:44:09';
 
 describe('getSecondsFromInterval', () => {

apps/explorer/src/app/components/epoch-overview/epoch-missing.tsx

@@ -4,7 +4,8 @@ import addSeconds from 'date-fns/addSeconds';
 import formatDistance from 'date-fns/formatDistance';
 import { Icon, Tooltip } from '@vegaprotocol/ui-toolkit';
 import isFuture from 'date-fns/isFuture';
-import { getSecondsFromInterval, isValidDate } from '@vegaprotocol/utils';
+import { isValidDate } from '@vegaprotocol/react-helpers';
+import { getSecondsFromInterval } from '@vegaprotocol/react-helpers';
 
 export type EpochMissingOverviewProps = {
   missingEpochId?: string;

apps/explorer/src/app/components/epoch-overview/epoch.tsx

@@ -1,6 +1,6 @@
 import { useExplorerEpochQuery } from './__generated__/Epoch';
 
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { BlockLink } from '../links';
 import { Time } from '../time';
 import { TimeAgo } from '../time-ago';

apps/explorer/src/app/components/footer/footer.tsx

@@ -1,6 +1,5 @@
 import { NodeSwitcherDialog, useEnvironment } from '@vegaprotocol/environment';
-import { t } from '@vegaprotocol/i18n';
-import { useScreenDimensions } from '@vegaprotocol/react-helpers';
+import { t, useScreenDimensions } from '@vegaprotocol/react-helpers';
 import { ExternalLink, Link } from '@vegaprotocol/ui-toolkit';
 import { useMemo, useState } from 'react';
 import { ENV } from '../../config/env';

apps/explorer/src/app/components/header/header.tsx

@@ -1,7 +1,7 @@
 import classnames from 'classnames';
 import { Link } from 'react-router-dom';
 import { ThemeSwitcher, Icon } from '@vegaprotocol/ui-toolkit';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { Search } from '../search';
 import { Routes } from '../../routes/route-names';
 import { NetworkSwitcher } from '@vegaprotocol/environment';

apps/explorer/src/app/components/jump-to-block/index.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import React from 'react';
 import { useNavigate } from 'react-router-dom';
 import { Routes } from '../../routes/route-names';

apps/explorer/src/app/components/jump-to/index.tsx

@@ -1,6 +1,6 @@
 import type { HTMLInputTypeAttribute, SyntheticEvent } from 'react';
 import { Input, Button } from '@vegaprotocol/ui-toolkit';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 interface JumpToProps {
   label: string;

apps/explorer/src/app/components/links/market-link/market-link.tsx

@@ -3,7 +3,7 @@ import { useExplorerMarketQuery } from './__generated__/Market';
 import { Link } from 'react-router-dom';
 
 import type { ComponentProps } from 'react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import Hash from '../hash';
 
 export type MarketLinkProps = Partial<ComponentProps<typeof Link>> & {

apps/explorer/src/app/components/links/party-link/party-link.tsx

@@ -3,7 +3,7 @@ import { Link } from 'react-router-dom';
 
 import type { ComponentProps } from 'react';
 import Hash from '../hash';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { isValidPartyId } from '../../../routes/parties/id/components/party-id-error';
 import { truncateMiddle } from '@vegaprotocol/ui-toolkit';
 

apps/explorer/src/app/components/links/proposal-link/proposal-link.tsx

@@ -4,14 +4,13 @@ import { ENV } from '../../../config/env';
 import Hash from '../hash';
 export type ProposalLinkProps = {
   id: string;
-  text?: string;
 };
 
 /**
  * Given a proposal ID, generates an external link over to
  * the Governance page for more information
  */
-const ProposalLink = ({ id, text }: ProposalLinkProps) => {
+const ProposalLink = ({ id }: ProposalLinkProps) => {
   const { data } = useExplorerProposalQuery({
     variables: { id },
   });
@@ -21,7 +20,7 @@ const ProposalLink = ({ id, text }: ProposalLinkProps) => {
 
   return (
     <ExternalLink href={`${base}/proposals/${id}`}>
-      {text ? text : <Hash text={label} />}
+      <Hash text={label} />
     </ExternalLink>
   );
 };

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

@@ -2,8 +2,8 @@ import {
   addDecimalsFormatNumber,
   formatNumberPercentage,
   getMarketExpiryDateFormatted,
-} from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
+  t,
+} from '@vegaprotocol/react-helpers';
 import type { MarketInfoNoCandlesQuery } from '@vegaprotocol/market-info';
 import { MarketInfoTable } from '@vegaprotocol/market-info';
 import pick from 'lodash/pick';
@@ -184,8 +184,9 @@ export const MarketDetails = ({
       content: (
         <>
           <p className="text-xs mb-4">
-            {`For liquidity orders to count towards a commitment, they must be
-            within the liquidity monitoring bounds.`}
+            {`For liquidity orders count towards a commitment they have to be
+        within either the liquidity or price monitoring bounds (whichever is
+        tighter).`}
           </p>
           <p className="text-xs mb-4">
             {`The liquidity price range is a ${liquidityPriceRange} difference from the mid
@@ -248,7 +249,7 @@ export const MarketDetails = ({
     <>
       {panels.map((p) => (
         <div className="mb-3">
-          <h2 className="font-alpha calt text-xl">{p.title}</h2>
+          <h2 className="font-alpha text-xl">{p.title}</h2>
           {p.content}
         </div>
       ))}

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

@@ -1,13 +1,13 @@
 import type { MarketFieldsFragment } from '@vegaprotocol/market-list';
-import { t } from '@vegaprotocol/i18n';
-import { ButtonLink } from '@vegaprotocol/ui-toolkit';
-import type { AgGridReact } from 'ag-grid-react';
-import { AgGridColumn } from 'ag-grid-react';
-import { AgGridDynamic as AgGrid } from '@vegaprotocol/datagrid';
+import { t } from '@vegaprotocol/react-helpers';
 import type {
   VegaICellRendererParams,
   VegaValueGetterParams,
-} from '@vegaprotocol/datagrid';
+} from '@vegaprotocol/ui-toolkit';
+import { ButtonLink } from '@vegaprotocol/ui-toolkit';
+import type { AgGridReact } from 'ag-grid-react';
+import { AgGridColumn } from 'ag-grid-react';
+import { AgGridDynamic as AgGrid } from '@vegaprotocol/ui-toolkit';
 import { useRef, useLayoutEffect } from 'react';
 import { BREAKPOINT_MD } from '../../config/breakpoints';
 import { MarketStateMapping } from '@vegaprotocol/types';

apps/explorer/src/app/components/nested-data-list/nested-data-list.tsx

@@ -83,7 +83,7 @@ const NestedDataListItem = ({
   });
 
   const titleClasses = classNames({
-    'text-xl pl-4 border-l-4 font-alpha calt': hasChildren,
+    'text-xl pl-4 border-l-4 font-alpha': hasChildren,
     'text-base font-medium whitespace-nowrap': !hasChildren,
   });
 

apps/explorer/src/app/components/order-details/amend-order-details.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { useExplorerDeterministicOrderQuery } from './__generated__/Order';
 import { MarketLink } from '../links';
 import PriceInMarket from '../price-in-market/price-in-market';

apps/explorer/src/app/components/order-details/deterministic-order-details.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { useExplorerDeterministicOrderQuery } from './__generated__/Order';
 import { MarketLink } from '../links';
 import PriceInMarket from '../price-in-market/price-in-market';
@@ -101,7 +101,7 @@ const DeterministicOrderDetails = ({
                   {t('Remaining')}
                 </h2>
                 <h5 className="text-lg font-medium text-gray-500 mb-0">
-                  <SizeInMarket size={o.remaining} marketId={o.market.id} />
+                  {o.remaining}
                 </h5>
               </div>
             )}

apps/explorer/src/app/components/order-details/lib/order-labels.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import type * as Schema from '@vegaprotocol/types';
 import type { components } from '../../../../types/explorer';
 

apps/explorer/src/app/components/page-header/page-header.tsx

@@ -20,7 +20,7 @@ export const PageHeader = ({
   copy = false,
   className,
 }: PageHeaderProps) => {
-  const titleClasses = 'text-4xl xl:text-5xl uppercase font-alpha calt';
+  const titleClasses = 'text-4xl xl:text-5xl uppercase font-alpha';
   return (
     <header className={className}>
       <span className={`${titleClasses} block`}>{prefix}</span>

apps/explorer/src/app/components/page-helpers/index.ts

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

apps/explorer/src/app/components/page-helpers/page-actions.tsx

@@ -1,10 +0,0 @@
-import type { HTMLAttributes } from 'react';
-
-export const PageActions = ({
-  children,
-  ...props
-}: HTMLAttributes<HTMLDivElement>) => (
-  <div className="flex flex-row items-start gap-1" {...props}>
-    {children}
-  </div>
-);

apps/explorer/src/app/components/page-helpers/page-title.tsx

@@ -1,45 +0,0 @@
-import classNames from 'classnames';
-import type { HTMLAttributes, ReactNode } from 'react';
-import { useDocumentTitle } from '../../hooks/use-document-title';
-import { RouteTitle } from '../route-title';
-import { PageActions } from './page-actions';
-
-type PageTitleProps = {
-  /**
-   * The page title
-   * (also sets the document title unless overwritten by
-   * `documentTitle` property)
-   */
-  title: string;
-  /**
-   * The react node that consists of CTA buttons, links, etc.
-   */
-  actions?: ReactNode;
-  /**
-   * Overwrites the document title
-   */
-  documentTitle?: Parameters<typeof useDocumentTitle>[0];
-} & Omit<HTMLAttributes<HTMLHeadingElement>, 'children'>;
-
-export const PageTitle = ({
-  title,
-  actions,
-  documentTitle,
-  className,
-  ...props
-}: PageTitleProps) => {
-  useDocumentTitle(
-    documentTitle && documentTitle.length > 0 ? documentTitle : [title]
-  );
-  return (
-    <div
-      className="flex flex-col md:flex-row gap-1 justify-between content-start mb-8"
-      data-testid="page-title"
-    >
-      <RouteTitle className={classNames('mb-1', className)} {...props}>
-        {title}
-      </RouteTitle>
-      {actions && <PageActions>{actions}</PageActions>}
-    </div>
-  );
-};

apps/explorer/src/app/components/price-in-market/price-in-market.tsx

@@ -1,5 +1,4 @@
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
+import { addDecimalsFormatNumber, t } from '@vegaprotocol/react-helpers';
 import isUndefined from 'lodash/isUndefined';
 import { useExplorerMarketQuery } from '../links/market-link/__generated__/Market';
 import get from 'lodash/get';

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

@@ -1,18 +1,21 @@
-import type { ProposalListFieldsFragment } from '@vegaprotocol/proposals';
-import { VoteProgress } from '@vegaprotocol/proposals';
+import type { ProposalListFieldsFragment } from '@vegaprotocol/governance';
+import { VoteProgress } from '@vegaprotocol/governance';
 import type { AgGridReact } from 'ag-grid-react';
 import { AgGridColumn } from 'ag-grid-react';
-import { ExternalLink } from '@vegaprotocol/ui-toolkit';
-import { AgGridDynamic as AgGrid } from '@vegaprotocol/datagrid';
 import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
-} from '@vegaprotocol/datagrid';
+} from '@vegaprotocol/ui-toolkit';
+import { ExternalLink } from '@vegaprotocol/ui-toolkit';
+import { AgGridDynamic as AgGrid } from '@vegaprotocol/ui-toolkit';
 import { useLayoutEffect, useMemo, useRef, useState } from 'react';
 import type { RowClickedEvent } from 'ag-grid-community';
-import { getDateTimeFormat } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
-import { NetworkParams, useNetworkParams } from '@vegaprotocol/react-helpers';
+import {
+  getDateTimeFormat,
+  NetworkParams,
+  t,
+  useNetworkParams,
+} from '@vegaprotocol/react-helpers';
 import { ProposalStateMapping } from '@vegaprotocol/types';
 import BigNumber from 'bignumber.js';
 import { DApp, TOKEN_PROPOSAL, useLinks } from '@vegaprotocol/environment';

apps/explorer/src/app/components/render-fetched/index.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { StatusMessage } from '../status-message';
 
 interface RenderFetchedProps {

apps/explorer/src/app/components/route-title/index.tsx

@@ -13,7 +13,7 @@ export const RouteTitle = ({
   ...props
 }: RouteTitleProps) => {
   const classes = classnames(
-    'font-alpha calt',
+    'font-alpha',
     'text-4xl',
     'uppercase',
     'mb-8',

apps/explorer/src/app/components/router-error-boundary/index.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import React from 'react';
 
 interface RouteErrorBoundaryProps {

apps/explorer/src/app/components/search/search.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useState } from 'react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { Button, Input, InputError } from '@vegaprotocol/ui-toolkit';
 import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';

apps/explorer/src/app/components/size-in-asset/size-in-asset.tsx

@@ -1,5 +1,5 @@
 import { useAssetDataProvider } from '@vegaprotocol/assets';
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/react-helpers';
 import { AssetLink } from '../links';
 
 export type DecimalSource = 'ASSET';

apps/explorer/src/app/components/size-in-market/size-in-market.tsx

@@ -1,4 +1,4 @@
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/react-helpers';
 import { useExplorerMarketQuery } from '../links/market-link/__generated__/Market';
 
 export type DecimalSource = 'MARKET';

apps/explorer/src/app/components/status-message/index.tsx

@@ -11,7 +11,7 @@ export const StatusMessage = ({
   className,
   ...props
 }: StatusMessageProps) => {
-  const classes = classnames('font-alpha calt text-2xl mb-28', className);
+  const classes = classnames('font-alpha text-2xl mb-28', className);
   return (
     <h3 className={classes} {...props}>
       {children}

apps/explorer/src/app/components/sub-heading/index.tsx

@@ -12,7 +12,7 @@ export const SubHeading = ({
   ...props
 }: SubHeadingProps) => {
   const classes = classnames(
-    'font-alpha calt',
+    'font-alpha',
     'text-2xl',
     'uppercase',
     'mt-8 mb-2',

apps/explorer/src/app/components/time-ago/index.tsx

@@ -1,5 +1,5 @@
 import { formatDistanceToNowStrict } from 'date-fns';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { useEffect, useState } from 'react';
 
 interface TimeAgoProps {

apps/explorer/src/app/components/time/index.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 interface TimeProps {
   date: string | null | undefined;

apps/explorer/src/app/components/truncate/truncate.tsx

@@ -1,4 +1,4 @@
-import { truncateByChars } from '@vegaprotocol/utils';
+import { truncateByChars } from '@vegaprotocol/react-helpers';
 import * as React from 'react';
 
 interface TruncateInlineProps {

apps/explorer/src/app/components/txs/details/chain-events/tx-builtin-deposit.spec.tsx

@@ -1,6 +1,6 @@
 import { render } from '@testing-library/react';
 import { TxDetailsChainEventBuiltinDeposit } from './tx-builtin-deposit';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-builtin-deposit.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink, PartyLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-builtin-withdrawal.spec.tsx

@@ -1,6 +1,6 @@
 import { render } from '@testing-library/react';
 import { TxDetailsChainEventBuiltinWithdrawal } from './tx-builtin-withdrawal';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-builtin-withdrawal.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink, PartyLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-delist.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-delist.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-limits-updated.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-limits-updated.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-list.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-asset-list.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-bridge-pause.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TxDetailsChainEventErc20BridgePause } from './tx-erc20-bridge-pause';
 
 describe('Chain Event: ERC20 bridge pause', () => {

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-bridge-pause.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 
 export interface TxDetailsChainEventErc20BridgePauseProps {

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-deposit.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-deposit.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink, PartyLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-withdrawal.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-erc20-withdrawal.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { AssetLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-multisig-signer.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import { MockedProvider } from '@apollo/client/testing';

apps/explorer/src/app/components/txs/details/chain-events/tx-multisig-signer.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { getBlockTime } from './lib/get-block-time';

apps/explorer/src/app/components/txs/details/chain-events/tx-multisig-threshold.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import { MockedProvider } from '@apollo/client/testing';

apps/explorer/src/app/components/txs/details/chain-events/tx-multisig-threshold.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import isNumber from 'lodash/isNumber';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-deposit.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-deposit.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { PartyLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-remove.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-remove.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import { PartyLink } from '../../../links';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-totalsupply.spec.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import omit from 'lodash/omit';

apps/explorer/src/app/components/txs/details/chain-events/tx-stake-totalsupply.tsx

@@ -1,5 +1,4 @@
-import { formatNumber, toBigNum } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
+import { formatNumber, t, toBigNum } from '@vegaprotocol/react-helpers';
 import { TableRow, TableCell } from '../../../table';
 import type { components } from '../../../../../types/explorer';
 import {

apps/explorer/src/app/components/txs/details/liquidity-provision/components/liquidity-provision-details-row.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../../types/explorer';
 import { TableRow } from '../../../../table';

apps/explorer/src/app/components/txs/details/liquidity-provision/components/liquidity-provision-offset.tsx

@@ -1,5 +1,5 @@
 import { useExplorerSettlementAssetForMarketQuery } from '../__generated__/Explorer-settlement-asset';
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFormatNumber } from '@vegaprotocol/react-helpers';
 import type { ExplorerSettlementAssetForMarketQuery } from '../__generated__/Explorer-settlement-asset';
 import type { VegaSide } from './liquidity-provision-details-row';
 

apps/explorer/src/app/components/txs/details/liquidity-provision/liquidity-provision-details.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 import type { components } from '../../../../../types/explorer';
 import type { LiquiditySubmission } from '../tx-liquidity-submission';

apps/explorer/src/app/components/txs/details/oracle-data/data-submission-json-oracle.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 
 interface JSONOracleDataProps {
   payload: string;

apps/explorer/src/app/components/txs/details/oracle-data/data-submission-open-oracle.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { NestedDataList } from '../../../nested-data-list';
 import { OpenOraclePrices } from './open-oracle/open-oracle-prices';
 

apps/explorer/src/app/components/txs/details/oracle-data/open-oracle/open-oracle-prices.tsx

@@ -1,4 +1,4 @@
-import { t } from '@vegaprotocol/i18n';
+import { t } from '@vegaprotocol/react-helpers';
 import { CopyWithTooltip } from '@vegaprotocol/ui-toolkit';
 import { TableRow } from '../../../../table';
 import { TruncateInline } from '../../../../truncate/truncate';

apps/explorer/src/app/components/txs/details/proposal/Proposal.graphql

@@ -1,7 +0,0 @@
-query ExplorerProposalStatus($id: ID!) {
-  proposal(id: $id) {
-    id
-    state
-    rejectionReason
-  }
-}

apps/explorer/src/app/components/txs/details/proposal/SignatureBundle.graphql

@@ -1,19 +0,0 @@
-query ExplorerNewAssetSignatureBundle($id: ID!) {
-  erc20ListAssetBundle(assetId: $id) {
-    signatures
-    nonce
-  }
-  asset(id: $id) {
-    status
-  }
-}
-
-query ExplorerUpdateAssetSignatureBundle($id: ID!) {
-  erc20SetAssetLimitsBundle(proposalId: $id) {
-    signatures
-    nonce
-  }
-  asset(id: $id) {
-    status
-  }
-}

apps/explorer/src/app/components/txs/details/proposal/__generated__/Proposal.ts

@@ -1,50 +0,0 @@
-import * as Types from '@vegaprotocol/types';
-
-import { gql } from '@apollo/client';
-import * as Apollo from '@apollo/client';
-const defaultOptions = {} as const;
-export type ExplorerProposalStatusQueryVariables = Types.Exact<{
-  id: Types.Scalars['ID'];
-}>;
-
-
-export type ExplorerProposalStatusQuery = { __typename?: 'Query', proposal?: { __typename?: 'Proposal', id?: string | null, state: Types.ProposalState, rejectionReason?: Types.ProposalRejectionReason | null } | null };
-
-
-export const ExplorerProposalStatusDocument = gql`
-    query ExplorerProposalStatus($id: ID!) {
-  proposal(id: $id) {
-    id
-    state
-    rejectionReason
-  }
-}
-    `;
-
-/**
- * __useExplorerProposalStatusQuery__
- *
- * To run a query within a React component, call `useExplorerProposalStatusQuery` and pass it any options that fit your needs.
- * When your component renders, `useExplorerProposalStatusQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useExplorerProposalStatusQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useExplorerProposalStatusQuery(baseOptions: Apollo.QueryHookOptions<ExplorerProposalStatusQuery, ExplorerProposalStatusQueryVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<ExplorerProposalStatusQuery, ExplorerProposalStatusQueryVariables>(ExplorerProposalStatusDocument, options);
-      }
-export function useExplorerProposalStatusLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<ExplorerProposalStatusQuery, ExplorerProposalStatusQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<ExplorerProposalStatusQuery, ExplorerProposalStatusQueryVariables>(ExplorerProposalStatusDocument, options);
-        }
-export type ExplorerProposalStatusQueryHookResult = ReturnType<typeof useExplorerProposalStatusQuery>;
-export type ExplorerProposalStatusLazyQueryHookResult = ReturnType<typeof useExplorerProposalStatusLazyQuery>;
-export type ExplorerProposalStatusQueryResult = Apollo.QueryResult<ExplorerProposalStatusQuery, ExplorerProposalStatusQueryVariables>;

apps/explorer/src/app/components/txs/details/proposal/__generated__/SignatureBundle.ts

@@ -1,98 +0,0 @@
-import * as Types from '@vegaprotocol/types';
-
-import { gql } from '@apollo/client';
-import * as Apollo from '@apollo/client';
-const defaultOptions = {} as const;
-export type ExplorerNewAssetSignatureBundleQueryVariables = Types.Exact<{
-  id: Types.Scalars['ID'];
-}>;
-
-
-export type ExplorerNewAssetSignatureBundleQuery = { __typename?: 'Query', erc20ListAssetBundle?: { __typename?: 'Erc20ListAssetBundle', signatures: string, nonce: string } | null, asset?: { __typename?: 'Asset', status: Types.AssetStatus } | null };
-
-export type ExplorerUpdateAssetSignatureBundleQueryVariables = Types.Exact<{
-  id: Types.Scalars['ID'];
-}>;
-
-
-export type ExplorerUpdateAssetSignatureBundleQuery = { __typename?: 'Query', erc20SetAssetLimitsBundle: { __typename?: 'ERC20SetAssetLimitsBundle', signatures: string, nonce: string }, asset?: { __typename?: 'Asset', status: Types.AssetStatus } | null };
-
-
-export const ExplorerNewAssetSignatureBundleDocument = gql`
-    query ExplorerNewAssetSignatureBundle($id: ID!) {
-  erc20ListAssetBundle(assetId: $id) {
-    signatures
-    nonce
-  }
-  asset(id: $id) {
-    status
-  }
-}
-    `;
-
-/**
- * __useExplorerNewAssetSignatureBundleQuery__
- *
- * To run a query within a React component, call `useExplorerNewAssetSignatureBundleQuery` and pass it any options that fit your needs.
- * When your component renders, `useExplorerNewAssetSignatureBundleQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useExplorerNewAssetSignatureBundleQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useExplorerNewAssetSignatureBundleQuery(baseOptions: Apollo.QueryHookOptions<ExplorerNewAssetSignatureBundleQuery, ExplorerNewAssetSignatureBundleQueryVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<ExplorerNewAssetSignatureBundleQuery, ExplorerNewAssetSignatureBundleQueryVariables>(ExplorerNewAssetSignatureBundleDocument, options);
-      }
-export function useExplorerNewAssetSignatureBundleLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<ExplorerNewAssetSignatureBundleQuery, ExplorerNewAssetSignatureBundleQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<ExplorerNewAssetSignatureBundleQuery, ExplorerNewAssetSignatureBundleQueryVariables>(ExplorerNewAssetSignatureBundleDocument, options);
-        }
-export type ExplorerNewAssetSignatureBundleQueryHookResult = ReturnType<typeof useExplorerNewAssetSignatureBundleQuery>;
-export type ExplorerNewAssetSignatureBundleLazyQueryHookResult = ReturnType<typeof useExplorerNewAssetSignatureBundleLazyQuery>;
-export type ExplorerNewAssetSignatureBundleQueryResult = Apollo.QueryResult<ExplorerNewAssetSignatureBundleQuery, ExplorerNewAssetSignatureBundleQueryVariables>;
-export const ExplorerUpdateAssetSignatureBundleDocument = gql`
-    query ExplorerUpdateAssetSignatureBundle($id: ID!) {
-  erc20SetAssetLimitsBundle(proposalId: $id) {
-    signatures
-    nonce
-  }
-  asset(id: $id) {
-    status
-  }
-}
-    `;
-
-/**
- * __useExplorerUpdateAssetSignatureBundleQuery__
- *
- * To run a query within a React component, call `useExplorerUpdateAssetSignatureBundleQuery` and pass it any options that fit your needs.
- * When your component renders, `useExplorerUpdateAssetSignatureBundleQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useExplorerUpdateAssetSignatureBundleQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useExplorerUpdateAssetSignatureBundleQuery(baseOptions: Apollo.QueryHookOptions<ExplorerUpdateAssetSignatureBundleQuery, ExplorerUpdateAssetSignatureBundleQueryVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<ExplorerUpdateAssetSignatureBundleQuery, ExplorerUpdateAssetSignatureBundleQueryVariables>(ExplorerUpdateAssetSignatureBundleDocument, options);
-      }
-export function useExplorerUpdateAssetSignatureBundleLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<ExplorerUpdateAssetSignatureBundleQuery, ExplorerUpdateAssetSignatureBundleQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<ExplorerUpdateAssetSignatureBundleQuery, ExplorerUpdateAssetSignatureBundleQueryVariables>(ExplorerUpdateAssetSignatureBundleDocument, options);
-        }
-export type ExplorerUpdateAssetSignatureBundleQueryHookResult = ReturnType<typeof useExplorerUpdateAssetSignatureBundleQuery>;
-export type ExplorerUpdateAssetSignatureBundleLazyQueryHookResult = ReturnType<typeof useExplorerUpdateAssetSignatureBundleLazyQuery>;
-export type ExplorerUpdateAssetSignatureBundleQueryResult = Apollo.QueryResult<ExplorerUpdateAssetSignatureBundleQuery, ExplorerUpdateAssetSignatureBundleQueryVariables>;

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

@@ -1,70 +0,0 @@
-import { t } from '@vegaprotocol/i18n';
-import { Lozenge } from '@vegaprotocol/ui-toolkit';
-import type { components } from '../../../../../types/explorer';
-import type { ExplorerProposalStatusQuery } from './__generated__/Proposal';
-import { useExplorerProposalStatusQuery } from './__generated__/Proposal';
-
-type Terms = components['schemas']['vegaProposalTerms'];
-
-export function format(date: string | undefined, def: string) {
-  if (!date) {
-    return def;
-  }
-
-  return new Date().toLocaleDateString() || def;
-}
-
-export function getDate(
-  data: ExplorerProposalStatusQuery | undefined,
-  terms: Terms
-): string {
-  const DEFAULT = t('Unknown');
-  if (!data?.proposal?.state) {
-    return DEFAULT;
-  }
-
-  switch (data.proposal.state) {
-    case 'STATE_DECLINED':
-      return `${t('Rejected on')}: ${format(terms.closingTimestamp, DEFAULT)}`;
-    case 'STATE_ENACTED':
-      return `${t('Vote passed on')}: ${format(
-        terms.enactmentTimestamp,
-        DEFAULT
-      )}`;
-    case 'STATE_FAILED':
-      return `${t('Failed on')}: ${format(terms.validationTimestamp, DEFAULT)}`;
-    case 'STATE_OPEN':
-      return `${t('Open until')}: ${format(terms.closingTimestamp, DEFAULT)}`;
-    case 'STATE_PASSED':
-      return `${t('Passed on')}: ${format(terms.closingTimestamp, DEFAULT)}`;
-    case 'STATE_REJECTED':
-      return `${t('Rejected on submission')}`;
-    case 'STATE_WAITING_FOR_NODE_VOTE':
-      return `${t('Opening')}...`;
-    default:
-      return DEFAULT;
-  }
-}
-
-interface ProposalDateProps {
-  id: string;
-  terms: Terms;
-}
-/**
- * Shows the most relevant date for the proposal summary view. Depending on the
- * state returned by GraphQL, we show either the validation, closing or enactment
- * timestamp
- */
-export const ProposalDate = ({ terms, id }: ProposalDateProps) => {
-  const { data } = useExplorerProposalStatusQuery({
-    variables: {
-      id,
-    },
-  });
-
-  return (
-    <Lozenge className="font-sans text-xs float-right">
-      {getDate(data, terms)}
-    </Lozenge>
-  );
-};

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

@@ -1,117 +0,0 @@
-import { Icon, Tooltip } from '@vegaprotocol/ui-toolkit';
-import type { IconProps } from '@vegaprotocol/ui-toolkit';
-import { useExplorerProposalStatusQuery } from './__generated__/Proposal';
-import type { ExplorerProposalStatusQuery } from './__generated__/Proposal';
-import type * as Apollo from '@apollo/client';
-import type * as Types from '@vegaprotocol/types';
-import { t } from '@vegaprotocol/i18n';
-
-type ProposalQueryResult = Apollo.QueryResult<
-  ExplorerProposalStatusQuery,
-  Types.Exact<{
-    id: string;
-  }>
->;
-
-interface ProposalStatusIconProps {
-  id: string;
-}
-
-type IconAndLabel = {
-  icon: IconProps['name'];
-  label: string;
-};
-
-/**
- * Select an icon for a given query result. Tolerates queries that don't return
- * any data
- *
- * @param data a data result from useExplorerProposalStatusQuery
- * @returns Icon name
- */
-export function getIconAndLabelForStatus(
-  res: ProposalQueryResult
-): IconAndLabel {
-  const DEFAULT: IconAndLabel = {
-    icon: 'error',
-    label: t('Proposal state unknown'),
-  };
-
-  if (res.loading) {
-    return {
-      icon: 'more',
-      label: t('Loading data'),
-    };
-  }
-
-  if (!res?.data?.proposal || res.error) {
-    return {
-      icon: 'error',
-      label: res.error?.message || DEFAULT.label,
-    };
-  }
-
-  switch (res.data.proposal.state) {
-    case 'STATE_DECLINED':
-      return {
-        icon: 'stop',
-        label: t('Proposal did not have enough participation to be valid'),
-      };
-    case 'STATE_ENACTED':
-      return {
-        icon: 'tick-circle',
-        label: t('Vote passed and the proposal has been enacted'),
-      };
-    case 'STATE_FAILED':
-      return {
-        icon: 'thumbs-down',
-        label: t('Proposal became invalid and was not processed'),
-      };
-    case 'STATE_OPEN':
-      return {
-        // A checklist to indicate in progress
-        icon: 'form',
-        label: t('Voting is in progress'),
-      };
-    case 'STATE_PASSED':
-      return {
-        icon: 'thumbs-up',
-        label: t(
-          'Voting is complete and this proposal was approved. It is not yet enacted.'
-        ),
-      };
-    case 'STATE_REJECTED':
-      return {
-        icon: 'disable',
-        label: t('The proposal was invalid'),
-      };
-    case 'STATE_WAITING_FOR_NODE_VOTE':
-      return {
-        // A sparkly thing indicating it's new
-        icon: 'clean',
-        label: t('Proposal is being checked by validators'),
-      };
-    default:
-      return DEFAULT;
-  }
-}
-
-/**
- */
-export const ProposalStatusIcon = ({ id }: ProposalStatusIconProps) => {
-  const { icon, label } = getIconAndLabelForStatus(
-    useExplorerProposalStatusQuery({
-      variables: {
-        id,
-      },
-    })
-  );
-
-  return (
-    <div className="float-left mr-3">
-      <Tooltip description={<p>{label}</p>}>
-        <Icon name={icon} />
-      </Tooltip>
-    </div>
-  );
-};

apps/explorer/src/app/components/txs/details/proposal/signature-bundle-new.tsx

@@ -1,42 +0,0 @@
-import { Loader } from '@vegaprotocol/ui-toolkit';
-import { BundleError } from './signature-bundle/bundle-error';
-import { BundleExists } from './signature-bundle/bundle-exists';
-import { useExplorerNewAssetSignatureBundleQuery } from './__generated__/SignatureBundle';
-
-export interface ProposalSignatureBundleByTypeProps {
-  id: string;
-}
-
-/**
- * If a proposal needs a signature bundle, AND that signature bundle exists
- * AND that proposal is a New Asset Proposal, render an overview of the
- * signature bundle. Or an error.
- *
- * There is an almost identical component, ProposalSignatureBundleUpdateAsset
- */
-export const ProposalSignatureBundleNewAsset = ({
-  id,
-}: ProposalSignatureBundleByTypeProps) => {
-  const { data, error, loading } = useExplorerNewAssetSignatureBundleQuery({
-    variables: {
-      id,
-    },
-  });
-
-  if (loading) {
-    return <Loader />;
-  }
-
-  if (data?.erc20ListAssetBundle?.signatures) {
-    return (
-      <BundleExists
-        signatures={data.erc20ListAssetBundle.signatures}
-        nonce={data.erc20ListAssetBundle.nonce}
-        status={data.asset?.status}
-        proposalId={id}
-      />
-    );
-  } else {
-    return <BundleError status={data?.asset?.status} error={error} />;
-  }
-};

apps/explorer/src/app/components/txs/details/proposal/signature-bundle-update.tsx

@@ -1,39 +0,0 @@
-import { Loader } from '@vegaprotocol/ui-toolkit';
-import type { ProposalSignatureBundleByTypeProps } from './signature-bundle-new';
-import { BundleError } from './signature-bundle/bundle-error';
-import { BundleExists } from './signature-bundle/bundle-exists';
-import { useExplorerUpdateAssetSignatureBundleQuery } from './__generated__/SignatureBundle';
-
-/**
- * If a proposal needs a signature bundle, AND that signature bundle exists
- * AND that proposal is a Asset Limits Proposal, render an overview of the
- * signature bundle. Or an error.
- *
- * There is an almost identical component, ProposalSignatureBundleNewAsset
- */
-export const ProposalSignatureBundleUpdateAsset = ({
-  id,
-}: ProposalSignatureBundleByTypeProps) => {
-  const { data, error, loading } = useExplorerUpdateAssetSignatureBundleQuery({
-    variables: {
-      id,
-    },
-  });
-
-  if (loading) {
-    return <Loader />;
-  }
-
-  if (data?.erc20SetAssetLimitsBundle?.signatures) {
-    return (
-      <BundleExists
-        signatures={data.erc20SetAssetLimitsBundle.signatures}
-        nonce={data.erc20SetAssetLimitsBundle.nonce}
-        status={data.asset?.status}
-        proposalId={id}
-      />
-    );
-  } else {
-    return <BundleError status={data?.asset?.status} error={error} />;
-  }
-};

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

@@ -1,31 +0,0 @@
-import { ProposalSignatureBundleNewAsset } from './signature-bundle-new';
-import { ProposalSignatureBundleUpdateAsset } from './signature-bundle-update';
-
-export function format(date: string | undefined, def: string) {
-  if (!date) {
-    return def;
-  }
-
-  return new Date().toLocaleDateString() || def;
-}
-
-interface ProposalSignatureBundleProps {
-  id: string;
-  type: 'NewAsset' | 'UpdateAsset';
-}
-
-/**
- * Some proposals, if enacted, generate a signature bundle.
- * The queries have to be split due to the way the API returns
- * errors, hence this slightly redundant feeling switcher.
- */
-export const ProposalSignatureBundle = ({
-  id,
-  type,
-}: ProposalSignatureBundleProps) => {
-  return type === 'NewAsset' ? (
-    <ProposalSignatureBundleNewAsset id={id} />
-  ) : (
-    <ProposalSignatureBundleUpdateAsset id={id} />
-  );
-};