feat: add check for operation name in apollo client error link

chore: rename nodes so its more clear what the query is used for
chore: update tranches
2023-05-18 15:05:32 -07:00 · 2023-05-18 14:54:13 -07:00 · 2023-05-18 18:07:36 +00:00 · 2023-05-18 16:50:15 +02:00 · 2023-05-18 14:59:46 +01:00 · 2023-05-18 15:12:12 +02:00
338 changed files with 5245 additions and 2942 deletions
@@ -0,0 +1,74 @@
+name: After Release
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  after-release:
+    runs-on: ubuntu-22.04
+    timeout-minutes: 30
+    steps:
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Log in to the Container registry (ghcr)
+        uses: docker/login-action@v2
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Log in to the Container registry (docker hub)
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: resolve ipfs hashes for release
+        run: |
+          echo "Tag name: ${{ github.event.release.tag_name }}"
+          echo "Name: ${{ github.event.release.name }}"
+          echo "Description: ${{ github.event.release.body }}"
+          until docker pull vegaprotocol/trading:${{ github.event.release.tag_name }}; do
+            echo "Image not pushed yet, waiting 60 seconds"
+            sleep 60
+          done
+          docker run --rm vegaprotocol/trading:${{ github.event.release.tag_name }} cat /ipfs-hash > ipfs-hash
+          curl -L https://dist.ipfs.tech/kubo/v0.20.0/kubo_v0.20.0_linux-amd64.tar.gz -o kubo.tgz
+          tar -xzf kubo.tgz
+          export PATH="$PATH:$PWD/kubo"
+          which ipfs
+          echo IPFS_V0=$(cat ipfs-hash) >> $GITHUB_ENV
+          echo IPFS_V1=$(ipfs cid format -v 1 -b base32 $(cat ipfs-hash)) >> $GITHUB_ENV
+
+      - name: Edit Release
+        uses: irongut/EditRelease@v1.2.0
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          id: ${{ github.event.release.id }}
+          body: |
+            ---
+
+            # Deployments
+            * https://explorer.vega.xyz
+            * https://governance.vega.xyz
+
+            # IPFS releases
+            Tye IPFS hash of this release of the Trading app is:
+
+            CIDv0: ${{ env.IPFS_V0 }}
+            CIDv1: ${{ env.IPFS_V1 }}
+
+            You can always access the latest IPFS release by visiting [vega.trading](https://vega.trading).
+
+            You can also access Trading directly from an IPFS gateway.
+            BEWARE: The Trading interface uses [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) to remember your settings, such as which tokens you have imported. You should always use an IPFS gateway that enforces [origin separation](https://ipfs.github.io/public-gateway-checker/).
+
+            Your settings are not remembered across different URLs.
+
+            IPFS gateways:
+
+            https://${{ env.IPFS_V1 }}.ipfs.dweb.link/
+            https://${{ env.IPFS_V1 }}.ipfs.cf-ipfs.com/
+            ipfs://${{ env.IPFS_V0 }}/
@@ -20,7 +20,7 @@ jobs:
        project: ${{ fromJSON(inputs.projects) }}
    name: ${{ matrix.project }}
    runs-on: self-hosted-runner
-    timeout-minutes: 40
+    timeout-minutes: 60
    steps:
      # Checks if skip cache was requested
      - name: Set skip-nx-cache flag
@@ -98,4 +98,4 @@ jobs:
        if: ${{ failure() }}
        with:
          name: test-report-${{ matrix.project }}
-          path: frontend-monorepo/apps/trading-e2e/cypress/reports
+          path: frontend-monorepo/apps/${{ matrix.project }}/cypress/reports
@@ -170,12 +170,6 @@ jobs:
          labels: ${{ matrix.app }}-preview
          number: ${{ github.event.number }}

-      - name: Add ipfs hash to release
-        uses: softprops/action-gh-release@v1
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/v') }}
-        with:
-          files: ${{ matrix.app }}-ipfs-hash
-
      - name: Trigger fleek deployment
        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/v') }}
        run: |
@@ -191,37 +185,36 @@ jobs:
            -d '{"query": "mutation{triggerDeploy(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id status}}"}' \
            https://api.fleek.co/graphql

-      - name: Checkout vega.xyz
+      - name: Update vega.trading DNS to redirect to the new console
        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/v') }}
-        uses: actions/checkout@v3
-        with:
-          repository: vegaprotocol/vega.xyz
-          path: './vega-xyz'
-          token: ${{ secrets.VEGA_CI_BOT_GITHUB_TOKEN }}
-
-      - name: Update hash on interstitial page
-        if: ${{ matrix.app == 'trading' && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/v') }}
-        env:
-          GH_TOKEN: ${{ secrets.VEGA_CI_BOT_GITHUB_TOKEN }}
        run: |
          curl -L https://dist.ipfs.tech/kubo/v0.20.0/kubo_v0.20.0_linux-amd64.tar.gz -o kubo.tgz
          tar -xzf kubo.tgz
          export PATH="$PATH:$PWD/kubo"
          which ipfs
          new_hash=$(cat ${{ matrix.app }}-ipfs-hash)
-          cd vega-xyz
-          ./interstital-allow-update.sh ${new_hash}
-          git config --global user.email "vega-ci-bot@vega.xyz"
-          git config --global user.name "vega-ci-bot"
-          git add interstitial-allow.json netlify.toml
-          commit_msg="feat(ci): Update CID for console release @ ${{ github.ref }}"
-          git commit -m "${commit_msg}"
-          git push origin main
+          new_cid=$(ipfs cid format -v 1 -b base32 $new_hash)

-          # branch_name=${{ github.ref_name }}-hash-update
-          # git checkout -b "${branch_name}"
-          # git add interstitial-allow.json netlify.toml
-          # git push -u origin "${branch_name}"
-          # pr_url="$(gh pr create --title "${commit_msg}" --body 'update ipfs hash for console @ ${{ github.ref }}')"
-          # echo $pr_url
-          # gh pr merge --admin --auto $pr_url
+          # Generate console URL
+          new_console_url_type=ipfs
+          # new_console_url_type=ipns
+          new_console_url_domain=cf-ipfs.com
+          # new_console_url_domain=dweb.link
+          new_console_url="https://${new_cid}.${new_console_url_type}.${new_console_url_domain}/"
+          echo "new_console_url=${new_console_url}"
+
+          # Update record in DNSimple
+          # docs: https://developer.dnsimple.com/v2/zones/records/#updateZoneRecord
+          dnsimple_account_id=84895
+          dnsimple_zone_name=vega.trading
+          dnsimple_record_id=44409591
+          # see: https://dnsimple.com/a/84895/domains/vega.trading/records/44409591/edit
+
+          curl  -H 'Authorization: Bearer ${{ secrets.DNSIMPLE_API_TOKEN }}' \
+                -H 'Accept: application/json' \
+                -H 'Content-Type: application/json' \
+                -X PATCH \
+                -d "{
+                      \"content\": \"${new_console_url}\"
+                }" \
+                https://api.dnsimple.com/v2/${dnsimple_account_id}/zones/${dnsimple_zone_name}/records/${dnsimple_record_id}
@@ -0,0 +1,77 @@
+name: 'Rollback console'
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: 'Version that should be set on rollback'
+        required: true
+        type: string
+
+jobs:
+  rollback:
+    runs-on: ubuntu-22.04
+    timeout-minutes: 10
+    steps:
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Log in to the Container registry (docker hub)
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: Retag mainnet
+        run: |
+          docker pull vegaprotocol/trading:${{ inputs.version }}
+          docker tag vegaprotocol/trading:${{ inputs.version }} vegaprotocol/trading:mainnet
+          docker push vegaprotocol/trading:mainnet
+          docker run --rm vegaprotocol/trading:mainnet cat /ipfs-hash > ipfs-hash
+
+      - name: Trigger fleek deployment
+        run: |
+          # display info about app
+          curl -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+            -H "Content-Type: application/json" \
+            -d '{"query": "query{getSiteById(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id latestDeploy{id status}}}"}' \
+            https://api.fleek.co/graphql
+
+          # trigger new deployment as base image is always set to vegaprotocol/trading:mainnet
+          curl -H "Authorization: ${{ secrets.FLEEK_API_KEY }}" \
+            -H "Content-Type: application/json" \
+            -d '{"query": "mutation{triggerDeploy(siteId:\"f8f2e051-f18e-49e6-b876-0a39369dc0d8\"){id status}}"}' \
+            https://api.fleek.co/graphql
+
+      - name: Update vega.trading DNS to redirect to the new console
+        run: |
+          curl -L https://dist.ipfs.tech/kubo/v0.20.0/kubo_v0.20.0_linux-amd64.tar.gz -o kubo.tgz
+          tar -xzf kubo.tgz
+          export PATH="$PATH:$PWD/kubo"
+          which ipfs
+          new_hash=$(cat ipfs-hash)
+          new_cid=$(ipfs cid format -v 1 -b base32 $new_hash)
+
+          # Generate console URL
+          new_console_url_type=ipfs
+          # new_console_url_type=ipns
+          new_console_url_domain=cf-ipfs.com
+          # new_console_url_domain=dweb.link
+          new_console_url="https://${new_cid}.${new_console_url_type}.${new_console_url_domain}/"
+          echo "new_console_url=${new_console_url}"
+
+          # Update record in DNSimple
+          # docs: https://developer.dnsimple.com/v2/zones/records/#updateZoneRecord
+          dnsimple_account_id=84895
+          dnsimple_zone_name=vega.trading
+          dnsimple_record_id=44409591
+          # see: https://dnsimple.com/a/84895/domains/vega.trading/records/44409591/edit
+
+          curl  -H 'Authorization: Bearer ${{ secrets.DNSIMPLE_API_TOKEN }}' \
+                -H 'Accept: application/json' \
+                -H 'Content-Type: application/json' \
+                -X PATCH \
+                -d "{
+                      \"content\": \"${new_console_url}\"
+                }" \
+                https://api.dnsimple.com/v2/${dnsimple_account_id}/zones/${dnsimple_zone_name}/records/${dnsimple_record_id}
@@ -49,4 +49,4 @@ cypress.env.json
 .next

 #cypress
-/apps/trading-e2e/cypress/reports/
+/apps/**/cypress/reports/
@@ -1,10 +1,11 @@
 const { defineConfig } = require('cypress');

 module.exports = defineConfig({
-  projectId: 'et4snf',
+  reporter: '../../node_modules/cypress-mochawesome-reporter',

  e2e: {
    setupNodeEvents(on, config) {
+      require('cypress-mochawesome-reporter/plugin')(on);
      require('@cypress/grep/src/plugin')(config);
      return config;
    },
@@ -15,5 +15,6 @@

 import '@vegaprotocol/cypress';
 import './common.functions.js';
+import 'cypress-mochawesome-reporter/register';
 import registerCypressGrep from '@cypress/grep';
 registerCypressGrep();
@@ -3,6 +3,7 @@ import { Header } from './header';
 import { MemoryRouter } from 'react-router-dom';

 jest.mock('@vegaprotocol/environment', () => ({
+  ...jest.requireActual('@vegaprotocol/environment'),
  NetworkSwitcher: () => (
    <div data-testid="network-switcher">NetworkSwitcher</div>
  ),
@@ -1,8 +1,8 @@
 import { t } from '@vegaprotocol/i18n';
-import type { MarketInfoWithData } from '@vegaprotocol/market-info';
-import { LiquidityInfoPanel } from '@vegaprotocol/market-info';
-import { LiquidityMonitoringParametersInfoPanel } from '@vegaprotocol/market-info';
+import type { MarketInfoWithData } from '@vegaprotocol/markets';
 import {
+  LiquidityInfoPanel,
+  LiquidityMonitoringParametersInfoPanel,
  InstrumentInfoPanel,
  KeyDetailsInfoPanel,
  LiquidityPriceRangeInfoPanel,
@@ -12,8 +12,8 @@ import {
  RiskModelInfoPanel,
  RiskParametersInfoPanel,
  SettlementAssetInfoPanel,
-} from '@vegaprotocol/market-info';
-import { MarketInfoTable } from '@vegaprotocol/market-info';
+} from '@vegaprotocol/markets';
+import { MarketInfoTable } from '@vegaprotocol/markets';
 import type { DataSourceDefinition } from '@vegaprotocol/types';
 import isEqual from 'lodash/isEqual';

@@ -1,4 +1,4 @@
-import type { MarketFieldsFragment } from '@vegaprotocol/market-list';
+import type { MarketFieldsFragment } from '@vegaprotocol/markets';
 import { t } from '@vegaprotocol/i18n';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 import type { AgGridReact } from 'ag-grid-react';
@@ -8,7 +8,7 @@ import { useScrollToLocation } from '../../hooks/scroll-to-location';
 import { useDocumentTitle } from '../../hooks/use-document-title';
 import compact from 'lodash/compact';
 import { JsonViewerDialog } from '../../components/dialogs/json-viewer-dialog';
-import { marketInfoWithDataProvider } from '@vegaprotocol/market-info';
+import { marketInfoWithDataProvider } from '@vegaprotocol/markets';
 import { PageTitle } from '../../components/page-helpers/page-title';

 export const MarketPage = () => {
@@ -1,6 +1,6 @@
 import { useScrollToLocation } from '../../hooks/scroll-to-location';
 import { useDocumentTitle } from '../../hooks/use-document-title';
-import { marketsProvider } from '@vegaprotocol/market-list';
+import { marketsProvider } from '@vegaprotocol/markets';
 import { RouteTitle } from '../../components/route-title';
 import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
 import { t } from '@vegaprotocol/i18n';
@@ -32,9 +32,9 @@
  line-height: calc(min(var(--ag-line-height, 26px), 26px) - 4px);
 }

-.vega-ag-grid .ag-row {
-  border-width: 1px 0;
-  border-bottom: 1px solid transparent;
+.vega-ag-grid .ag-row,
+.vega-ag-grid .ag-cell {
+  border-width: 0;
 }

 /* Light variables */
@@ -46,7 +46,6 @@
  --ag-header-column-separator-color: theme(colors.neutral[300]);
  --ag-row-border-color: theme(colors.white);
  --ag-row-hover-color: theme(colors.neutral[100]);
-  --ag-font-size: 12px;
 }

 /* Dark variables */
@@ -58,7 +57,6 @@
  --ag-header-column-separator-color: theme(colors.neutral[600]);
  --ag-row-border-color: theme(colors.black);
  --ag-row-hover-color: theme(colors.neutral[800]);
-  --ag-font-size: 12px;
 }

 .voteicon svg {
@@ -1,10 +1,11 @@
 const { defineConfig } = require('cypress');

 module.exports = defineConfig({
-  projectId: 'et4snf',
+  reporter: '../../node_modules/cypress-mochawesome-reporter',

  e2e: {
    setupNodeEvents(on, config) {
+      require('cypress-mochawesome-reporter/plugin')(on);
      require('@cypress/grep/src/plugin')(config);
      return config;
    },
@@ -63,7 +63,6 @@ context(
      });

      it('should have option to go to last and newest page', function () {
-        waitForBeginningOfEpoch();
        cy.getByTestId('goto-last-page').click();
        cy.getByTestId('epoch-total-rewards-table')
          .last()
@@ -8,6 +8,7 @@ import './wallet-eth.functions.ts';
 import './wallet-teardown.functions.ts';
 import './wallet-vega.functions.ts';
 import './proposal.functions.ts';
+import 'cypress-mochawesome-reporter/register';
 import registerCypressGrep from '@cypress/grep';
 import { aliasGQLQuery } from '@vegaprotocol/cypress';
 import { chainIdQuery, statisticsQuery } from '@vegaprotocol/mock';
@@ -16,6 +16,7 @@ import { AppStateProvider } from './contexts/app-state/app-state-provider';
 import { ContractsProvider } from './contexts/contracts/contracts-provider';
 import { AppRouter } from './routes';
 import type { EthereumConfig } from '@vegaprotocol/web3';
+import { WithdrawalApprovalDialogContainer } from '@vegaprotocol/web3';
 import {
  createConnectors,
  useEthTransactionManager,
@@ -43,7 +44,7 @@ import {
 } from '@vegaprotocol/environment';
 import { ENV } from './config';
 import type { InMemoryCacheConfig } from '@apollo/client';
-import { WithdrawalDialog } from '@vegaprotocol/withdraws';
+import { CreateWithdrawalDialog } from '@vegaprotocol/withdraws';
 import { SplashLoader } from './components/splash-loader';
 import { ToastsManager } from './toasts-manager';
 import {
@@ -52,6 +53,7 @@ import {
 } from './components/telemetry-dialog/telemetry-dialog';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import { useTranslation } from 'react-i18next';
+import { isPartyNotFoundError } from './lib/party';

 const cache: InMemoryCacheConfig = {
  typePolicies: {
@@ -157,7 +159,8 @@ const Web3Container = ({
                  <InitializeHandlers />
                  <VegaWalletDialogs />
                  <TransactionModal />
-                  <WithdrawalDialog />
+                  <CreateWithdrawalDialog />
+                  <WithdrawalApprovalDialogContainer />
                  <TelemetryDialog />
                </>
              </BalanceManager>
@@ -211,24 +214,36 @@ const AppContainer = () => {
        enabled: true,
        environment: VEGA_ENV,
        release: GIT_COMMIT_HASH,
-        beforeSend(event) {
+        beforeSend(event, hint) {
+          const error = hint?.originalException;
+          const errorIsString = typeof error === 'string';
+          const errorIsObject = error instanceof Error;
          const requestUrl = event.request?.url;
          const transaction = event.transaction;

+          if (
+            (errorIsString && isPartyNotFoundError({ message: error })) ||
+            (errorIsObject && isPartyNotFoundError(error))
+          ) {
+            // This error is caused by a pubkey making an API request before
+            // it has interacted with the chain. This isn't needed in Sentry.
+            return null;
+          }
+
          const updatedRequest =
-            requestUrl && requestUrl.includes('/test?')
+            requestUrl && requestUrl.includes('/claim?')
              ? { ...event.request, url: removeQueryParams(requestUrl) }
              : event.request;

          const updatedTransaction =
-            transaction && transaction.includes('/test?')
+            transaction && transaction.includes('/claim?')
              ? removeQueryParams(transaction)
              : transaction;

          const updatedBreadcrumbs = event.breadcrumbs?.map((breadcrumb) => {
            if (
              breadcrumb.type === 'navigation' &&
-              breadcrumb.data?.to?.includes('/test?')
+              breadcrumb.data?.to?.includes('/claim?')
            ) {
              return {
                ...breadcrumb,
@@ -1,6 +1,6 @@
 import { Link } from '@vegaprotocol/ui-toolkit';
 import { useTranslation } from 'react-i18next';
-import { ExternalLinks } from '@vegaprotocol/utils';
+import { ExternalLinks } from '@vegaprotocol/environment';

 export const DownloadWalletPrompt = () => {
  const { t } = useTranslation();
@@ -26,6 +26,7 @@ import type {
  WalletDelegationFieldsFragment,
 } from './__generated__/Delegations';
 import { DelegationsDocument } from './__generated__/Delegations';
+import { isPartyNotFoundError } from '../../lib/party';

 export const usePollForDelegations = () => {
  const { token: vegaToken } = useContracts();
@@ -75,6 +76,7 @@ export const usePollForDelegations = () => {
          })
          .then((res) => {
            if (!mounted) return;
+
            const canonisedDelegations = removePaginationWrapper(
              res.data.party?.delegationsConnection?.edges
            );
@@ -203,6 +205,15 @@ export const usePollForDelegations = () => {
            setDelegatedNodes(delegatedAmounts);
          })
          .catch((err: Error) => {
+            // if party isn't found, dont log to Sentry, just clear state as, user
+            // will not have any delagations or accounts
+            if (isPartyNotFoundError(err)) {
+              setDelegations([]);
+              setAccounts([]);
+              setDelegatedNodes([]);
+              setCurrentStakeAvailable(new BigNumber(0));
+              return;
+            }
            Sentry.captureException(err);
            // If query fails stop interval. Its almost certain that the query
            // will just continue to fail
@@ -594,7 +594,9 @@
  "numberOfAgainstVotes": "Number of votes against",
  "yesPercentage": "Yes percentage",
  "noPercentage": "No percentage",
-  "proposalTerms": "Proposal terms",
+  "proposalJson": "Full proposal JSON",
+  "proposalDetails": "Proposal details",
+  "proposalDescription": "Description",
  "currentlySetTo": "Currently expected to ",
  "currently": "currently",
  "finalOutcomeMayDiffer": "Final outcome may differ",
@@ -0,0 +1,8 @@
+export const PARTY_NOT_FOUND = 'failed to get party for ID';
+
+export const isPartyNotFoundError = (error: { message: string }) => {
+  if (error.message.includes(PARTY_NOT_FOUND)) {
+    return true;
+  }
+  return false;
+};
@@ -12,7 +12,8 @@ import { useRefreshAfterEpoch } from '../../hooks/use-refresh-after-epoch';
 import { ProposalsListItem } from '../proposals/components/proposals-list-item';
 import { ProtocolUpgradeProposalsListItem } from '../proposals/components/protocol-upgrade-proposals-list-item/protocol-upgrade-proposals-list-item';
 import Routes from '../routes';
-import { ExternalLinks, removePaginationWrapper } from '@vegaprotocol/utils';
+import { ExternalLinks } from '@vegaprotocol/environment';
+import { removePaginationWrapper } from '@vegaprotocol/utils';
 import { useNodesQuery } from '../staking/home/__generated__/Nodes';
 import { useProposalsQuery } from '../proposals/proposals/__generated__/Proposals';
 import {
@@ -0,0 +1 @@
+export { ProposalDescription } from './proposal-description';
@@ -0,0 +1,51 @@
+import ReactMarkdown from 'react-markdown';
+import classnames from 'classnames';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Icon, RoundedWrapper } from '@vegaprotocol/ui-toolkit';
+import { SubHeading } from '../../../../components/heading';
+
+export const ProposalDescription = ({
+  description,
+}: {
+  description: string;
+}) => {
+  const { t } = useTranslation();
+  const [showDescription, setShowDescription] = useState(false);
+  const showDescriptionIconClasses = classnames('mb-4', {
+    'rotate-180': showDescription,
+  });
+
+  return (
+    <section data-testid="proposal-description">
+      <button
+        onClick={() => setShowDescription(!showDescription)}
+        data-testid="proposal-description-toggle"
+      >
+        <div className="flex items-center gap-3">
+          <SubHeading title={t('proposalDescription')} />
+          <div className={showDescriptionIconClasses}>
+            <Icon name="chevron-down" size={8} />
+          </div>
+        </div>
+      </button>
+
+      {showDescription && (
+        <RoundedWrapper paddingBottom={true} marginBottomLarge={true}>
+          <div className="p-2">
+            <ReactMarkdown
+              className="react-markdown-container"
+              /* Prevents HTML embedded in the description from rendering */
+              skipHtml={true}
+              /* Stops users embedding images which could be used for tracking  */
+              disallowedElements={['img']}
+              linkTarget="_blank"
+            >
+              {description}
+            </ReactMarkdown>
+          </div>
+        </RoundedWrapper>
+      )}
+    </section>
+  );
+};
@@ -206,28 +206,6 @@ describe('Proposal header', () => {
    ).not.toBeInTheDocument();
  });

-  it('Renders Freeform proposal - long rationale (105 chars) - details', () => {
-    renderComponent(
-      generateProposal({
-        id: 'long',
-        rationale: {
-          title: '0x0',
-          description:
-            'Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean dolor.',
-        },
-        terms: {
-          change: {
-            __typename: 'NewFreeform',
-          },
-        },
-      }),
-      false
-    );
-    expect(screen.getByTestId('proposal-description')).toHaveTextContent(
-      /Class aptent/
-    );
-  });
-
  // Remove once proposals have rationale and re-enable above tests
  it('Renders Freeform proposal - id for title', () => {
    renderComponent(
@@ -5,7 +5,6 @@ import { Heading, SubHeading } from '../../../../components/heading';
 import type { ReactNode } from 'react';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
-import ReactMarkdown from 'react-markdown';
 import { truncateMiddle } from '../../../../lib/truncate-middle';
 import { CurrentProposalState } from '../current-proposal-state';
 import { ProposalInfoLabel } from '../proposal-info-label';
@@ -23,12 +22,7 @@ export const ProposalHeader = ({
  let details: ReactNode;
  let proposalType = '';

-  let title = proposal?.rationale.title.trim();
-  let description = proposal?.rationale.description.trim();
-  if (title?.length === 0 && description && description.length > 0) {
-    title = description;
-    description = '';
-  }
+  const title = proposal?.rationale.title.trim();

  const titleContent = shorten(title ?? '', 100);

@@ -145,23 +139,6 @@ export const ProposalHeader = ({
          {details}
        </div>
      )}
-
-      {description && !isListItem && (
-        <div data-testid="proposal-description">
-          {/*<div className="uppercase mr-2">{t('ProposalDescription')}:</div>*/}
-          <SubHeading title={t('ProposalDescription')} />
-          <ReactMarkdown
-            className="react-markdown-container"
-            /* Prevents HTML embedded in the description from rendering */
-            skipHtml={true}
-            /* Stops users embedding images which could be used for tracking  */
-            disallowedElements={['img']}
-            linkTarget="_blank"
-          >
-            {description}
-          </ReactMarkdown>
-        </div>
-      )}
    </>
  );
 };
@@ -0,0 +1 @@
+export { ProposalJson } from './proposal-json';
@@ -1,15 +1,15 @@
+import classnames from 'classnames';
+import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Icon, SyntaxHighlighter } from '@vegaprotocol/ui-toolkit';
 import { SubHeading } from '../../../../components/heading';
-import type { PartialDeep } from 'type-fest';
-import type * as Schema from '@vegaprotocol/types';
-import { useState } from 'react';
-import classnames from 'classnames';
+import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
+import type { ProposalQuery } from '../../proposal/__generated__/Proposal';

-export const ProposalTermsJson = ({
-  terms,
+export const ProposalJson = ({
+  proposal,
 }: {
-  terms: PartialDeep<Schema.ProposalTerms>;
+  proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
 }) => {
  const { t } = useTranslation();
  const [showDetails, setShowDetails] = useState(false);
@@ -18,20 +18,20 @@ export const ProposalTermsJson = ({
  });

  return (
-    <section>
+    <section data-testid="proposal-json">
      <button
        onClick={() => setShowDetails(!showDetails)}
-        data-testid="proposal-terms-toggle"
+        data-testid="proposal-json-toggle"
      >
        <div className="flex items-center gap-3">
-          <SubHeading title={t('proposalTerms')} />
+          <SubHeading title={t('proposalJson')} />
          <div className={showDetailsIconClasses}>
            <Icon name="chevron-down" size={8} />
          </div>
        </div>
      </button>

-      {showDetails && <SyntaxHighlighter data={terms} />}
+      {showDetails && <SyntaxHighlighter data={proposal} />}
    </section>
  );
 };
@@ -1 +0,0 @@
-export { ProposalTermsJson } from './proposal-terms-json';
@@ -0,0 +1 @@
+export { ProposalTerms } from './proposal-terms';
@@ -0,0 +1,142 @@
+import {
+  RoundedWrapper,
+  KeyValueTable,
+  KeyValueTableRow,
+  Icon,
+} from '@vegaprotocol/ui-toolkit';
+import { BigNumber } from '../../../../lib/bignumber';
+import { SubHeading } from '../../../../components/heading';
+import { useTranslation } from 'react-i18next';
+import { useState } from 'react';
+import classnames from 'classnames';
+
+interface ProposalTermsProps {
+  data: Record<string, unknown>;
+}
+
+const getParsedValue = (value: unknown) => {
+  if (typeof value === 'string') {
+    try {
+      // Check if value is a number string - if so use bignumber to maintain precision
+      if (/^\d+(\.\d+)?$/.test(value)) {
+        return new BigNumber(value).toString();
+      } else {
+        // This would convert, for example, a JSON object ('{"key":"value"}')
+        // into an actual JS object ({key: "value"})
+        return JSON.parse(value);
+      }
+    } catch (error) {
+      return value;
+    }
+  } else {
+    return value;
+  }
+};
+
+const RenderKeyValue = ({
+  title,
+  value,
+}: {
+  title: string;
+  value: string | number;
+}) => (
+  <KeyValueTable>
+    <KeyValueTableRow>
+      {title}
+      {value}
+    </KeyValueTableRow>
+  </KeyValueTable>
+);
+
+const RenderArray = ({ title, array }: { title: string; array: unknown[] }) => {
+  if (array.every((item) => typeof item === 'string')) {
+    return <RenderKeyValue title={title} value={array.join(', ')} />;
+  } else {
+    return (
+      <div>
+        <div className="mb-2">{title}</div>
+        {array.map((item, index) => (
+          <div key={index}>
+            <ProposalTermsRenderer data={item as Record<string, unknown>} />
+          </div>
+        ))}
+      </div>
+    );
+  }
+};
+
+// Working with 'unknown' type as a proposal's terms can be in many shapes
+const RenderTerm = ({ title, value }: { title: string; value: unknown }) => {
+  const parsedValue = getParsedValue(value);
+
+  if (parsedValue === null || typeof parsedValue === 'boolean') {
+    return <RenderKeyValue title={title} value={String(parsedValue)} />;
+  } else if (
+    typeof parsedValue === 'string' ||
+    typeof parsedValue === 'number'
+  ) {
+    return <RenderKeyValue title={title} value={parsedValue} />;
+  } else if (typeof parsedValue === 'object') {
+    if (Array.isArray(parsedValue)) {
+      return <RenderArray title={title} array={parsedValue} />;
+    } else {
+      return (
+        <div>
+          <div className="my-2">{title}</div>
+          <ProposalTermsRenderer
+            data={parsedValue as Record<string, unknown>}
+          />
+        </div>
+      );
+    }
+  } else if (parsedValue === undefined) {
+    return <span>{'undefined'}</span>;
+  } else {
+    return <span>{String(parsedValue)}</span>;
+  }
+};
+
+const ProposalTermsRenderer = ({ data }: ProposalTermsProps) => {
+  return (
+    <RoundedWrapper paddingBottom={true}>
+      {Object.keys(data)
+        .filter(
+          (key) =>
+            !['__typename', 'closingDatetime', 'enactmentDatetime'].includes(
+              key
+            )
+        )
+        .map((key, index) => (
+          <div key={index}>
+            <RenderTerm title={key} value={data[key]} />
+          </div>
+        ))}
+    </RoundedWrapper>
+  );
+};
+
+export const ProposalTerms = ({ data }: ProposalTermsProps) => {
+  const { t } = useTranslation();
+  const [showTerms, setShowTerms] = useState(false);
+  const showTermsIconClasses = classnames('mb-4', {
+    'rotate-180': showTerms,
+  });
+
+  return (
+    <section data-testid="proposal-terms">
+      <button
+        onClick={() => setShowTerms(!showTerms)}
+        data-testid="proposal-terms-toggle"
+      >
+        <div className="flex items-center gap-3">
+          <SubHeading title={t('proposalDetails')} />
+          <div className={showTermsIconClasses}>
+            <Icon name="chevron-down" size={8} />
+          </div>
+        </div>
+      </button>
+
+      {showTerms && <ProposalTermsRenderer data={data} />}
+    </section>
+  );
+};
@@ -25,8 +25,11 @@ jest.mock('../proposal-detail-header/proposal-header', () => ({
 jest.mock('../proposal-change-table', () => ({
  ProposalChangeTable: () => <div data-testid="proposal-change-table"></div>,
 }));
-jest.mock('../proposal-terms-json', () => ({
-  ProposalTermsJson: () => <div data-testid="proposal-terms-json"></div>,
+jest.mock('../proposal-json', () => ({
+  ProposalJson: () => <div data-testid="proposal-json"></div>,
+}));
+jest.mock('../proposal-terms/proposal-terms', () => ({
+  ProposalTerms: () => <div data-testid="proposal-terms"></div>,
 }));
 jest.mock('../proposal-votes-table', () => ({
  ProposalVotesTable: () => <div data-testid="proposal-votes-table"></div>,
@@ -49,7 +52,8 @@ it('renders each section', async () => {
  render(<Proposal proposal={proposal as ProposalQuery['proposal']} />);
  expect(await screen.findByTestId('proposal-header')).toBeInTheDocument();
  expect(screen.getByTestId('proposal-change-table')).toBeInTheDocument();
-  expect(screen.getByTestId('proposal-terms-json')).toBeInTheDocument();
+  expect(screen.getByTestId('proposal-json')).toBeInTheDocument();
+  expect(screen.getByTestId('proposal-terms')).toBeInTheDocument();
  expect(screen.getByTestId('proposal-votes-table')).toBeInTheDocument();
  expect(screen.getByTestId('proposal-vote-details')).toBeInTheDocument();
  expect(screen.queryByTestId('proposal-list-asset')).not.toBeInTheDocument();
@@ -6,8 +6,10 @@ import { AsyncRenderer, RoundedWrapper } from '@vegaprotocol/ui-toolkit';
 import { ProposalHeader } from '../proposal-detail-header/proposal-header';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import { ProposalDescription } from '../proposal-description';
 import { ProposalChangeTable } from '../proposal-change-table';
-import { ProposalTermsJson } from '../proposal-terms-json';
+import { ProposalJson } from '../proposal-json';
+import { ProposalTerms } from '../proposal-terms';
 import { ProposalVotesTable } from '../proposal-votes-table';
 import { VoteDetails } from '../vote-details';
 import { ListAsset } from '../list-asset';
@@ -20,7 +22,7 @@ export enum ProposalType {
  PROPOSAL_NETWORK_PARAMETER = 'PROPOSAL_NETWORK_PARAMETER',
  PROPOSAL_FREEFORM = 'PROPOSAL_FREEFORM',
 }
-interface ProposalProps {
+export interface ProposalProps {
  proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
 }

@@ -78,9 +80,11 @@ export const Proposal = ({ proposal }: ProposalProps) => {
    <AsyncRenderer data={params} loading={loading} error={error}>
      <section data-testid="proposal">
        <ProposalHeader proposal={proposal} isListItem={false} />
+
        <div className="my-10">
          <ProposalChangeTable proposal={proposal} />
        </div>
+
        {proposal.terms.change.__typename === 'NewAsset' &&
        proposal.terms.change.source.__typename === 'ERC20' &&
        proposal.id ? (
@@ -90,7 +94,20 @@ export const Proposal = ({ proposal }: ProposalProps) => {
            lifetimeLimit={proposal.terms.change.source.lifetimeLimit}
          />
        ) : null}
-        <div className="mb-12">
+
+        <div className="mb-4">
+          <ProposalDescription description={proposal.rationale.description} />
+        </div>
+
+        <div className="mb-4">
+          <ProposalTerms data={proposal.terms} />
+        </div>
+
+        <div className="mb-6">
+          <ProposalJson proposal={proposal} />
+        </div>
+
+        <div className="mb-10">
          <RoundedWrapper paddingBottom={true}>
            <VoteDetails
              proposal={proposal}
@@ -102,10 +119,10 @@ export const Proposal = ({ proposal }: ProposalProps) => {
            />
          </RoundedWrapper>
        </div>
+
        <div className="mb-4">
          <ProposalVotesTable proposal={proposal} proposalType={proposalType} />
        </div>
-        <ProposalTermsJson terms={proposal.terms} />
      </section>
    </AsyncRenderer>
  );
@@ -8,12 +8,11 @@ import { ProposalsListFilter } from '../proposals-list-filter';
 import Routes from '../../../routes';
 import { Button, VegaIcon, VegaIconNames } from '@vegaprotocol/ui-toolkit';
 import { Link } from 'react-router-dom';
-import { createDocsLinks, ExternalLinks } from '@vegaprotocol/utils';
 import { ExternalLink } from '@vegaprotocol/ui-toolkit';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProtocolUpgradeProposalFieldsFragment } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { DocsLinks, ExternalLinks } from '@vegaprotocol/environment';

 interface ProposalsListProps {
  proposals: Array<ProposalFieldsFragment | ProposalQuery['proposal']>;
@@ -36,7 +35,6 @@ export const ProposalsList = ({
  protocolUpgradeProposals,
  lastBlockHeight,
 }: ProposalsListProps) => {
-  const { VEGA_DOCS_URL } = useEnvironment();
  const { t } = useTranslation();
  const [filterString, setFilterString] = useState('');
  const sortedProposals = proposals.reduce(
@@ -83,9 +81,9 @@ export const ProposalsList = ({
          marginBottom={false}
          title={t('pageTitleProposals')}
        />
-        {VEGA_DOCS_URL && (
+        {DocsLinks && (
          <div className="xs:justify-self-end" data-testid="new-proposal-link">
-            <ExternalLink href={createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}>
+            <ExternalLink href={DocsLinks.PROPOSALS_GUIDE}>
              <Button variant="primary" size="sm">
                <div className="flex items-center gap-1">
                  {t('NewProposal')}
@@ -2,9 +2,10 @@ import { render, screen } from '@testing-library/react';
 import { ProposalFormTerms } from './proposal-form-terms';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const renderComponent = () => {
@@ -5,8 +5,7 @@ import {
  ExternalLink,
  TextArea,
 } from '@vegaprotocol/ui-toolkit';
-import { createDocsLinks } from '@vegaprotocol/utils';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { DocsLinks } from '@vegaprotocol/environment';
 import type { UseFormRegisterReturn } from 'react-hook-form';

 interface ProposalFormTermsProps {
@@ -22,23 +21,20 @@ export const ProposalFormTerms = ({
  labelOverride,
  docsLink,
 }: ProposalFormTermsProps) => {
-  const { VEGA_DOCS_URL } = useEnvironment();
  const { t } = useTranslation();
  return (
    <FormGroup
      label={labelOverride || t('ProposalTerms')}
      labelFor="proposal-terms"
    >
-      {docsLink && VEGA_DOCS_URL && (
+      {docsLink && DocsLinks && (
        <div className="mt-[-4px] mb-2 text-sm font-light">
          <span className="mr-1">{t('ProposalTermsText')}</span>
          <ExternalLink
-            href={`${
-              createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-            }${docsLink}`}
+            href={`${DocsLinks.PROPOSALS_GUIDE}${docsLink}`}
            target="_blank"
          >
-            {`${createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}${docsLink}`}
+            {`${DocsLinks.PROPOSALS_GUIDE}${docsLink}`}
          </ExternalLink>
        </div>
      )}
@@ -10,9 +10,10 @@ import type { MockedResponse } from '@apollo/client/testing';
 import { NetworkParamsDocument } from '@vegaprotocol/network-parameters';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const updateMarketNetworkParamsQueryMock: MockedResponse<NetworkParamsQuery> = {
@@ -5,7 +5,7 @@ import {
  useProposalSubmit,
  deadlineToRoundedHours,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
 import {
  ProposalFormDescription,
  ProposalFormSubheader,
@@ -17,7 +17,6 @@ import {
 import { ProposalMinRequirements } from '../../components/shared';
 import { AsyncRenderer, ExternalLink } from '@vegaprotocol/ui-toolkit';
 import { Heading } from '../../../../components/heading';
-import { createDocsLinks } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -42,7 +41,7 @@ export const ProposeFreeform = () => {
    NetworkParams.governance_proposal_freeform_minProposerBalance,
    NetworkParams.spam_protection_proposal_min_tokens,
  ]);
-  const { VEGA_DOCS_URL, VEGA_EXPLORER_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -111,17 +110,13 @@ export const ProposeFreeform = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -10,9 +10,10 @@ import { NetworkParamsDocument } from '@vegaprotocol/network-parameters';
 import type { MockedResponse } from '@apollo/client/testing';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const updateMarketNetworkParamsQueryMock: MockedResponse<NetworkParamsQuery> = {
@@ -1,10 +1,7 @@
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useForm } from 'react-hook-form';
-import {
-  createDocsLinks,
-  suitableForSyntaxHighlighter,
-} from '@vegaprotocol/utils';
+import { suitableForSyntaxHighlighter } from '@vegaprotocol/utils';
 import { useNetworkParams } from '@vegaprotocol/network-parameters';
 import {
  getClosingTimestamp,
@@ -12,7 +9,7 @@ import {
  useProposalSubmit,
  doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
 import {
  ProposalFormDescription,
  ProposalFormSubheader,
@@ -84,7 +81,7 @@ export const ProposeNetworkParameter = () => {
    loading: networkParamsLoading,
    error: networkParamsError,
  } = useNetworkParams();
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -175,17 +172,13 @@ export const ProposeNetworkParameter = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -10,9 +10,10 @@ import type { MockedResponse } from '@apollo/client/testing';
 import { NetworkParamsDocument } from '@vegaprotocol/network-parameters';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const newAssetNetworkParamsQueryMock: MockedResponse<NetworkParamsQuery> = {
@@ -7,8 +7,8 @@ import {
  useProposalSubmit,
  doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { createDocsLinks, validateJson } from '@vegaprotocol/utils';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
+import { validateJson } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -53,7 +53,7 @@ export const ProposeNewAsset = () => {
    NetworkParams.governance_proposal_asset_minProposerBalance,
    NetworkParams.spam_protection_proposal_min_tokens,
  ]);
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -142,17 +142,13 @@ export const ProposeNewAsset = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -10,9 +10,10 @@ import type { NetworkParamsQuery } from '@vegaprotocol/network-parameters';
 import { NetworkParamsDocument } from '@vegaprotocol/network-parameters';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const newMarketNetworkParamsQueryMock: MockedResponse<NetworkParamsQuery> = {
@@ -6,8 +6,8 @@ import {
  useProposalSubmit,
  doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { createDocsLinks, validateJson } from '@vegaprotocol/utils';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
+import { validateJson } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -51,7 +51,7 @@ export const ProposeNewMarket = () => {
    NetworkParams.governance_proposal_market_minProposerBalance,
    NetworkParams.spam_protection_proposal_min_tokens,
  ]);
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -132,17 +132,13 @@ export const ProposeNewMarket = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -2,12 +2,11 @@ import Routes from '../../routes';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 import { ExternalLink } from '@vegaprotocol/ui-toolkit';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
 import { Heading } from '../../../components/heading';
-import { createDocsLinks } from '@vegaprotocol/utils';

 export const Propose = () => {
-  const { VEGA_DOCS_URL, VEGA_EXPLORER_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();

  return (
@@ -15,14 +14,11 @@ export const Propose = () => {
      <section className="pb-6">
        <Heading title={t('NewProposal')} />
        <div className="text-sm">
-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p>
              <span className="mr-1">{t('ProposalTermsText')}</span>
-              <ExternalLink
-                href={createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}
-                target="_blank"
-              >
-                {createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}
+              <ExternalLink href={DocsLinks.PROPOSALS_GUIDE} target="_blank">
+                {DocsLinks.PROPOSALS_GUIDE}
              </ExternalLink>
            </p>
          )}
@@ -1,6 +1,6 @@
 import { useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
 import { Heading } from '../../../../components/heading';
 import {
  AsyncRenderer,
@@ -9,7 +9,7 @@ import {
  InputError,
  TextArea,
 } from '@vegaprotocol/ui-toolkit';
-import { createDocsLinks, validateJson } from '@vegaprotocol/utils';
+import { validateJson } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -39,7 +39,7 @@ export const ProposeRaw = () => {
    NetworkParams.governance_proposal_freeform_minProposerBalance,
    NetworkParams.spam_protection_proposal_min_tokens,
  ]);
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -79,14 +79,11 @@ export const ProposeRaw = () => {
            spamProtectionMin={params.spam_protection_proposal_min_tokens}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
-              <ExternalLink
-                href={createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}
-                target="_blank"
-              >
-                {createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE}
+              <ExternalLink href={DocsLinks.PROPOSALS_GUIDE} target="_blank">
+                {DocsLinks.PROPOSALS_GUIDE}
              </ExternalLink>
            </p>
          )}
@@ -10,9 +10,10 @@ import type { MockedResponse } from '@apollo/client/testing';
 import { NetworkParamsDocument } from '@vegaprotocol/network-parameters';

 jest.mock('@vegaprotocol/environment', () => ({
-  useEnvironment: () => ({
-    VEGA_DOCS_URL: 'https://docs.vega.xyz',
-  }),
+  ...jest.requireActual('@vegaprotocol/environment'),
+  DocsLinks: {
+    PROPOSALS_GUIDE: 'https://docs.vega.xyz/tutorials/proposals',
+  },
 }));

 const updateAssetNetworkParamsQueryMock: MockedResponse<NetworkParamsQuery> = {
@@ -6,8 +6,8 @@ import {
  useProposalSubmit,
  doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { createDocsLinks, validateJson } from '@vegaprotocol/utils';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
+import { validateJson } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -51,7 +51,7 @@ export const ProposeUpdateAsset = () => {
    NetworkParams.governance_proposal_updateAsset_minProposerBalance,
    NetworkParams.spam_protection_proposal_min_tokens,
  ]);
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -132,17 +132,13 @@ export const ProposeUpdateAsset = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -7,8 +7,8 @@ import {
  getEnactmentTimestamp,
  useProposalSubmit,
 } from '@vegaprotocol/proposals';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { createDocsLinks, validateJson } from '@vegaprotocol/utils';
+import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
+import { validateJson } from '@vegaprotocol/utils';
 import {
  NetworkParams,
  useNetworkParams,
@@ -98,7 +98,7 @@ export const ProposeUpdateMarket = () => {
  const [selectedMarket, setSelectedMarket] = useState<string | undefined>(
    undefined
  );
-  const { VEGA_EXPLORER_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { VEGA_EXPLORER_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    register,
@@ -181,17 +181,13 @@ export const ProposeUpdateMarket = () => {
            userAction={ProposalUserAction.CREATE}
          />

-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <p className="text-sm" data-testid="proposal-docs-link">
              <span className="mr-1">{t('ProposalTermsText')}</span>
              <ExternalLink
-                href={`${
-                  createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-                }${DOCS_LINK}`}
+                href={`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}
                target="_blank"
-              >{`${
-                createDocsLinks(VEGA_DOCS_URL).PROPOSALS_GUIDE
-              }${DOCS_LINK}`}</ExternalLink>
+              >{`${DocsLinks.PROPOSALS_GUIDE}${DOCS_LINK}`}</ExternalLink>
            </p>
          )}

@@ -11,7 +11,6 @@ import {
  ExternalLink,
 } from '@vegaprotocol/ui-toolkit';
 import { useVegaWallet } from '@vegaprotocol/wallet';
-import { createDocsLinks } from '@vegaprotocol/utils';
 import {
  useNetworkParams,
  NetworkParams,
@@ -21,7 +20,7 @@ import { EpochCountdown } from '../../../components/epoch-countdown';
 import { Heading, SubHeading } from '../../../components/heading';
 import { EpochIndividualRewards } from '../epoch-individual-rewards/epoch-individual-rewards';
 import { useRefreshAfterEpoch } from '../../../hooks/use-refresh-after-epoch';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { DocsLinks } from '@vegaprotocol/environment';
 import { ConnectToSeeRewards } from '../connect-to-see-rewards';
 import { EpochTotalRewards } from '../epoch-total-rewards/epoch-total-rewards';

@@ -29,7 +28,6 @@ type RewardsView = 'total' | 'individual';

 export const RewardsPage = () => {
  const { t } = useTranslation();
-  const { VEGA_DOCS_URL } = useEnvironment();
  const { pubKey, pubKeys } = useVegaWallet();
  const [toggleRewardsView, setToggleRewardsView] =
    useState<RewardsView>('total');
@@ -68,9 +66,9 @@ export const RewardsPage = () => {
          <Heading title={t('pageTitleRewards')} />
          <p className="mb-12">
            {t('rewardsIntro')}{' '}
-            {VEGA_DOCS_URL && (
+            {DocsLinks && (
              <ExternalLink
-                href={createDocsLinks(VEGA_DOCS_URL).REWARDS_GUIDE}
+                href={DocsLinks.REWARDS_GUIDE}
                target="_blank"
                data-testid="rewards-guide-link"
                className="text-white"
@@ -229,7 +229,7 @@ const redirects = [
 const routerConfig = [
  {
    path: Routes.HOME,
-    element: <LazyHome name="Token" />,
+    element: <LazyHome name="Home" />,
  },
  {
    path: Routes.PROPOSALS,
@@ -291,7 +291,7 @@ const routerConfig = [
    // Not lazy as loaded when a user first hits the site
    children: [
      {
-        element: <Home name="Home" />,
+        element: <Home name="Token" />,
        index: true,
      },
      {
@@ -325,8 +325,11 @@ const routerConfig = [
          },
        ],
      },
-      { path: 'associate', element: <LazyStakingAssociate /> },
-      { path: 'disassociate', element: <LazyStakingDisassociate /> },
+      { path: 'associate', element: <LazyStakingAssociate name="Associate" /> },
+      {
+        path: 'disassociate',
+        element: <LazyStakingDisassociate name="Disassociate" />,
+      },
    ],
  },
  {
@@ -1,12 +1,14 @@
 import { useEthereumConfig } from '@vegaprotocol/web3';
-import { StakingWalletsContainer } from './components/staking-wallets-container/staking-wallets-container';
+import { StakingWalletsContainer } from './components/staking-wallets-container';
 import { AssociatePage } from './associate-page';
 import { AssociatePageNoVega } from './associate-page-no-vega';
 import { Heading } from '../../../components/heading';
-import React from 'react';
 import { useTranslation } from 'react-i18next';
+import { useDocumentTitle } from '../../../hooks/use-document-title';
+import type { RouteChildProps } from '../../index';

-export const AssociateContainer = () => {
+export const AssociateContainer = ({ name }: RouteChildProps) => {
+  useDocumentTitle(name);
  const { t } = useTranslation();
  const { config } = useEthereumConfig();

@@ -39,7 +39,7 @@ jest.mock('@vegaprotocol/wallet', () => ({
 }));

 const renderComponent = () => {
-  return render(<Disassociate />);
+  return render(<Disassociate name="Disassociate" />);
 };

 describe('Disassociate', () => {
@@ -3,10 +3,12 @@ import { useWeb3React } from '@web3-react/core';
 import { EthConnectPrompt } from '../../../components/eth-connect-prompt';
 import { DisassociatePage } from './components/disassociate-page';
 import { Heading } from '../../../components/heading';
-import React from 'react';
 import { useTranslation } from 'react-i18next';
+import { useDocumentTitle } from '../../../hooks/use-document-title';
+import type { RouteChildProps } from '../../index';

-export const DisassociateContainer = () => {
+export const DisassociateContainer = ({ name }: RouteChildProps) => {
+  useDocumentTitle(name);
  const { t } = useTranslation();
  const { account } = useWeb3React();
  const { pubKey } = useVegaWallet();
@@ -1,14 +1,12 @@
 import { useTranslation } from 'react-i18next';
 import { EpochData } from './epoch-data';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { DocsLinks } from '@vegaprotocol/environment';
 import { ExternalLink } from '@vegaprotocol/ui-toolkit';
-import { createDocsLinks } from '@vegaprotocol/utils';
 import { Heading } from '../../../components/heading';
 import React from 'react';

 export const Staking = () => {
  const { t } = useTranslation();
-  const { VEGA_DOCS_URL } = useEnvironment();

  return (
    <>
@@ -16,9 +14,9 @@ export const Staking = () => {
      <section>
        <p className="mb-12">
          {t('stakingIntro')}{' '}
-          {VEGA_DOCS_URL && (
+          {DocsLinks && (
            <ExternalLink
-              href={createDocsLinks(VEGA_DOCS_URL).STAKING_GUIDE}
+              href={DocsLinks.STAKING_GUIDE}
              target="_blank"
              data-testid="staking-guide-link"
              className="text-white"
@@ -131,20 +131,25 @@ export const ConsensusValidatorsTable = ({

  const gridRef = useRef<AgGridReact | null>(null);

+  const thirdOfTotalStake = useMemo(
+    () => new BigNumber(totalStake).dividedBy(3),
+    [totalStake]
+  );
+
  const nodes = useMemo(() => {
    if (!data) return [];
    let canonisedNodes = data
      .sort((a, b) => {
-        const aVotingPower = new BigNumber(a.rankingScore.votingPower);
-        const bVotingPower = new BigNumber(b.rankingScore.votingPower);
-        return bVotingPower.minus(aVotingPower).toNumber();
+        const aStakedTotal = new BigNumber(a.stakedTotal);
+        const bStakedTotal = new BigNumber(b.stakedTotal);
+        return bStakedTotal.minus(aStakedTotal).toNumber();
      })
      .map((node, index) => {
-        const votingPowerRanking = index + 1;
+        const stakedTotalRanking = index + 1;

        return {
          ...node,
-          votingPowerRanking,
+          stakedTotalRanking,
        };
      })
      .map(
@@ -157,7 +162,7 @@ export const ConsensusValidatorsTable = ({
          stakedTotal,
          rankingScore: { stakeScore, votingPower },
          pendingStake,
-          votingPowerRanking,
+          stakedTotalRanking,
          stakedByUser,
          pendingUserStake,
          userStakeShare,
@@ -175,7 +180,7 @@ export const ConsensusValidatorsTable = ({

          return {
            id,
-            [ValidatorFields.RANKING_INDEX]: votingPowerRanking,
+            [ValidatorFields.RANKING_INDEX]: stakedTotalRanking,
            [ValidatorFields.VALIDATOR]: {
              avatarUrl: logo,
              name,
@@ -236,16 +241,12 @@ export const ConsensusValidatorsTable = ({
      return canonisedNodes;
    }

-    // The point of identifying and hiding the group that could halt the network
-    // is that we assume the top 1/3 of stake is held by considerably less than
-    // 1/3 of the validators and we really want people not to stake any more to
-    // that group, because we want to make it require as many difference
-    // validators to collude as possible to halt the network, so we hide them.
    const { topThird, remaining } = canonisedNodes.reduce(
      (acc, node) => {
-        if (acc.cumulativeScore < 100 / 3) {
-          acc.cumulativeScore += parseFloat(
-            node[ValidatorFields.NORMALISED_VOTING_POWER]
+        if (acc.cumulativeScore.isLessThan(thirdOfTotalStake)) {
+          const prev = acc.cumulativeScore;
+          acc.cumulativeScore = prev.plus(
+            new BigNumber(node[ValidatorFields.STAKE])
          );
          acc.topThird.push(node);
          return acc;
@@ -253,61 +254,70 @@ export const ConsensusValidatorsTable = ({
        acc.remaining.push(node);
        return acc;
      },
-      { topThird: [], remaining: [], cumulativeScore: 0 } as {
+      { topThird: [], remaining: [], cumulativeScore: new BigNumber(0) } as {
        topThird: CanonisedConsensusNodeProps[];
        remaining: CanonisedConsensusNodeProps[];
-        cumulativeScore: number;
+        cumulativeScore: BigNumber;
      }
    );

    // We need to combine the top third of validators into a single node, this
    // way the combined values can be passed to AG grid so that the combined cell's
    // values are correct for ordering.
-    const combinedTopThird = topThird.reduce((acc, node) => {
-      const {
-        [ValidatorFields.STAKE]: stake,
-        [ValidatorFields.STAKE_SHARE]: stakeShare,
-        [ValidatorFields.PENDING_STAKE]: pendingStake,
-        [ValidatorFields.NORMALISED_VOTING_POWER]: normalisedVotingPower,
-        [ValidatorFields.TOTAL_PENALTIES]: totalPenalties,
-      } = node;
+    const combinedTopThird = topThird.reduce(
+      (acc, node) => {
+        const {
+          [ValidatorFields.STAKE]: stake,
+          [ValidatorFields.STAKE_SHARE]: stakeShare,
+          [ValidatorFields.PENDING_STAKE]: pendingStake,
+          [ValidatorFields.NORMALISED_VOTING_POWER]: normalisedVotingPower,
+          [ValidatorFields.TOTAL_PENALTIES]: totalPenalties,
+        } = node;

-      const {
-        [ValidatorFields.STAKE]: accStake,
-        [ValidatorFields.STAKE_SHARE]: accStakeShare,
-        [ValidatorFields.PENDING_STAKE]: accPendingStake,
-        [ValidatorFields.NORMALISED_VOTING_POWER]: accNormalisedVotingPower,
-        [ValidatorFields.TOTAL_PENALTIES]: accTotalPenalties,
-      } = acc;
+        const {
+          [ValidatorFields.STAKE]: accStake,
+          [ValidatorFields.STAKE_SHARE]: accStakeShare,
+          [ValidatorFields.PENDING_STAKE]: accPendingStake,
+          [ValidatorFields.NORMALISED_VOTING_POWER]: accNormalisedVotingPower,
+          [ValidatorFields.TOTAL_PENALTIES]: accTotalPenalties,
+        } = acc;

-      return {
-        ...acc,
-        [ValidatorFields.STAKE]: toBigNum(accStake, decimals)
-          .plus(toBigNum(stake, decimals))
-          .toString(),
-        [ValidatorFields.STAKE_SHARE]: formatNumberPercentage(
-          new BigNumber(parseFloat(accStakeShare)).plus(
-            new BigNumber(parseFloat(stakeShare))
+        return {
+          ...acc,
+          [ValidatorFields.STAKE]: new BigNumber(accStake)
+            .plus(new BigNumber(stake))
+            .toString(),
+          [ValidatorFields.STAKE_SHARE]: formatNumberPercentage(
+            new BigNumber(parseFloat(accStakeShare)).plus(
+              new BigNumber(parseFloat(stakeShare))
+            ),
+            2
          ),
-          2
-        ),
-        [ValidatorFields.PENDING_STAKE]: toBigNum(accPendingStake, decimals)
-          .plus(toBigNum(pendingStake, decimals))
-          .toString(),
-        [ValidatorFields.NORMALISED_VOTING_POWER]: formatNumberPercentage(
-          new BigNumber(parseFloat(accNormalisedVotingPower)).plus(
-            new BigNumber(parseFloat(normalisedVotingPower))
+          [ValidatorFields.PENDING_STAKE]: toBigNum(accPendingStake, decimals)
+            .plus(toBigNum(pendingStake, decimals))
+            .toString(),
+          [ValidatorFields.NORMALISED_VOTING_POWER]: formatNumberPercentage(
+            new BigNumber(parseFloat(accNormalisedVotingPower)).plus(
+              new BigNumber(parseFloat(normalisedVotingPower))
+            ),
+            2
          ),
-          2
-        ),
-        [ValidatorFields.TOTAL_PENALTIES]: formatNumberPercentage(
-          new BigNumber(parseFloat(accTotalPenalties)).plus(
-            new BigNumber(parseFloat(totalPenalties))
+          [ValidatorFields.TOTAL_PENALTIES]: formatNumberPercentage(
+            new BigNumber(parseFloat(accTotalPenalties)).plus(
+              new BigNumber(parseFloat(totalPenalties))
+            ),
+            2
          ),
-          2
-        ),
-      };
-    });
+        };
+      },
+      {
+        [ValidatorFields.STAKE]: '0',
+        [ValidatorFields.STAKE_SHARE]: '0',
+        [ValidatorFields.PENDING_STAKE]: '0',
+        [ValidatorFields.NORMALISED_VOTING_POWER]: '0',
+        [ValidatorFields.TOTAL_PENALTIES]: '0',
+      }
+    );

    return [
      {
@@ -322,6 +332,7 @@ export const ConsensusValidatorsTable = ({
    decimals,
    hideTopThird,
    previousEpochData,
+    thirdOfTotalStake,
    totalStake,
    validatorsView,
  ]);
@@ -352,6 +363,7 @@ export const ConsensusValidatorsTable = ({
          headerTooltip: t('StakeDescription').toString(),
          cellRenderer: TotalStakeRenderer,
          width: 120,
+          sort: 'desc',
        },
        {
          field: ValidatorFields.PENDING_STAKE,
@@ -373,7 +385,6 @@ export const ConsensusValidatorsTable = ({
          headerTooltip: t('NormalisedVotingPowerDescription').toString(),
          cellRenderer: VotingPowerRenderer,
          width: 200,
-          sort: 'desc',
        },
        {
          field: ValidatorFields.TOTAL_PENALTIES,
@@ -57,16 +57,16 @@ export const StandbyPendingValidatorsTable = ({

    return data
      .sort((a, b) => {
-        const aVotingPower = new BigNumber(a.rankingScore.votingPower);
-        const bVotingPower = new BigNumber(b.rankingScore.votingPower);
-        return bVotingPower.minus(aVotingPower).toNumber();
+        const aStakedTotal = new BigNumber(a.stakedTotal);
+        const bStakedTotal = new BigNumber(b.stakedTotal);
+        return bStakedTotal.minus(aStakedTotal).toNumber();
      })
      .map((node, index) => {
-        const votingPowerRanking = index + 1;
+        const stakedTotalRanking = index + 1;

        return {
          ...node,
-          votingPowerRanking,
+          stakedTotalRanking,
        };
      })
      .map(
@@ -79,7 +79,7 @@ export const StandbyPendingValidatorsTable = ({
          stakedTotal,
          rankingScore: { stakeScore },
          pendingStake,
-          votingPowerRanking,
+          stakedTotalRanking,
          stakedByUser,
          pendingUserStake,
          userStakeShare,
@@ -125,7 +125,7 @@ export const StandbyPendingValidatorsTable = ({

          return {
            id,
-            [ValidatorFields.RANKING_INDEX]: votingPowerRanking,
+            [ValidatorFields.RANKING_INDEX]: stakedTotalRanking,
            [ValidatorFields.VALIDATOR]: {
              avatarUrl,
              name,
@@ -166,7 +166,7 @@ export const StandbyPendingValidatorsTable = ({
              : undefined,
            [ValidatorFields.PENDING_USER_STAKE]: pendingUserStake,
            [ValidatorFields.USER_STAKE_SHARE]: userStakeShare
-              ? formatNumberPercentage(new BigNumber(userStakeShare))
+              ? formatNumberPercentage(new BigNumber(userStakeShare), 2)
              : undefined,
          };
        }
@@ -210,6 +210,7 @@ export const StandbyPendingValidatorsTable = ({
          headerTooltip: t('StakeDescription').toString(),
          cellRenderer: TotalStakeRenderer,
          width: 120,
+          sort: 'desc',
        },
        {
          field: ValidatorFields.PENDING_STAKE,
@@ -233,7 +234,6 @@ export const StandbyPendingValidatorsTable = ({
          }),
          cellRenderer: StakeNeededForPromotionRenderer,
          width: 210,
-          sort: 'asc',
        },
        {
          field: ValidatorFields.TOTAL_PENALTIES,
@@ -2,12 +2,8 @@ import { useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import BigNumber from 'bignumber.js';
 import * as Schema from '@vegaprotocol/types';
-import {
-  createDocsLinks,
-  removePaginationWrapper,
-  toBigNum,
-} from '@vegaprotocol/utils';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { removePaginationWrapper, toBigNum } from '@vegaprotocol/utils';
+import { DocsLinks } from '@vegaprotocol/environment';
 import { Link as UTLink, Toggle } from '@vegaprotocol/ui-toolkit';

 import { formatNumber } from '../../../../lib/format-number';
@@ -42,7 +38,6 @@ export const ValidatorTables = ({
  previousEpochData,
 }: ValidatorsTableProps) => {
  const { t } = useTranslation();
-  const { VEGA_DOCS_URL } = useEnvironment();
  const {
    appState: { decimals },
  } = useAppState();
@@ -213,12 +208,12 @@ export const ValidatorTables = ({
        <>
          <SubHeading title={t('status-pending')} />
          <p>
-            {VEGA_DOCS_URL && (
+            {DocsLinks && (
              <>
                <span>{t('pendingDescription1')} </span>
                <span>
                  <UTLink
-                    href={createDocsLinks(VEGA_DOCS_URL).STAKING_GUIDE}
+                    href={DocsLinks.STAKING_GUIDE}
                    target="_blank"
                    data-testid="validator-forum-link"
                  >
@@ -1,4 +1,3 @@
-import { useEffect, useState } from 'react';
 import { ENV } from '../../../config';
 import { Callout, Intent, Splash } from '@vegaprotocol/ui-toolkit';
 import { useVegaWallet } from '@vegaprotocol/wallet';
@@ -10,6 +9,7 @@ import { usePreviousEpochQuery } from '../__generated__/PreviousEpoch';
 import type { ReactElement } from 'react';
 import type { StakingQuery } from '../__generated__/Staking';
 import type { PreviousEpochQuery } from '../__generated__/PreviousEpoch';
+import { isPartyNotFoundError } from '../../../lib/party';

 // TODO should only request a single node. When migrating from deprecated APIs we should address this.

@@ -39,21 +39,9 @@ export const NodeContainer = ({
          }
        : undefined,
    },
+    errorPolicy: 'all',
  });

-  const [isRefetching, setIsRefetching] = useState(false);
-
-  useEffect(() => {
-    if (error && error.message.includes('failed to get party for ID')) {
-      setIsRefetching(true);
-      // The API errors if there is a pubkey, but it hasn't interacted with the
-      // chain before. In that case, retry the query with empty pubKey
-      refetch({
-        partyId: '',
-      }).finally(() => setIsRefetching(false));
-    }
-  }, [error, refetch, delegationsPagination]);
-
  const { data: previousEpochData } = usePreviousEpochQuery({
    variables: {
      epochId: (Number(data?.epoch.id) - 1).toString(),
@@ -63,7 +51,7 @@ export const NodeContainer = ({

  useRefreshAfterEpoch(data?.epoch.timestamps.expiry, refetch);

-  if (error && !isRefetching) {
+  if (error && !isPartyNotFoundError(error)) {
    return (
      <Callout intent={Intent.Danger} title={t('Something went wrong')}>
        <pre>
@@ -75,7 +63,7 @@ export const NodeContainer = ({
    );
  }

-  if (loading || isRefetching) {
+  if (loading) {
    return (
      <Splash>
        <SplashLoader />
@@ -1,7 +1,11 @@
 import React, { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { createDocsLinks, ExternalLinks, toBigNum } from '@vegaprotocol/utils';
+import {
+  useEnvironment,
+  DocsLinks,
+  ExternalLinks,
+} from '@vegaprotocol/environment';
+import { toBigNum } from '@vegaprotocol/utils';
 import * as Schema from '@vegaprotocol/types';
 import {
  Link as UTLink,
@@ -64,7 +68,7 @@ export const ValidatorTable = ({
  stakedTotal,
  previousEpochData,
 }: ValidatorTableProps) => {
-  const { ETHERSCAN_URL, VEGA_DOCS_URL } = useEnvironment();
+  const { ETHERSCAN_URL } = useEnvironment();
  const { t } = useTranslation();
  const {
    appState: { decimals },
@@ -90,9 +94,9 @@ export const ValidatorTable = ({
    <>
      <p className="mb-12">
        {t('validatorFormIntro')}{' '}
-        {VEGA_DOCS_URL && (
+        {DocsLinks && (
          <ExternalLink
-            href={createDocsLinks(VEGA_DOCS_URL).STAKING_GUIDE}
+            href={DocsLinks.STAKING_GUIDE}
            target="_blank"
            data-testid="validator-table-staking-guide-link"
            className="text-white"
@@ -60,9 +60,14 @@ export const getOverstakingPenalty = (
  }

  return formatNumberPercentage(
-    new BigNumber(1)
-      .minus(new BigNumber(validatorScore).dividedBy(new BigNumber(stakeScore)))
-      .times(100),
+    BigNumber.max(
+      new BigNumber(1)
+        .minus(
+          new BigNumber(validatorScore).dividedBy(new BigNumber(stakeScore))
+        )
+        .times(100),
+      new BigNumber(0)
+    ),
    2
  );
 };
@@ -3,7 +3,8 @@ import { Trans, useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';

 import { Heading, SubHeading } from '../../components/heading';
-import { ExternalLinks, toBigNum } from '@vegaprotocol/utils';
+import { ExternalLinks } from '@vegaprotocol/environment';
+import { toBigNum } from '@vegaprotocol/utils';
 import { useAppState } from '../../contexts/app-state/app-state-context';
 import { useDocumentTitle } from '../../hooks/use-document-title';
 import type { RouteChildProps } from '..';
@@ -40,9 +40,9 @@
  line-height: calc(min(var(--ag-line-height, 26px), 26px) - 4px);
 }

-.vega-ag-grid .ag-row {
-  border-width: 1px 0;
-  border-bottom: 1px solid transparent;
+.vega-ag-grid .ag-row,
+.vega-ag-grid .ag-cell {
+  border-width: 0;
 }

 /* Dark variables */
@@ -54,7 +54,6 @@
  --ag-header-column-separator-color: theme(colors.neutral[600]);
  --ag-row-border-color: theme(colors.black);
  --ag-row-hover-color: theme(colors.neutral[800]);
-  --ag-font-size: 12px;
 }

 .validators-table .ag-theme-balham-dark .ag-body-horizontal-scroll {
@@ -10,8 +10,8 @@ import {
  displayChange,
 } from '@vegaprotocol/liquidity';

-import type { Candle } from '@vegaprotocol/market-list';
-import { marketCandlesProvider } from '@vegaprotocol/market-list';
+import type { Candle } from '@vegaprotocol/markets';
+import { marketCandlesProvider } from '@vegaprotocol/markets';

 const THROTTLE_UPDATE_TIME = 500;

@@ -318,10 +318,11 @@ describe('Closed markets', { tags: '@smoke' }, () => {
      .should('have.text', product.settlementAsset.symbol);

    // 6001-MARK-020
-    cy.get(rowSelector)
+    cy.get('.ag-pinned-right-cols-container')
+      .find('[col-id="market-actions"]')
      .first()
-      .find('[col-id="id"]')
-      .should('have.text', settledMarket.id);
+      .find('button svg')
+      .should('exist');
  });

  // test market list for market in terminated state
@@ -373,5 +374,33 @@ describe('Closed markets', { tags: '@smoke' }, () => {
      'have.text',
      `Asset details - ${settlementAsset.symbol}`
    );
+
+    cy.get('[data-testid="dialog-close"]').click();
+  });
+
+  it('can open row actions', () => {
+    cy.get('.ag-pinned-right-cols-container')
+      .find('[col-id="market-actions"]')
+      .first()
+      .find('button')
+      .click();
+
+    const dropdownContent = '[data-testid="market-actions-content"]';
+    const dropdownContentItem = '[role="menuitem"]';
+    cy.get(dropdownContent)
+      .find(dropdownContentItem)
+      .eq(0)
+      // Cannot click the copy button as it falls back to window.prompt, blocking the test.
+      .should('have.text', 'Copy Market ID');
+
+    cy.get(dropdownContent)
+      .find(dropdownContentItem)
+      .eq(1)
+      .find('a')
+      .then(($el) => {
+        const href = $el.attr('href');
+        expect(/\/markets\/0/.test(href || '')).to.equal(true);
+      })
+      .should('have.text', 'View on Explorer');
  });
 });
@@ -108,10 +108,9 @@ describe('deposit actions', { tags: '@smoke' }, () => {

  it('Deposit to trade is visble', () => {
    cy.getByTestId('Collateral').click();
-    cy.contains('[data-testid="deposit"]', 'Deposit to trade').should(
-      'be.visible'
-    );
-    cy.contains('[data-testid="deposit"]', 'Deposit to trade').click();
+    cy.contains('[data-testid="deposit"]', 'Deposit')
+      .should('be.visible')
+      .click();
    cy.getByTestId('deposit-submit').should('be.visible');
  });
 });
@@ -48,7 +48,7 @@ describe('accounts', { tags: '@smoke' }, () => {
    cy.getByTestId('tab-accounts')
      .get(tradingAccountRowId)
      .find('[col-id="accounts-actions"]')
-      .should('have.text', ' ');
+      .should('have.text', '');

    cy.getByTestId('tab-accounts')
      .get(tradingAccountRowId)
@@ -1,7 +1,7 @@
 import { aliasGQLQuery } from '@vegaprotocol/cypress';
 import * as Schema from '@vegaprotocol/types';
 import type { CyHttpMessages } from 'cypress/types/net-stubbing';
-import type { Provider, Status } from '@vegaprotocol/market-info';
+import type { Provider, Status } from '@vegaprotocol/markets';
 import {
  accountsQuery,
  assetQuery,
@@ -32,7 +32,7 @@ import {
  blockStatisticsQuery,
 } from '@vegaprotocol/mock';
 import type { PartialDeep } from 'type-fest';
-import type { MarketDataQuery, MarketsQuery } from '@vegaprotocol/market-list';
+import type { MarketDataQuery, MarketsQuery } from '@vegaprotocol/markets';

 type MarketPageMockData = {
  state: Schema.MarketState;
@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { marketsWithDataProvider } from '@vegaprotocol/market-list';
+import { marketsWithDataProvider } from '@vegaprotocol/markets';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
 import { Links, Routes } from '../../pages/client-router';
@@ -5,10 +5,9 @@ import {
  lpAggregatedDataProvider,
  useCheckLiquidityStatus,
 } from '@vegaprotocol/liquidity';
-import { tooltipMapping } from '@vegaprotocol/market-info';
+import { tooltipMapping } from '@vegaprotocol/markets';
 import {
  addDecimalsFormatNumber,
-  createDocsLinks,
  formatNumberPercentage,
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
@@ -38,8 +37,8 @@ import type { LiquidityProvisionData, Filter } from '@vegaprotocol/liquidity';
 import { Link, useParams } from 'react-router-dom';
 import { Links, Routes } from '../../pages/client-router';

-import { useMarket, useStaticMarketData } from '@vegaprotocol/market-list';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { useMarket, useStaticMarketData } from '@vegaprotocol/markets';
+import { DocsLinks } from '@vegaprotocol/environment';

 const enum LiquidityTabs {
  Active = 'active',
@@ -147,7 +146,6 @@ const LiquidityViewHeader = memo(({ marketId }: { marketId?: string }) => {
    market?.tradableInstrument.instrument.product.settlementAsset.decimals || 0;
  const symbol =
    market?.tradableInstrument.instrument.product.settlementAsset.symbol;
-  const { VEGA_DOCS_URL } = useEnvironment();

  const { params } = useNetworkParams([
    NetworkParams.market_liquidity_stakeToCcyVolume,
@@ -216,10 +214,12 @@ const LiquidityViewHeader = memo(({ marketId }: { marketId?: string }) => {
        <div className="break-word">{marketId}</div>
      </HeaderStat>
      <HeaderStat heading={t('Learn more')}>
-        {VEGA_DOCS_URL && (
-          <ExternalLink href={createDocsLinks(VEGA_DOCS_URL).LIQUIDITY}>
+        {DocsLinks ? (
+          <ExternalLink href={DocsLinks.LIQUIDITY}>
            {t('Providing liquidity')}
          </ExternalLink>
+        ) : (
+          (null as React.ReactNode)
        )}
      </HeaderStat>
    </Header>
@@ -2,12 +2,12 @@ import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
 import { useEnvironment } from '@vegaprotocol/environment';
 import { ButtonLink, Link } from '@vegaprotocol/ui-toolkit';
 import { MarketProposalNotification } from '@vegaprotocol/proposals';
-import type { Market } from '@vegaprotocol/market-list';
+import type { Market } from '@vegaprotocol/markets';
 import { getExpiryDate, getMarketExpiryDate } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import { HeaderStat } from '../../components/header';
 import { MarketMarkPrice } from '../../components/market-mark-price';
-import { Last24hPriceChange, Last24hVolume } from '@vegaprotocol/market-info';
+import { Last24hPriceChange, Last24hVolume } from '@vegaprotocol/markets';
 import { MarketState } from '../../components/market-state';
 import { HeaderStatMarketTradingMode } from '../../components/market-trading-mode';
 import { MarketLiquiditySupplied } from '../../components/liquidity-supplied';
@@ -8,8 +8,8 @@ import { MockedProvider } from '@apollo/client/testing';
 import type {
  MarketDataUpdateFieldsFragment,
  MarketDataUpdateSubscription,
-} from '@vegaprotocol/market-list';
-import { MarketDataUpdateDocument } from '@vegaprotocol/market-list';
+} from '@vegaprotocol/markets';
+import { MarketDataUpdateDocument } from '@vegaprotocol/markets';
 import {
  AuctionTrigger,
  MarketState,
@@ -6,8 +6,8 @@ import {
  formatNumber,
  priceChangePercentage,
 } from '@vegaprotocol/utils';
-import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/market-list';
-import { useMarketDataUpdateSubscription } from '@vegaprotocol/market-list';
+import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/markets';
+import { useMarketDataUpdateSubscription } from '@vegaprotocol/markets';
 import { Sparkline } from '@vegaprotocol/ui-toolkit';

 export const MarketSelectorItem = ({
@@ -1,7 +1,7 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { MarketSelector } from './market-selector';
-import { useMarketList } from '@vegaprotocol/market-list';
+import { useMarketList } from '@vegaprotocol/markets';
 import { createMarketFragment } from '@vegaprotocol/mock';
 import { MarketState } from '@vegaprotocol/types';
 import { MemoryRouter } from 'react-router-dom';
@@ -10,8 +10,9 @@ import type { SortType } from './sort-dropdown';
 import { SortTypeMapping } from './sort-dropdown';
 import { Sort } from './sort-dropdown';
 import { subDays } from 'date-fns';
+import { isMarketActive } from './use-market-selector-list';

-jest.mock('@vegaprotocol/market-list');
+jest.mock('@vegaprotocol/markets');
 const mockUseMarketList = useMarketList as jest.Mock;

 // mock market list items to avoid subscriptions starting
@@ -126,9 +127,7 @@ describe('MarketSelector', () => {
    }),
  ];

-  const activeMarkets = markets.filter((m) =>
-    [MarketState.STATE_ACTIVE, MarketState.STATE_SUSPENDED].includes(m.state)
-  );
+  const activeMarkets = markets.filter((m) => isMarketActive(m.state));
  mockUseMarketList.mockReturnValue({
    data: markets,
    loading: false,
@@ -1,6 +1,6 @@
 import { t } from '@vegaprotocol/i18n';
 import uniqBy from 'lodash/uniqBy';
-import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/market-list';
+import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/markets';
 import {
  Input,
  TinyScroll,
@@ -7,7 +7,7 @@ import {
  useThrottledDataProvider,
 } from '@vegaprotocol/data-provider';
 import { AsyncRenderer, ExternalLink, Splash } from '@vegaprotocol/ui-toolkit';
-import { marketProvider, marketDataProvider } from '@vegaprotocol/market-list';
+import { marketProvider, marketDataProvider } from '@vegaprotocol/markets';
 import { useGlobalStore, usePageTitleStore } from '../../stores';
 import { TradeGrid } from './trade-grid';
 import { TradePanels } from './trade-panels';
@@ -6,8 +6,8 @@ import classNames from 'classnames';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import type { PinnedAsset } from '@vegaprotocol/accounts';
 import { t } from '@vegaprotocol/i18n';
-import { OracleBanner } from '@vegaprotocol/market-info';
-import type { Market } from '@vegaprotocol/market-list';
+import { OracleBanner } from '@vegaprotocol/markets';
+import type { Market } from '@vegaprotocol/markets';
 import { Filter } from '@vegaprotocol/orders';
 import {
  usePaneLayout,
@@ -1,6 +1,6 @@
 import type { PinnedAsset } from '@vegaprotocol/accounts';
-import type { Market } from '@vegaprotocol/market-list';
-import { OracleBanner } from '@vegaprotocol/market-info';
+import type { Market } from '@vegaprotocol/markets';
+import { OracleBanner } from '@vegaprotocol/markets';
 import {
  useMarketClickHandler,
  useMarketLiquidityClickHandler,
@@ -1,5 +1,5 @@
 import { DealTicketContainer } from '@vegaprotocol/deal-ticket';
-import { MarketInfoAccordionContainer } from '@vegaprotocol/market-info';
+import { MarketInfoAccordionContainer } from '@vegaprotocol/markets';
 import { OrderbookContainer } from '@vegaprotocol/market-depth';
 import { OrderListContainer, Filter } from '@vegaprotocol/orders';
 import type { OrderListContainerProps } from '@vegaprotocol/orders';
@@ -1,15 +1,18 @@
 import merge from 'lodash/merge';
 import { renderHook } from '@testing-library/react';
-import { useMarketSelectorList } from './use-market-selector-list';
+import {
+  isMarketActive,
+  useMarketSelectorList,
+} from './use-market-selector-list';
 import { Product } from './product-selector';
 import { Sort } from './sort-dropdown';
 import { createMarketFragment } from '@vegaprotocol/mock';
 import { MarketState } from '@vegaprotocol/types';
-import { useMarketList } from '@vegaprotocol/market-list';
+import { useMarketList } from '@vegaprotocol/markets';
 import type { Filter } from './market-selector';
 import { subDays } from 'date-fns';

-jest.mock('@vegaprotocol/market-list');
+jest.mock('@vegaprotocol/markets');
 const mockUseMarketList = useMarketList as jest.Mock;

 describe('useMarketSelectorList', () => {
@@ -38,6 +41,10 @@ describe('useMarketSelectorList', () => {
      }),
      createMarketFragment({
        id: 'market-3',
+        state: MarketState.STATE_CLOSED,
+      }),
+      createMarketFragment({
+        id: 'market-4',
        state: MarketState.STATE_PENDING,
      }),
    ];
@@ -48,7 +55,7 @@ describe('useMarketSelectorList', () => {
    });
    const { result } = setup();
    const expectedFilteredMarkets = markets.filter((m) =>
-      [MarketState.STATE_ACTIVE, MarketState.STATE_SUSPENDED].includes(m.state)
+      isMarketActive(m.state)
    );
    expect(result.current).toEqual({
      data: markets,
@@ -1,7 +1,7 @@
 import { useMemo } from 'react';
 import orderBy from 'lodash/orderBy';
 import { MarketState } from '@vegaprotocol/types';
-import { useMarketList } from '@vegaprotocol/market-list';
+import { useMarketList } from '@vegaprotocol/markets';
 import { priceChangePercentage } from '@vegaprotocol/utils';
 import type { Filter } from './market-selector';
 import { Sort } from './sort-dropdown';
@@ -18,11 +18,7 @@ export const useMarketSelectorList = ({
    if (!data?.length) return [];
    const markets = data
      // only active
-      .filter((m) => {
-        return [MarketState.STATE_ACTIVE, MarketState.STATE_SUSPENDED].includes(
-          m.state
-        );
-      })
+      .filter((m) => isMarketActive(m.state))
      // only selected product type
      .filter((m) => {
        if (m.tradableInstrument.instrument.product.__typename === product) {
@@ -80,3 +76,11 @@ export const useMarketSelectorList = ({

  return { markets, data, loading, error };
 };
+
+export const isMarketActive = (state: MarketState) => {
+  return [
+    MarketState.STATE_ACTIVE,
+    MarketState.STATE_SUSPENDED,
+    MarketState.STATE_PENDING,
+  ].includes(state);
+};
@@ -6,8 +6,16 @@ import { MarketState } from '@vegaprotocol/types';
 import { subDays } from 'date-fns';
 import type { MockedResponse } from '@apollo/client/testing';
 import { MockedProvider } from '@apollo/client/testing';
-import type { OracleSpecDataConnectionQuery } from '@vegaprotocol/market-info';
-import { OracleSpecDataConnectionDocument } from '@vegaprotocol/market-info';
+import type {
+  OracleSpecDataConnectionQuery,
+  MarketsDataQuery,
+  MarketsQuery,
+} from '@vegaprotocol/markets';
+import {
+  OracleSpecDataConnectionDocument,
+  MarketsDataDocument,
+  MarketsDocument,
+} from '@vegaprotocol/markets';
 import type { VegaWalletContextShape } from '@vegaprotocol/wallet';
 import { VegaWalletContext } from '@vegaprotocol/wallet';
 import type {
@@ -16,9 +24,6 @@ import type {
 } from '@vegaprotocol/positions';
 import { PositionsDocument } from '@vegaprotocol/positions';
 import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
-import type { MarketsDataQuery, MarketsQuery } from '@vegaprotocol/market-list';
-import { MarketsDataDocument } from '@vegaprotocol/market-list';
-import { MarketsDocument } from '@vegaprotocol/market-list';
 import {
  createMarketFragment,
  marketsQuery,
@@ -214,7 +219,7 @@ describe('Closed', () => {
      'Settlement price',
      'Realised PNL',
      'Settlement asset',
-      'Market ID',
+      '', // actions row
    ];
    expect(headers).toHaveLength(expectedHeaders.length);
    expect(headers.map((h) => h.textContent?.trim())).toEqual(expectedHeaders);
@@ -236,7 +241,7 @@ describe('Closed', () => {
      addDecimalsFormatNumber(property.value, market.decimalPlaces),
      addDecimalsFormatNumber(position.realisedPNL, market.decimalPlaces),
      market.tradableInstrument.instrument.product.settlementAsset.symbol,
-      market.id,
+      '', // actions row
    ];
    cells.forEach((cell, i) => {
      expect(cell).toHaveTextContent(expectedValues[i]);
@@ -328,8 +333,13 @@ describe('Closed', () => {
    // check that only included ids are shown
    const cells = screen
      .getAllByRole('gridcell')
-      .filter((cell) => cell.getAttribute('col-id') === 'id')
-      .map((cell) => cell.textContent?.trim());
+      .filter((cell) => cell.getAttribute('col-id') === 'code')
+      .map((cell) => {
+        const marketId = within(cell)
+          .getByTestId('market-code')
+          .getAttribute('data-market-id');
+        return marketId;
+      });
    expect(cells).toEqual(expectedRows.map((m) => m.node.id));
  });
 });
@@ -4,7 +4,7 @@ import type {
  VegaICellRendererParams,
  VegaValueFormatterParams,
 } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGridLazy as AgGrid, COL_DEFS } from '@vegaprotocol/datagrid';
 import { useMemo } from 'react';
 import { t } from '@vegaprotocol/i18n';
 import { MarketState, MarketStateMapping } from '@vegaprotocol/types';
@@ -13,8 +13,11 @@ import {
  getMarketExpiryDate,
 } from '@vegaprotocol/utils';
 import { usePositionsQuery } from '@vegaprotocol/positions';
-import type { MarketMaybeWithData } from '@vegaprotocol/market-list';
-import { closedMarketsWithDataProvider } from '@vegaprotocol/market-list';
+import type { MarketMaybeWithData } from '@vegaprotocol/markets';
+import {
+  MarketTableActions,
+  closedMarketsWithDataProvider,
+} from '@vegaprotocol/markets';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
 import type { ColDef } from 'ag-grid-community';
@@ -121,6 +124,16 @@ const ClosedMarketsDataGrid = ({ rowData }: { rowData: Row[] }) => {
      {
        headerName: t('Market'),
        field: 'code',
+        cellRenderer: ({
+          value,
+          data,
+        }: VegaICellRendererParams<Row, 'code'>) => {
+          return (
+            <span data-testid="market-code" data-market-id={data?.id}>
+              {value}
+            </span>
+          );
+        },
      },
      {
        headerName: t('Description'),
@@ -262,9 +275,17 @@ const ClosedMarketsDataGrid = ({ rowData }: { rowData: Row[] }) => {
        ),
      },
      {
-        headerName: t('Market ID'),
-        field: 'id',
-        flex: 1,
+        colId: 'market-actions',
+        ...COL_DEFS.actions,
+        cellRenderer: ({ data }: VegaICellRendererParams<Row>) => {
+          if (!data) return null;
+          return (
+            <MarketTableActions
+              marketId={data.id}
+              assetId={data.settlementAsset.id}
+            />
+          );
+        },
      },
    ];
    return cols;
@@ -1,4 +1,4 @@
-import { MarketsContainer } from '@vegaprotocol/market-list';
+import { MarketsContainer } from '@vegaprotocol/markets';
 import { useMarketClickHandler } from '../../lib/hooks/use-market-click-handler';

 export const Markets = () => {
@@ -2,8 +2,8 @@ import { render, screen } from '@testing-library/react';
 import type { Property } from '@vegaprotocol/types';
 import type { MockedResponse } from '@apollo/client/testing';
 import { MockedProvider } from '@apollo/client/testing';
-import type { OracleSpecDataConnectionQuery } from '@vegaprotocol/market-info';
-import { OracleSpecDataConnectionDocument } from '@vegaprotocol/market-info';
+import type { OracleSpecDataConnectionQuery } from '@vegaprotocol/markets';
+import { OracleSpecDataConnectionDocument } from '@vegaprotocol/markets';
 import type { SettlementPriceCellProps } from './settlement-price-cell';
 import { SettlementPriceCell } from './settlement-price-cell';

@@ -1,6 +1,6 @@
 import { DApp, EXPLORER_ORACLE, useLinks } from '@vegaprotocol/environment';
 import { t } from '@vegaprotocol/i18n';
-import { useOracleSpecBindingData } from '@vegaprotocol/market-info';
+import { useOracleSpecBindingData } from '@vegaprotocol/markets';
 import { Link } from '@vegaprotocol/ui-toolkit';
 import { addDecimalsFormatNumber } from '@vegaprotocol/utils';

@@ -26,7 +26,7 @@ import type { Account } from '@vegaprotocol/accounts';
 import { accountsDataProvider } from '@vegaprotocol/accounts';
 import { useThemeSwitcher } from '@vegaprotocol/react-helpers';
 import { useDataProvider } from '@vegaprotocol/data-provider';
-import type { Market } from '@vegaprotocol/market-list';
+import type { Market } from '@vegaprotocol/markets';

 const DateRange = {
  RANGE_1D: '1D',
@@ -5,6 +5,7 @@ import {
  RoundedWrapper,
  Switch,
  ThemeSwitcher,
+  ToastPositionSetter,
 } from '@vegaprotocol/ui-toolkit';
 import { useThemeSwitcher } from '@vegaprotocol/react-helpers';

@@ -41,6 +42,8 @@ export const Settings = () => {
                'Help identify bugs and improve the service by sharing anonymous usage data.'
              )}
            />
+            <Divider />
+            <ToastPositionSetter />
          </RoundedWrapper>
        </div>
      </div>
@@ -4,8 +4,8 @@ import {
  useNetworkParams,
 } from '@vegaprotocol/network-parameters';
 import { useDataProvider } from '@vegaprotocol/data-provider';
-import type { MarketData } from '@vegaprotocol/market-list';
-import { marketDataProvider, marketProvider } from '@vegaprotocol/market-list';
+import type { MarketData } from '@vegaprotocol/markets';
+import { marketDataProvider, marketProvider } from '@vegaprotocol/markets';
 import { HeaderStat } from '../header';
 import {
  ExternalLink,
@@ -19,11 +19,10 @@ import { useCheckLiquidityStatus } from '@vegaprotocol/liquidity';
 import { AuctionTrigger, MarketTradingMode } from '@vegaprotocol/types';
 import {
  addDecimalsFormatNumber,
-  createDocsLinks,
  formatNumberPercentage,
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
-import { useEnvironment } from '@vegaprotocol/environment';
+import { DocsLinks } from '@vegaprotocol/environment';

 interface Props {
  marketId?: string;
@@ -47,8 +46,6 @@ export const MarketLiquiditySupplied = ({
    params.market_liquidity_targetstake_triggering_ratio
  );

-  const { VEGA_DOCS_URL } = useEnvironment();
-
  const variables = useMemo(
    () => ({
      marketId: marketId || '',
@@ -131,11 +128,8 @@ export const MarketLiquiditySupplied = ({
      <Link href={`/#/liquidity/${marketId}`} data-testid="view-liquidity-link">
        {t('View liquidity provision table')}
      </Link>
-      {VEGA_DOCS_URL && (
-        <ExternalLink
-          href={createDocsLinks(VEGA_DOCS_URL).LIQUIDITY}
-          className="mt-2"
-        >
+      {DocsLinks && (
+        <ExternalLink href={DocsLinks.LIQUIDITY} className="mt-2">
          {t('Learn about providing liquidity')}
        </ExternalLink>
      )}
@@ -3,7 +3,7 @@ import { useInView } from 'react-intersection-observer';
 import { addDecimalsFormatNumber, isNumeric } from '@vegaprotocol/utils';
 import { useThrottledDataProvider } from '@vegaprotocol/data-provider';
 import { PriceCell } from '@vegaprotocol/datagrid';
-import { marketDataProvider } from '@vegaprotocol/market-list';
+import { marketDataProvider } from '@vegaprotocol/markets';
 import { THROTTLE_UPDATE_TIME } from '../constants';

 interface Props {
@@ -1,6 +1,6 @@
 import throttle from 'lodash/throttle';
-import type { MarketData, Market } from '@vegaprotocol/market-list';
-import { marketDataProvider } from '@vegaprotocol/market-list';
+import type { MarketData, Market } from '@vegaprotocol/markets';
+import { marketDataProvider } from '@vegaprotocol/markets';
 import { t } from '@vegaprotocol/i18n';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import * as Schema from '@vegaprotocol/types';
@@ -5,7 +5,7 @@ import { useInView } from 'react-intersection-observer';
 import * as Schema from '@vegaprotocol/types';
 import { HeaderStat } from '../header';
 import { Tooltip } from '@vegaprotocol/ui-toolkit';
-import { useStaticMarketData } from '@vegaprotocol/market-list';
+import { useStaticMarketData } from '@vegaprotocol/markets';

 const getTradingModeLabel = (
  marketTradingMode?: Schema.MarketTradingMode,
@@ -3,8 +3,8 @@ import throttle from 'lodash/throttle';
 import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import { useDataProvider } from '@vegaprotocol/data-provider';
-import type { MarketData } from '@vegaprotocol/market-list';
-import { marketDataProvider, marketProvider } from '@vegaprotocol/market-list';
+import type { MarketData } from '@vegaprotocol/markets';
+import { marketDataProvider, marketProvider } from '@vegaprotocol/markets';
 import { HeaderStat } from '../header';
 import * as constants from '../constants';

@@ -5,6 +5,7 @@ import {
  TOKEN_GOVERNANCE,
  useEnvironment,
  useLinks,
+  DocsLinks,
 } from '@vegaprotocol/environment';
 import { t } from '@vegaprotocol/i18n';
 import { useGlobalStore } from '../../stores';
@@ -22,7 +23,6 @@ import {
 } from '@vegaprotocol/ui-toolkit';

 import { Links, Routes } from '../../pages/client-router';
-import { createDocsLinks } from '@vegaprotocol/utils';
 import { SettingsButton } from '../../client-pages/settings';
 import {
  ProtocolUpgradeCountdown,
@@ -34,7 +34,7 @@ export const Navbar = ({
 }: {
  theme: ComponentProps<typeof Navigation>['theme'];
 }) => {
-  const { VEGA_DOCS_URL, GITHUB_FEEDBACK_URL } = useEnvironment();
+  const { GITHUB_FEEDBACK_URL } = useEnvironment();
  const tokenLink = useLinks(DApp.Token);
  const { marketId } = useGlobalStore((store) => ({
    marketId: store.marketId,
@@ -92,15 +92,13 @@ export const Navbar = ({
            {t('Governance')}
          </NavExternalLink>
        </NavigationItem>
-        {VEGA_DOCS_URL && GITHUB_FEEDBACK_URL && (
+        {DocsLinks?.NEW_TO_VEGA && GITHUB_FEEDBACK_URL && (
          <NavigationItem>
            <NavigationTrigger>{t('Resources')}</NavigationTrigger>
            <NavigationContent>
              <NavigationList>
                <NavigationItem>
-                  <NavExternalLink
-                    href={createDocsLinks(VEGA_DOCS_URL).NEW_TO_VEGA}
-                  >
+                  <NavExternalLink href={DocsLinks.NEW_TO_VEGA}>
                    {t('Docs')}
                  </NavExternalLink>
                </NavigationItem>
@@ -1,20 +1,21 @@
 import type { RefObject, MouseEvent } from 'react';
-import { FeesCell } from '@vegaprotocol/market-info';
 import {
+  FeesCell,
  calcCandleHigh,
  calcCandleLow,
  calcCandleVolume,
-} from '@vegaprotocol/market-list';
+  Last24hPriceChange,
+  Last24hVolume,
+} from '@vegaprotocol/markets';
 import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import { PriceCell } from '@vegaprotocol/datagrid';
 import { Link as UILink, Sparkline, Tooltip } from '@vegaprotocol/ui-toolkit';
 import isNil from 'lodash/isNil';
 import type { CandleClose } from '@vegaprotocol/types';
-import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/market-list';
+import type { MarketMaybeWithDataAndCandles } from '@vegaprotocol/markets';
 import { Link } from 'react-router-dom';
 import { MarketMarkPrice } from '../market-mark-price';
-import { Last24hPriceChange, Last24hVolume } from '@vegaprotocol/market-info';
 import { MarketTradingMode } from '../market-trading-mode';
 import { Links, Routes } from '../../pages/client-router';

@@ -21,6 +21,7 @@ import { useVegaWallet, useVegaWalletDialogStore } from '@vegaprotocol/wallet';
 import { Networks, useEnvironment } from '@vegaprotocol/environment';
 import { WalletIcon } from '../icons/wallet';
 import { useTransferDialog } from '@vegaprotocol/accounts';
+import { useCopyTimeout } from '@vegaprotocol/react-helpers';

 const MobileWalletButton = ({
  isConnected,
@@ -237,21 +238,7 @@ export const VegaWalletConnectButton = () => {
 };

 const KeypairItem = ({ pk }: { pk: PubKey }) => {
-  const [copied, setCopied] = useState(false);
-  useEffect(() => {
-    // eslint-disable-next-line
-    let timeout: any;
-
-    if (copied) {
-      timeout = setTimeout(() => {
-        setCopied(false);
-      }, 800);
-    }
-
-    return () => {
-      clearTimeout(timeout);
-    };
-  }, [copied]);
+  const [copied, setCopied] = useCopyTimeout();

  return (
    <DropdownMenuRadioItem value={pk.publicKey}>
@@ -8,11 +8,10 @@ import {
 import { RISK_ACCEPTED_KEY } from '../constants';
 import { TelemetryApproval } from './telemetry-approval';
 import {
-  DOCS_VEGA_WALLET,
-  GET_VEGA_WALLET_URL,
  Networks,
-  useDocsLink,
  useEnvironment,
+  DocsLinks,
+  ExternalLinks,
 } from '@vegaprotocol/environment';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';

@@ -53,8 +52,6 @@ export const RiskNoticeDialog = ({ onClose, network }: Props) => {

 const TestnetContent = ({ network }: { network: Networks }) => {
  const { GITHUB_FEEDBACK_URL } = useEnvironment();
-  const docsLink = useDocsLink();
-
  return (
    <>
      <p className="mb-4">
@@ -69,16 +66,16 @@ const TestnetContent = ({ network }: { network: Networks }) => {
          [network]
        )}
      </p>
-      {GITHUB_FEEDBACK_URL && GET_VEGA_WALLET_URL && docsLink && (
+      {GITHUB_FEEDBACK_URL && DocsLinks && (
        <ul className="list-disc pl-4">
          <li className="mb-1">
-            <Link href={GET_VEGA_WALLET_URL} target="_blank">
+            <Link href={ExternalLinks.VEGA_WALLET_URL} target="_blank">
              <span className="underline">{t('Get a Vega Wallet')}</span>{' '}
              <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
            </Link>
          </li>
          <li className="mb-1">
-            <Link href={docsLink(DOCS_VEGA_WALLET)} target="_blank">
+            <Link href={DocsLinks.VEGA_WALLET_TOOLS_URL} target="_blank">
              <span className="underline">{t('Learn about Vega Wallet')}</span>{' '}
              <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
            </Link>
@@ -4,7 +4,7 @@ import { Dialog } from '@vegaprotocol/ui-toolkit';
 import { t } from '@vegaprotocol/i18n';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import { useDataProvider } from '@vegaprotocol/data-provider';
-import { activeMarketsProvider } from '@vegaprotocol/market-list';
+import { activeMarketsProvider } from '@vegaprotocol/markets';
 import * as constants from '../constants';
 import { RiskNoticeDialog } from './risk-notice-dialog';
 import { WelcomeNoticeDialog } from './welcome-notice-dialog';
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Matthew Russell	64bf2b3b52	feat: add check for operation name in apollo client error link	2023-05-18 15:05:32 -07:00
Matthew Russell	28f9e169e7	chore: rename nodes so its more clear what the query is used for	2023-05-18 14:54:13 -07:00
dexturr	162b167860	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-18 18:07:36 +00:00
Art	a4149cc55e	feat(web3): withdrawal details (#3701 )	2023-05-18 16:50:15 +02:00
Mikołaj Młodzikowski	4161a74eaf	feat(ci): fix release body (#3822 )	2023-05-18 14:59:46 +01:00
Mikołaj Młodzikowski	5008e57a56	feat(ci): adjust variables during release pipeline to cover actual tag_name	2023-05-18 15:12:12 +02:00
Mikołaj Młodzikowski	89031bf826	feat(ci): append ipfs related information to release body (#3818 )	2023-05-18 14:51:53 +02:00
dexturr	61501d4d14	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-18 12:10:20 +00:00
Madalina Raicu	f8f3ce7df9	fix: no oracle for this market banner	2023-05-18 13:00:17 +01:00
Maciek	f7aab5a78a	feat(ui-toolkit,trading): allow toast box configuration (#3811 )	2023-05-18 12:53:36 +01:00
Bartłomiej Głownia	2904975fd3	feat(trading): highlight negative oracle statuses in market lists (#3816 )	2023-05-18 13:22:54 +02:00
Mikołaj Młodzikowski	4f55c946f0	feat(ci): add pipeline for rollback console deployments (#3817 )	2023-05-18 10:11:41 +00:00
Matthew Russell	de637fee13	chore(trading): show markets in opening auction in market selector (#3814 )	2023-05-18 09:49:44 +01:00
dexturr	69c6db8ec2	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-18 06:09:07 +00:00
Matthew Russell	8dc465c1d1	feat(trading): additional row actions for tables (#3600 )	2023-05-17 21:05:53 -07:00
dexturr	0be934edca	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-18 00:16:39 +00:00
Matthew Russell	653688c1dd	fix(governance): clear wallet state if user changes to a non existent party (#3813 )	2023-05-17 19:25:14 +00:00
dexturr	34400be18a	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-17 18:09:58 +00:00
Sam Keen	d4a0a4a42c	fix(governance): updated page titles (#3810 )	2023-05-17 16:16:19 +00:00
Joe Tsang	fabf643ce7	chore(ci): fix nightly test runner (#3804 )	2023-05-17 16:21:10 +01:00
Sam Keen	45e210092c	fix(governance): ensure no negative overstaked penalty (#3794 )	2023-05-17 14:41:55 +00:00
Ciaran McGhie	1dc3b3fd05	fix(ui-toolkit): add keys to healthbar segments (#3797 )	2023-05-17 15:14:11 +01:00
Sam Keen	0a80e3e39d	fix(governance): avoid unknown pubkey causing validator page error (#3755 )	2023-05-17 13:21:00 +00:00
Sam Keen	7b8d9dc94b	feat(governance): validator tables refocused on stake (#3780 )	2023-05-17 14:14:23 +01:00
Daniel	c0320c2468	feat(ci): update DNS for mainnet console when new version is released (#3783 )	2023-05-17 14:45:06 +02:00
Sam Keen	11173d6614	fix(governance): point to correct data for displayed LP rewards (#3800 )	2023-05-17 12:20:51 +00:00
dexturr	e3324331e2	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-05-17 12:11:33 +00:00
Maciek	0a6e3cb6f5	chore(trading): refactor docs links resolver (#3782 )	2023-05-17 12:10:31 +02:00
Sam Keen	68ede90609	feat(3779): proposal terms in table, full proposal json, description … (#3793 )	2023-05-17 08:23:25 +00:00
				`@@ -0,0 +1 @@`
				`export { ProposalDescription } from './proposal-description';`
				`@@ -0,0 +1 @@`
				`export { ProposalJson } from './proposal-json';`
				`@@ -1 +0,0 @@`
				`export { ProposalTermsJson } from './proposal-terms-json';`
				`@@ -0,0 +1 @@`
				`export { ProposalTerms } from './proposal-terms';`