fix(proposals): protocol upgrade notification block querying

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,6 +1,6 @@
 # Related issues 🔗
 
-Closes #[Issue number here]
+Issue: #[Issue number here]
 
 # Description ℹ️
 

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

@@ -14,8 +14,6 @@ on:
       - synchronize
 jobs:
   node-modules:
-    # All jobs depend on node_modules, so none should run if the PR is in draft
-    if: github.event.pull_request.draft == false
     runs-on: ubuntu-22.04
     name: 'Cache yarn modules'
     steps:
@@ -23,6 +21,7 @@ jobs:
         uses: actions/checkout@v3
         with:
           ref: ${{ github.event.pull_request.head.sha || github.sha }}
+
       - name: Cache node modules
         id: cache
         uses: actions/cache@v3
@@ -40,6 +39,7 @@ jobs:
           node-version-file: '.nvmrc'
           # https://stackoverflow.com/questions/61010294/how-to-cache-yarn-packages-in-github-actions
           cache: yarn
+
       - name: yarn install
         if: steps.cache.outputs.cache-hit != 'true'
         run: yarn install --pure-lockfile
@@ -51,11 +51,11 @@ jobs:
     uses: ./.github/workflows/lint-pr.yml
     secrets: inherit
 
-  lint-format:
-    timeout-minutes: 20
+  lint-test-build:
+    timeout-minutes: 60
     needs: node-modules
     runs-on: ubuntu-22.04
-    name: '(CI) lint + format check'
+    name: '(CI) lint + unit test + build'
     steps:
       - name: Checkout
         uses: actions/checkout@v3
@@ -81,76 +81,6 @@ jobs:
         with:
           main-branch-name: develop
 
-      - name: Check formatting
-        run: yarn nx format:check
-
-      - name: Lint affected
-        run: yarn nx affected:lint --max-warnings=0
-
-      - name: Build affected spec
-        run: yarn nx affected --target=build-spec
-
-  test-affected:
-    timeout-minutes: 30
-    needs: build-sources
-    runs-on: ubuntu-22.04
-    name: 'run unit test of affected apps'
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-          ref: ${{ github.event.pull_request.head.sha || github.sha }}
-
-      - name: Setup node
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: '.nvmrc'
-          cache: yarn
-
-      - name: Cache node modules
-        uses: actions/cache@v3
-        with:
-          path: node_modules
-          key: ${{ runner.os }}-cache-node-modules-${{ hashFiles('yarn.lock') }}
-
-      - name: Derive appropriate SHAs for base and head for `nx affected` commands
-        uses: nrwl/nx-set-shas@v3
-        with:
-          main-branch-name: develop
-
-      - name: Test affected
-        run: yarn nx affected:test
-
-  build-sources:
-    timeout-minutes: 30
-    needs: lint-format
-    runs-on: ubuntu-22.04
-    name: 'Build sources of affected apps'
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-          ref: ${{ github.event.pull_request.head.sha || github.sha }}
-
-      - name: Setup node
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: '.nvmrc'
-          cache: yarn
-
-      - name: Cache node modules
-        uses: actions/cache@v3
-        with:
-          path: node_modules
-          key: ${{ runner.os }}-cache-node-modules-${{ hashFiles('yarn.lock') }}
-
-      - name: Derive appropriate SHAs for base and head for `nx affected` commands
-        uses: nrwl/nx-set-shas@v3
-        with:
-          main-branch-name: develop
-
       # See affected apps
       - name: See affected apps
         run: |
@@ -167,8 +97,21 @@ jobs:
           echo "preview_explorer: ${{ env.PREVIEW_EXPLORER }}"
           echo "preview_tools: ${{ env.PREVIEW_TOOLS }}"
 
+      - name: Check formatting
+        run: yarn nx format:check
+
+      - name: Lint affected
+        run: yarn nx affected:lint --max-warnings=0
+
+      - name: Build affected spec
+        run: yarn nx affected --target=build-spec
+
+      - name: Test affected
+        run: yarn nx affected:test
+
       - name: Build affected
         run: yarn nx affected:build || (yarn install && yarn nx affected:build)
+
     outputs:
       projects: ${{ env.PROJECTS }}
       projects-e2e: ${{ env.PROJECTS_E2E }}
@@ -177,39 +120,39 @@ jobs:
       preview_explorer: ${{ env.PREVIEW_EXPLORER }}
       preview_tools: ${{ env.PREVIEW_TOOLS }}
 
-  # console-e2e:
-  #   needs: build-sources
-  #   name: '(CI) console python'
-  #   uses: ./.github/workflows/console-test-run.yml
-  #   secrets: inherit
-  #   if: ${{ contains(fromJSON(needs.build-sources.outputs.projects), 'trading') && github.event_name == 'pull_request' }}
-  #   with:
-  #     github-sha: ${{ github.event.pull_request.head.sha || github.sha }}
+  console-e2e:
+    needs: lint-test-build
+    name: '(CI) console python'
+    uses: ./.github/workflows/console-test-run.yml
+    secrets: inherit
+    if: ${{ contains(fromJSON(needs.lint-test-build.outputs.projects), 'trading') && github.event_name == 'pull_request' }}
+    with:
+      github-sha: ${{ github.event.pull_request.head.sha || github.sha }}
 
   cypress:
-    needs: build-sources
+    needs: lint-test-build
     name: '(CI) cypress'
-    # if: ${{ needs.build-sources.outputs.projects-e2e != '[]' }}
+    # if: ${{ needs.lint-test-build.outputs.projects-e2e != '[]' }}
     uses: ./.github/workflows/cypress-run.yml
     secrets: inherit
     with:
-      projects: ${{ needs.build-sources.outputs.projects-e2e }}
+      projects: ${{ needs.lint-test-build.outputs.projects-e2e }}
       tags: '@smoke'
 
   publish-dist:
-    needs: build-sources
+    needs: lint-test-build
     name: '(CD) publish dist'
     if: ${{ (github.event_name == 'pull_request' &&  github.event.pull_request.head.repo.full_name == 'vegaprotocol/frontend-monorepo') || github.event_name == 'push' }}
     uses: ./.github/workflows/publish-dist.yml
     secrets: inherit
     with:
-      projects: ${{ needs.build-sources.outputs.projects }}
+      projects: ${{ needs.lint-test-build.outputs.projects }}
 
   dist-check:
     runs-on: ubuntu-latest
     needs:
       - publish-dist
-      - build-sources
+      - lint-test-build
     if: ${{ github.event_name == 'pull_request' &&  github.event.pull_request.head.repo.full_name == 'vegaprotocol/frontend-monorepo' }}
     timeout-minutes: 60
     name: '(CD) comment preview links'
@@ -225,27 +168,27 @@ jobs:
         run: |
           # https://stackoverflow.com/questions/3183444/check-for-valid-link-url
           regex='(https?|ftp|file)://[-[:alnum:]\+&@#/%?=~_|!:,.;]*[-[:alnum:]\+&@#/%=~_|]'
-          if [[ "${{ needs.build-sources.outputs.preview_governance }}" =~ $regex ]]; then
-            until curl --insecure --location --fail "${{ needs.build-sources.outputs.preview_governance }}"; do
-              echo "waiting for governance preview: ${{ needs.build-sources.outputs.preview_governance }}"
+          if [[ "${{ needs.lint-test-build.outputs.preview_governance }}" =~ $regex ]]; then
+            until curl --insecure --location --fail "${{ needs.lint-test-build.outputs.preview_governance }}"; do
+              echo "waiting for governance preview: ${{ needs.lint-test-build.outputs.preview_governance }}"
               sleep 5
             done
           fi
-          if [[ "${{ needs.build-sources.outputs.preview_explorer }}" =~ $regex ]]; then
-            until curl --insecure --location --fail "${{ needs.build-sources.outputs.preview_explorer }}"; do
-              echo "waiting for explorer preview: ${{ needs.build-sources.outputs.preview_explorer }}"
+          if [[ "${{ needs.lint-test-build.outputs.preview_explorer }}" =~ $regex ]]; then
+            until curl --insecure --location --fail "${{ needs.lint-test-build.outputs.preview_explorer }}"; do
+              echo "waiting for explorer preview: ${{ needs.lint-test-build.outputs.preview_explorer }}"
               sleep 5
             done
           fi
-          if [[ "${{ needs.build-sources.outputs.preview_trading }}" =~ $regex ]]; then
-            until curl --insecure --location --fail "${{ needs.build-sources.outputs.preview_trading }}"; do
-              echo "waiting for trading preview: ${{ needs.build-sources.outputs.preview_trading }}"
+          if [[ "${{ needs.lint-test-build.outputs.preview_trading }}" =~ $regex ]]; then
+            until curl --insecure --location --fail "${{ needs.lint-test-build.outputs.preview_trading }}"; do
+              echo "waiting for trading preview: ${{ needs.lint-test-build.outputs.preview_trading }}"
               sleep 5
             done
           fi
-          if [[ "${{ needs.build-sources.outputs.preview_tools }}" =~ $regex ]]; then
-            until curl --insecure --location --fail "${{ needs.build-sources.outputs.preview_tools }}"; do
-              echo "waiting for tools preview: ${{ needs.build-sources.outputs.preview_tools }}"
+          if [[ "${{ needs.lint-test-build.outputs.preview_tools }}" =~ $regex ]]; then
+            until curl --insecure --location --fail "${{ needs.lint-test-build.outputs.preview_tools }}"; do
+              echo "waiting for tools preview: ${{ needs.lint-test-build.outputs.preview_tools }}"
               sleep 5
             done
           fi
@@ -257,10 +200,10 @@ jobs:
           issue-number: ${{ github.event.pull_request.number }}
           body: |
             Previews
-            * governance: ${{ needs.build-sources.outputs.preview_governance }}
-            * explorer: ${{ needs.build-sources.outputs.preview_explorer  }}
-            * trading: ${{ needs.build-sources.outputs.preview_trading }}
-            * tools: ${{ needs.build-sources.outputs.preview_tools }}
+            * governance: ${{ needs.lint-test-build.outputs.preview_governance }}
+            * explorer: ${{ needs.lint-test-build.outputs.preview_explorer  }}
+            * trading: ${{ needs.lint-test-build.outputs.preview_trading }}
+            * tools: ${{ needs.lint-test-build.outputs.preview_tools }}
 
   # Report single result at the end, to avoid mess with required checks in PR
   cypress-check:

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

@@ -1,8 +1,5 @@
 name: (CI) Console tests
 
-env:
-  VEGA_VERSION: v0.72.14
-
 on:
   workflow_call:
     inputs:
@@ -13,8 +10,8 @@ on:
 jobs:
   run-tests:
     name: run-tests
-    runs-on: console-test
-    timeout-minutes: 40
+    runs-on: 8-cores
+    timeout-minutes: 20
     steps:
       #----------------------------------------------
       #       check-out frontend-monorepo
@@ -36,6 +33,15 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-cache-node-modules-
       #----------------------------------------------
+      #       setup node
+      #----------------------------------------------
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: '.nvmrc'
+          # https://stackoverflow.com/questions/61010294/how-to-cache-yarn-packages-in-github-actions
+          cache: yarn
+      #----------------------------------------------
       #       install deps if cache missing
       #----------------------------------------------
       - name: yarn install
@@ -70,46 +76,56 @@ jobs:
           repository: vegaprotocol/console-test
           path: './console-test'
       #----------------------------------------------
-      #       install dependencies
+      #       set-up python
+      #----------------------------------------------
+      - name: Set up python
+        id: setup-python
+        uses: actions/setup-python@v4
+        with:
+          python-version: '3.10.11'
+      #----------------------------------------------
+      #  -----  install & configure poetry  -----
+      #----------------------------------------------
+      - name: Install Poetry
+        uses: snok/install-poetry@v1
+        with:
+          virtualenvs-create: true
+          virtualenvs-in-project: true
+          virtualenvs-path: console-test/.venv
+      #----------------------------------------------
+      #       load cached venv if cache exists
+      #----------------------------------------------
+      - name: Load cached venv
+        id: cached-poetry-dependencies
+        uses: actions/cache@v3
+        with:
+          path: console-test/.venv
+          key: venv-${{ runner.os }}-${{ steps.setup-python.outputs.python-version }}-${{ hashFiles('**/poetry.lock') }}
+      #----------------------------------------------
+      # install dependencies if cache does not exist
       #----------------------------------------------
       - name: Install dependencies
         working-directory: ./console-test
+        if: steps.cached-poetry-dependencies.outputs.cache-hit != 'true'
         run: poetry install --no-interaction --no-root
       #----------------------------------------------
-      #       find vega binaries path
-      #----------------------------------------------
-      - name: Find vega binaries path
-        id: vega_bin_path
-        working-directory: ./console-test
-        run: echo path=$(poetry run python -c "import vega_sim; print(vega_sim.vega_bin_path)") >> $GITHUB_OUTPUT
-      #----------------------------------------------
-      #       vega binaries cache
-      #----------------------------------------------
-      - name: Vega binaries cache
-        uses: actions/cache@v3
-        id: vega_binaries_cache
-        with:
-          path: ${{ steps.vega_bin_path.outputs.path }}
-          key: ${{ runner.os }}-vega-binaries-${{ env.VEGA_VERSION }}
-      #----------------------------------------------
-      #       install vega binaries
+      # install vega binaries
       #----------------------------------------------
       - name: Install vega binaries
         working-directory: ./console-test
-        if: steps.vega_binaries_cache.outputs.cache-hit != 'true'
-        run: poetry run python -m vega_sim.tools.load_binaries --force --version $VEGA_VERSION
+        run: poetry run python -m vega_sim.tools.load_binaries --force
       #----------------------------------------------
       # install playwright
       #----------------------------------------------
       - name: install playwright
-        run: poetry run playwright install --with-deps chromium
+        run: poetry run playwright install
         working-directory: ./console-test
       #----------------------------------------------
       # run tests
       #----------------------------------------------
       - name: Run tests
         working-directory: ./console-test
-        run: poetry run pytest -v -s --numprocesses 2 --dist loadfile --durations=20
+        run: poetry run pytest -v -s --numprocesses auto --dist loadfile --durations=20
       - name: Check files
         run: |
           ls -al .

.github/workflows/cypress-run.yml

@@ -37,7 +37,6 @@ jobs:
 
       # Restore node_modules from cache if possible
       - name: Restore node_modules from cache
-        id: cache-node-modules
         uses: actions/cache@v3
         with:
           path: |
@@ -47,7 +46,6 @@ jobs:
 
       # Install frontend dependencies
       - name: Install root dependencies
-        if: steps.cache-node-modules.outputs.cache-hit != 'true'
         run: yarn install --frozen-lockfile
         working-directory: frontend-monorepo
 
@@ -69,7 +67,7 @@ jobs:
       ######
 
       - name: Run Cypress tests
-        run: yarn nx run ${{ matrix.project }}:e2e ${{ env.SKIP_CACHE }} --browser chrome --env.grepTags="${{ inputs.tags }}"
+        run: yarn nx run ${{ matrix.project }}:e2e ${{ env.SKIP_CACHE }}  --browser chrome --env.grepTags="${{ inputs.tags }}"
         working-directory: frontend-monorepo
         env:
           CYPRESS_SLACK_WEBHOOK: ${{ secrets.CYPRESS_SLACK_WEBHOOK }}

.github/workflows/publish-dist.yml

@@ -155,10 +155,10 @@ jobs:
       - name: Sanity check docker image
         run: |
           echo "Check ipfs-hash"
-          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local /bin/sh -c 'cat /ipfs-hash'
-          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local /bin/sh -c 'cat /ipfs-hash' > ${{ matrix.app }}-ipfs-hash
+          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local cat /ipfs-hash
+          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local cat /ipfs-hash > ${{ matrix.app }}-ipfs-hash
           echo "List html directory"
-          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local /bin/sh -c 'apk add --update tree; tree /usr/share/nginx/html'
+          docker run --rm ghcr.io/vegaprotocol/frontend/${{ matrix.app }}:local sh -c 'apk add --update tree; tree /usr/share/nginx/html'
 
       - name: Publish dist as docker image (ghcr)
         uses: docker/build-push-action@v3
@@ -329,9 +329,7 @@ jobs:
             fi
 
             # create commit
-            if ! git diff --cached --exit-code; then
-              commit_msg="Automated hash update from ${{ github.ref }}"
-              git commit -m "$commit_msg"
-              git push -u origin "main"
-            fi
+            commit_msg="Automated hash update from ${{ github.ref }}"
+            git commit -m "$commit_msg"
+            git push -u origin "main"
           )

.husky/commit-msg

@@ -3,3 +3,6 @@
 
 # Lint commit messages to ensure they follow conventional commit standards
 yarn commitlint --edit "${1}"
+
+# Lint all staged files
+yarn lint-staged

.husky/pre-commit

@@ -1,5 +0,0 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-# Lint all staged files
-yarn lint-staged

.husky/pre-push

@@ -1,8 +0,0 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-# Lint all staged files
-yarn nx format:check
-
-# Test all projects with changes
-yarn nx affected -t test --exclude trading

.nvmrc

@@ -1 +1 @@
-16.20.2
+16.15.1

CODEOWNERS

@@ -1,3 +1,2 @@
 * @vegaprotocol/frontend
-* @vegaprotocol/frontend-qa
 *.graphql @vegaprotocol/core

Makefile

@@ -11,7 +11,7 @@ recalculate-ipfs:
 	echo "ipfs hash inside the image"
 	docker run --rm ${TAG} cat /ipfs-hash
 	echo "recalculating ipfs hash"
-	docker run --rm ${TAG} ipfs add -rQ /usr/share/nginx/html
+	docker run --rm ${TAG} ipfs add -r /usr/share/nginx/html
 
 .PHONY: eject-ipfs-hash
 unpack:

README.md

@@ -113,47 +113,13 @@ In order to run a container on port 3000:
 docker run -p 3000:80 [TAG]
 ```
 
-On top of that there are two possible scenarios for running docker image - using nginx server (default) of ipfs daemon.
-
-to run ipfs on port 3000:
-
-```bash
-docker run -p 3000:80 [TAG] /run-ipfs.sh
-```
-
-to run nginx on port 3000:
-
-```bash
-docker run -p 3000:80 [TAG]
-```
-
 ## Build instructions
 
-The [`docker`](./docker) subfolder has some docker configurations for easily setting up your own hosted version of Console either for the web, or ready for pinning on IPFS.
-
-### nx build inside the docker
-
-Using multistage dockerfile dist is compiled using [node](https://hub.docker.com/_/node) image and later packed to nginx as in [dist build](#dist-build). The multistage builds ensures consistent CPU architecture and build toolchains are used so that the result will be identical.
-
-```bash
-docker build --build-arg APP=[YOUR APP] --build-arg NODE_VERSION=16.5.1 --build-arg ENV_NAME=mainnet -t [TAG] -f docker/node-inside-docker.Dockerfile .
-```
-
-### Computing ipfs-hash of the build
-
-At the moment this feature is important only for Console releases.
-
-Each docker build finishes with hash calculation for ` dist`` directory. Resulting hash is added to file named as  `/ipfs-hash`. Once docker image is produced you can run following commad to display ipfs-hash:
-
-```bash
-make recalculate-ipfs TAG=vegaprotocol/trading:{YOUR_VERSION}
-```
-
-**updating hash:** recompiling dist directory (even if there are no changed to source code) results in different hash computed by ipfs command.
+The [`docker`](./docker) subfolder has some docker configurations for easily setting up your own hosted version of console either for the web, or ready for pinning on IPFS
 
 ### nx build outside the docker
 
-This Docker image packages a pre-built `dist` folder into an [`nginx`](https://hub.docker.com/_/nginx)([server configuration](./nginx/nginx.conf)) docker image. In this case, the application on docker host machine from source.
+Packaging prepared dist into [`nginx`](https://hub.docker.com/_/nginx)([server configuration](./nginx/nginx.conf)) docker image involves building the application on docker host machine from source.
 
 As a prerequisite you need to perform build of `dist` directory and move its content for specific application to `dist-result` directory. Use following script to do it with a single command:
 
@@ -164,21 +130,41 @@ As a prerequisite you need to perform build of `dist` directory and move its con
 You can build any of the containers locally with the following command:
 
 ```bash
-docker build -f docker/node-outside-docker.Dockerfile . --tag=[TAG]
+docker build --dockerfile docker/node-outside-docker.Dockerfile . --tag=[TAG]
 ```
 
+### nx build inside the docker
+
+Using multistage dockerfile dist is compiled using [node](https://hub.docker.com/_/node) image and later packed to nginx as in [dist build](#dist-build) example.
+
+```bash
+docker build --build-arg APP=[YOUR APP] --build-arg NODE_VERSION=$(cat .nvmrc) --build-arg ENV_NAME=mainnet -t [TAG] -f docker/node-inside-docker.Dockerfile .
+```
+
+### Computing ipfs-hash of the build
+
+At the moment this feature is important only for `trading` (console) releases.
+
+Each docker build finishes with hash calculation for dist directory. Resulting hash is added to file named as `/ipfs-hash`. Once docker image is produced you can run following commad to display ipfs-hash:
+
+```bash
+make recalculate-ipfs TAG=vegaprotocol/trading:{YOUR_VERSION}
+```
+
+**updating hash:** recompiling dist directory (even if there are no changed to source code) results in different hash computed by ipfs command.
+
 ### Verifying ipfs-hash of existing current application version
 
 An IPFS CID will be attached to every [release](https://github.com/vegaprotocol/frontend-monorepo/releases). If you are intending to pin an application on IPFS, you can check that your build matches by running the following steps:
 
-1. Show latest release by running: `make latest-release`. You need to configure [`gh`](https://cli.github.com/) for this step to work, otherwise please provide release manually from [github](https://github.com/vegaprotocol/frontend-monorepo/releases) or [dockerhub](https://hub.docker.com/r/vegaprotocol/trading)
+1. Show latest release by runnning: `make latest-release`. You need to configure [`gh`](https://cli.github.com/) for this step to work, otherwise please provide release manually from [github](https://github.com/vegaprotocol/frontend-monorepo/releases) or [dockerhub](https://hub.docker.com/r/vegaprotocol/trading)
 2. Set RELEASE environment variable to value that you want to validate: `export RELEASE=$(make latest-release)` or `export RELEASE=vXX.XX.XX`
 3. Set TAG environment variable to image that you want to validate: `export TAG=vegaprotocol/trading:$RELEASE`
 4. Download docker image with the desired release `docker pull $TAG`.
 5. Recalculate hash: `make recalculate-ipfs`
 6. You should see exactly same hash produced by ipfs command as one placed with the release notes: `make show-latest-release`
 7. If you want to extract dist from docker image to your local filesystem you can run following command: `make unpack`
-8. Now `dist` directory contains valid application build
+8. Now `dist` directory contains valid application build. **it is not possible to calculate same ipfs hash on files that are result of copy operation**
 
 ## Config
 

apps/explorer-e2e/.env.devnet

@@ -4,8 +4,6 @@ NX_TENDERMINT_WEBSOCKET_URL=wss://n04.d.vega.xyz/tm/websocket
 NX_VEGA_URL=https://api.n04.d.vega.xyz/graphql
 NX_VEGA_ENV=DEVNET
 NX_BLOCK_EXPLORER=https://be.devnet1.vega.xyz/rest
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
-
 
 # App flags
 NX_EXPLORER_ASSETS=1

apps/explorer-e2e/.env.mainnet

@@ -4,7 +4,6 @@ NX_TENDERMINT_WEBSOCKET_URL=wss://mainnet-observer-proxy01.ops.vega.xyz/websocke
 NX_VEGA_URL=https://api.vega.community/graphql
 NX_VEGA_ENV=MAINNET
 NX_BLOCK_EXPLORER=https://be.explorer.vega.xyz/rest
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 # App flags
 NX_EXPLORER_ASSETS=1

apps/explorer-e2e/.env.testnet

@@ -4,7 +4,6 @@ NX_TENDERMINT_WEBSOCKET_URL=wss://lb.testnet.vega.xyz/tm/websocket
 NX_VEGA_URL=https://api.n07.testnet.vega.xyz/graphql
 NX_VEGA_ENV=TESTNET
 NX_BLOCK_EXPLORER=https://be.testnet.vega.xyz/rest
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 # App flags
 NX_EXPLORER_ASSETS=1

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

@@ -1,9 +1,12 @@
 context('Network parameters page', { tags: '@smoke' }, function () {
   before('navigate to network parameter page', function () {
     cy.fixture('net_parameter_format_lookup').as('networkParameterFormat');
-    cy.visit('/network-parameters');
   });
   describe('Verify elements on page', function () {
+    beforeEach(() => {
+      cy.visit('/network-parameters');
+    });
+
     const networkParametersHeader = '[data-testid="network-param-header"]';
     const tableRows = '[data-testid="key-value-table-row"]';
 
@@ -13,7 +16,6 @@ context('Network parameters page', { tags: '@smoke' }, function () {
         .and('be.visible');
     });
 
-    // 0006-NETW-021
     it('should list each of the network parameters available', function () {
       cy.get_network_parameters().then((network_parameters) => {
         const numberOfNetworkParametersInSystem =
@@ -196,19 +198,6 @@ context('Network parameters page', { tags: '@smoke' }, function () {
       });
     });
 
-    // 0006-NETW-022 0006-NETW-023
-    it('governance assets should be correctly grouped', function () {
-      cy.getByTestId('governance')
-        .should('exist')
-        .parent()
-        .should('have.attr', 'href', '/network-parameters#governance');
-      cy.get('[id="governance-proposal-asset"]')
-        .parent()
-        .within(() => {
-          cy.getByTestId('key-value-table-row').should('have.length', 8);
-        });
-    });
-
     it('should be able to see network parameters - on mobile', function () {
       cy.switchToMobile();
       cy.get_network_parameters().then((network_parameters) => {

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

@@ -1,68 +0,0 @@
-context('Oracle page', { tags: '@smoke' }, () => {
-  describe('Verify elements on page', () => {
-    before('create market and navigate to oracle page', () => {
-      cy.createMarket();
-      cy.visit('/oracles');
-    });
-    it('should see oracle data', () => {
-      cy.getByTestId('oracle-details').should('have.length.at.least', 2);
-      cy.getByTestId('oracle-details')
-        .should('exist')
-        .eq(0)
-        .within(() => {
-          cy.get('tr')
-            .eq(0)
-            .within(() => {
-              cy.get('th').should('have.text', 'ID');
-              cy.get('a').invoke('text').should('have.length', 64);
-              cy.get('a')
-                .should('have.attr', 'href')
-                .and('contain', '/oracles/');
-            });
-          cy.get('tr')
-            .eq(1)
-            .within(() => {
-              cy.get('th').should('have.text', 'Type');
-              cy.get('td').should('have.text', 'External data');
-            });
-          cy.get('tr')
-            .eq(2)
-            .within(() => {
-              cy.get('th').should('have.text', 'Signer');
-              cy.getByTestId('keytype').should('have.text', 'Vega');
-              cy.get('a').invoke('text').should('have.length', 64);
-              cy.get('a')
-                .should('have.attr', 'href')
-                .and('contain', '/parties/');
-            });
-          cy.get('tr')
-            .eq(3)
-            .within(() => {
-              cy.get('th').should('have.text', 'Settlement for');
-              cy.get('a').invoke('text').should('have.length', 64);
-              cy.get('a')
-                .should('have.attr', 'href')
-                .and('contain', '/markets/');
-            });
-          cy.get('tr')
-            .eq(4)
-            .within(() => {
-              cy.get('th').should('have.text', 'Matched data');
-              cy.get('td').should('have.text', '❌');
-            });
-          cy.get('details')
-            .eq(0)
-            .within(() => {
-              cy.contains('Filter').click();
-              cy.get('.language-json').should('exist');
-            });
-          cy.get('details')
-            .eq(1)
-            .within(() => {
-              cy.contains('JSON').click();
-              cy.get('.language-json').should('exist');
-            });
-        });
-    });
-  });
-});

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

@@ -26,6 +26,7 @@ function getSuccessorTxBody(parentMarketId) {
             positionDecimalPlaces: '5',
             linearSlippageFactor: '0.001',
             quadraticSlippageFactor: '0',
+            lpPriceRange: '10',
             instrument: {
               name: 'Token test market',
               code: 'TEST.24h',

apps/explorer/.env.capsule

@@ -3,7 +3,6 @@ NX_VEGA_ENV=CUSTOM
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/test/announcements.json
 NX_VEGA_EXPLORER_URL=/
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 # App flags
 NX_EXPLORER_TXS_LIST=0

apps/explorer/.env.devnet

@@ -8,7 +8,6 @@ NX_VEGA_URL=https://api.devnet1.vega.xyz/graphql
 NX_VEGA_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/networks-internal/main/devnet1/vegawallet-devnet1.toml
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_EXPLORER_URL=/
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_TENDERMINT_URL=https://tm.be.devnet1.vega.xyz/
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.devnet1.vega.xyz/websocket

apps/explorer/.env.mainnet

@@ -9,7 +9,6 @@ NX_VEGA_GOVERNANCE_URL=https://governance.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_EXPLORER_URL=https://explorer.vega.xyz/
 NX_VEGA_CONSOLE_URL=https://console.vega.xyz
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_TENDERMINT_URL=https://be.vega.community
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.vega.community/websocket

apps/explorer/.env.mainnet-mirror

@@ -9,7 +9,6 @@ NX_VEGA_GOVERNANCE_URL=https://governance.mainnet-mirror.vega.rocks
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_EXPLORER_URL=https://explorer.mainnet-mirror.vega.rocks/
 NX_VEGA_CONSOLE_URL=https://console.mainnet-mirror.vega.rocks
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_TENDERMINT_URL=https://be.mainnet-mirror.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.mainnet-mirror.vega.rocks/websocket

apps/explorer/.env.stagnet1

@@ -1,3 +1,2 @@
 # .env is stagnet1, so there are no overrides required
 NX_VEGA_NETWORKS='{"TESTNET":"https://explorer.fairground.wtf","MAINNET":"https://explorer.vega.xyz","STAGNET1":"https://stagnet1.explorer.vega.xyz"}'
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json

apps/explorer/.env.testnet

@@ -9,7 +9,6 @@ NX_VEGA_GOVERNANCE_URL=https://governance.fairground.wtf
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_EXPLORER_URL=https://explorer.fairground.wtf
 NX_VEGA_CONSOLE_URL=https://console.fairground.wtf
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_TENDERMINT_URL=https://tm.be.testnet.vega.xyz
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket

apps/explorer/.env.validators-testnet

@@ -11,7 +11,6 @@ NX_BLOCK_EXPLORER=https://be.validators-testnet.vega.rocks/rest
 NX_VEGA_GOVERNANCE_URL=https://governance.validators-testnet.vega.rocks
 NX_VEGA_EXPLORER_URL=https://explorer.validators-testnet.vega.rocks/
 NX_VEGA_CONSOLE_URL=https://trading.validators-testnet.vega.rocks/
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_TENDERMINT_URL=https://tm.be.validators-testnet.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.validators-testnet.vega.xyz/websocket

apps/explorer/.env.vegacapsule

@@ -5,5 +5,4 @@ NX_VEGA_ENV=CUSTOM
 NX_BLOCK_EXPLORER=
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/test/announcements.json
-NX_VEGA_EXPLORER_URL=/
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
+NX_VEGA_EXPLORER_URL=/

apps/explorer/src/app/components/links/market-link/Market.graphql

@@ -13,12 +13,6 @@ query ExplorerMarket($id: ID!) {
               decimals
             }
           }
-          ... on Perpetual {
-            quoteName
-            settlementAsset {
-              decimals
-            }
-          }
         }
       }
     }

apps/explorer/src/app/components/links/market-link/__generated__/Market.ts

@@ -8,7 +8,7 @@ export type ExplorerMarketQueryVariables = Types.Exact<{
 }>;
 
 
-export type ExplorerMarketQuery = { __typename?: 'Query', market?: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string, settlementAsset: { __typename?: 'Asset', decimals: number } } | { __typename?: 'Perpetual', quoteName: string, settlementAsset: { __typename?: 'Asset', decimals: number } } | { __typename?: 'Spot' } } } } | null };
+export type ExplorerMarketQuery = { __typename?: 'Query', market?: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string, settlementAsset: { __typename?: 'Asset', decimals: number } } } } } | null };
 
 
 export const ExplorerMarketDocument = gql`
@@ -27,12 +27,6 @@ export const ExplorerMarketDocument = gql`
               decimals
             }
           }
-          ... on Perpetual {
-            quoteName
-            settlementAsset {
-              decimals
-            }
-          }
         }
       }
     }

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

@@ -61,7 +61,6 @@ describe('Market link component', () => {
               instrument: {
                 name: 'test-label',
                 product: {
-                  __typename: 'Future',
                   quoteName: 'dai',
                 },
               },

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

@@ -3,14 +3,13 @@ import type { MarketInfoWithData } from '@vegaprotocol/markets';
 import {
   PriceMonitoringBoundsInfoPanel,
   SuccessionLineInfoPanel,
-  getDataSourceSpecForSettlementData,
-  getDataSourceSpecForTradingTermination,
 } from '@vegaprotocol/markets';
 import {
   LiquidityInfoPanel,
   LiquidityMonitoringParametersInfoPanel,
   InstrumentInfoPanel,
   KeyDetailsInfoPanel,
+  LiquidityPriceRangeInfoPanel,
   MetadataInfoPanel,
   OracleInfoPanel,
   RiskFactorsInfoPanel,
@@ -19,21 +18,20 @@ import {
   SettlementAssetInfoPanel,
 } from '@vegaprotocol/markets';
 import { MarketInfoTable } from '@vegaprotocol/markets';
-import type { DataSourceFragment } from '@vegaprotocol/markets';
+import type { DataSourceDefinition } from '@vegaprotocol/types';
 import isEqual from 'lodash/isEqual';
 
 export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
   if (!market) return null;
-  const { product } = market.tradableInstrument.instrument;
-  const settlementDataSource = getDataSourceSpecForSettlementData(product);
-  const terminationDataSource = getDataSourceSpecForTradingTermination(product);
 
-  const getSigners = ({ data }: DataSourceFragment) => {
+  const settlementData = market.tradableInstrument.instrument.product
+    .dataSourceSpecForSettlementData.data as DataSourceDefinition;
+  const terminationData = market.tradableInstrument.instrument.product
+    .dataSourceSpecForTradingTermination.data as DataSourceDefinition;
+
+  const getSigners = (data: DataSourceDefinition) => {
     if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
-      const signers =
-        ('signers' in data.sourceType.sourceType &&
-          data.sourceType.sourceType.signers) ||
-        [];
+      const signers = data.sourceType.sourceType.signers || [];
 
       return signers.map(({ signer }, i) => {
         return (
@@ -45,13 +43,10 @@ export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
     return [];
   };
 
-  const showTwoOracles =
-    settlementDataSource &&
-    terminationDataSource &&
-    isEqual(
-      getSigners(settlementDataSource),
-      getSigners(terminationDataSource)
-    );
+  const showTwoOracles = isEqual(
+    getSigners(settlementData),
+    getSigners(terminationData)
+  );
 
   const headerClassName = 'font-alpha calt text-xl mt-4 border-b-2 pb-2';
 
@@ -96,6 +91,8 @@ export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
       <LiquidityMonitoringParametersInfoPanel market={market} />
       <h2 className={headerClassName}>{t('Liquidity')}</h2>
       <LiquidityInfoPanel market={market} />
+      <h2 className={headerClassName}>{t('Liquidity price range')}</h2>
+      <LiquidityPriceRangeInfoPanel market={market} />
       {showTwoOracles ? (
         <>
           <h2 className={headerClassName}>{t('Settlement oracle')}</h2>

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

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { getAsset, type MarketFieldsFragment } from '@vegaprotocol/markets';
+import type { MarketFieldsFragment } from '@vegaprotocol/markets';
 import { t } from '@vegaprotocol/i18n';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 import type { AgGridReact } from 'ag-grid-react';
@@ -73,7 +73,8 @@ export const MarketsTable = ({ data }: MarketsTableProps) => {
           MarketFieldsFragment,
           'tradableInstrument.instrument.product.settlementAsset.symbol'
         >) => {
-          const value = data && getAsset(data);
+          const value =
+            data?.tradableInstrument.instrument.product.settlementAsset;
           return value ? (
             <ButtonLink
               onClick={(e) => {

apps/explorer/src/app/components/order-details/Order.graphql

@@ -31,9 +31,6 @@ fragment ExplorerDeterministicOrderFields on Order {
           ... on Future {
             quoteName
           }
-          ... on Perpetual {
-            quoteName
-          }
         }
       }
     }

apps/explorer/src/app/components/order-details/__generated__/Order.ts

@@ -3,7 +3,7 @@ import * as Types from '@vegaprotocol/types';
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
-export type ExplorerDeterministicOrderFieldsFragment = { __typename?: 'Order', id: string, type?: Types.OrderType | null, reference: string, status: Types.OrderStatus, version: string, createdAt: any, updatedAt?: any | null, expiresAt?: any | null, timeInForce: Types.OrderTimeInForce, price: string, side: Types.Side, remaining: string, size: string, rejectionReason?: Types.OrderRejectionReason | null, peggedOrder?: { __typename?: 'PeggedOrder', reference: Types.PeggedReference, offset: string } | null, party: { __typename?: 'Party', id: string }, market: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } | { __typename?: 'Perpetual', quoteName: string } | { __typename?: 'Spot' } } } } };
+export type ExplorerDeterministicOrderFieldsFragment = { __typename?: 'Order', id: string, type?: Types.OrderType | null, reference: string, status: Types.OrderStatus, version: string, createdAt: any, updatedAt?: any | null, expiresAt?: any | null, timeInForce: Types.OrderTimeInForce, price: string, side: Types.Side, remaining: string, size: string, rejectionReason?: Types.OrderRejectionReason | null, peggedOrder?: { __typename?: 'PeggedOrder', reference: Types.PeggedReference, offset: string } | null, party: { __typename?: 'Party', id: string }, market: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } } } } };
 
 export type ExplorerDeterministicOrderQueryVariables = Types.Exact<{
   orderId: Types.Scalars['ID'];
@@ -11,7 +11,7 @@ export type ExplorerDeterministicOrderQueryVariables = Types.Exact<{
 }>;
 
 
-export type ExplorerDeterministicOrderQuery = { __typename?: 'Query', orderByID: { __typename?: 'Order', id: string, type?: Types.OrderType | null, reference: string, status: Types.OrderStatus, version: string, createdAt: any, updatedAt?: any | null, expiresAt?: any | null, timeInForce: Types.OrderTimeInForce, price: string, side: Types.Side, remaining: string, size: string, rejectionReason?: Types.OrderRejectionReason | null, peggedOrder?: { __typename?: 'PeggedOrder', reference: Types.PeggedReference, offset: string } | null, party: { __typename?: 'Party', id: string }, market: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } | { __typename?: 'Perpetual', quoteName: string } | { __typename?: 'Spot' } } } } } };
+export type ExplorerDeterministicOrderQuery = { __typename?: 'Query', orderByID: { __typename?: 'Order', id: string, type?: Types.OrderType | null, reference: string, status: Types.OrderStatus, version: string, createdAt: any, updatedAt?: any | null, expiresAt?: any | null, timeInForce: Types.OrderTimeInForce, price: string, side: Types.Side, remaining: string, size: string, rejectionReason?: Types.OrderRejectionReason | null, peggedOrder?: { __typename?: 'PeggedOrder', reference: Types.PeggedReference, offset: string } | null, party: { __typename?: 'Party', id: string }, market: { __typename?: 'Market', id: string, decimalPlaces: number, positionDecimalPlaces: number, state: Types.MarketState, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } } } } } };
 
 export const ExplorerDeterministicOrderFieldsFragmentDoc = gql`
     fragment ExplorerDeterministicOrderFields on Order {
@@ -47,9 +47,6 @@ export const ExplorerDeterministicOrderFieldsFragmentDoc = gql`
           ... on Future {
             quoteName
           }
-          ... on Perpetual {
-            quoteName
-          }
         }
       }
     }

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

@@ -150,7 +150,6 @@ function renderExistingAmend(
               instrument: {
                 name: 'test-label',
                 product: {
-                  __typename: 'Future',
                   quoteName: 'dai',
                 },
               },

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

@@ -33,8 +33,6 @@ const PriceInMarket = ({
       label = addDecimalsFormatNumber(price, data.market.decimalPlaces);
     } else if (
       decimalSource === 'SETTLEMENT_ASSET' &&
-      data.market &&
-      'settlementAsset' in data.market.tradableInstrument.instrument.product &&
       data.market?.tradableInstrument.instrument.product.settlementAsset
     ) {
       label = addDecimalsFormatNumber(

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

@@ -33,7 +33,7 @@ export const ProposalsTable = ({ data }: ProposalsTableProps) => {
   const { params } = useNetworkParams([
     NetworkParams.governance_proposal_market_requiredMajority,
   ]);
-  const tokenLink = useLinks(DApp.Governance);
+  const tokenLink = useLinks(DApp.Token);
   const requiredMajorityPercentage = useMemo(() => {
     const requiredMajority =
       params?.governance_proposal_market_requiredMajority ?? 1;

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

@@ -35,7 +35,7 @@ export const BundleSigners = ({
   tx,
   id,
 }: BundleSignersProps) => {
-  const tokenLink = useLinks(DApp.Governance);
+  const tokenLink = useLinks(DApp.Token);
 
   const bridgeFunction: BridgeFunction =
     tx?.changes?.erc20 && 'contractAddress' in tx.changes.erc20

apps/explorer/src/app/routes/network-parameters/index.tsx

@@ -1,2 +1 @@
 export * from './network-parameters';
-export * from './structure-network-params';

apps/explorer/src/app/routes/network-parameters/network-parameters.spec.tsx

@@ -1,105 +1,82 @@
 import { render, screen } from '@testing-library/react';
 import type { NetworkParamsQuery } from '@vegaprotocol/network-parameters';
 import { NetworkParametersTable } from './network-parameters';
-import { MemoryRouter } from 'react-router-dom';
-
-const renderComponent = (data: NetworkParamsQuery | undefined) => {
-  return render(
-    <MemoryRouter>
-      <NetworkParametersTable data={data} loading={false} />
-    </MemoryRouter>
-  );
-};
-
-const mockData = {
-  networkParametersConnection: {
-    edges: [
-      {
-        node: {
-          key: 'spam.protection.delegation.min.tokens',
-          value: '3',
-        },
-      },
-      {
-        node: {
-          key: 'spam.protection.voting.min.tokens',
-          value: '1',
-        },
-      },
-      {
-        node: {
-          key: 'reward.staking.delegation.minimumValidatorStake',
-          value: '2',
-        },
-      },
-      {
-        node: {
-          key: 'reward.asset',
-          value:
-            'fc7fd956078fb1fc9db5c19b88f0874c4299b2a7639ad05a47a28c0aef291b55',
-        },
-      },
-    ],
-  },
-};
 
 describe('NetworkParametersTable', () => {
-  it('renders headers correctly', () => {
-    renderComponent(mockData);
-
-    const allHeadings = screen.getAllByRole('heading');
-    expect(
-      allHeadings.map((h) => {
-        return {
-          text: h.textContent,
-          level: h.tagName,
-          testId: h.getAttribute('data-testid'),
-        };
-      })
-    ).toEqual([
-      {
-        text: 'Network Parameters',
-        level: 'H1',
-        testId: 'network-param-header',
+  it('renders correctly when it has network params', () => {
+    const data: NetworkParamsQuery = {
+      networkParametersConnection: {
+        edges: [
+          {
+            node: {
+              __typename: 'NetworkParameter',
+              key: 'market.liquidityProvision.minLpStakeQuantumMultiple',
+              value: '1',
+            },
+          },
+          {
+            node: {
+              __typename: 'NetworkParameter',
+              key: 'market.fee.factors.infrastructureFee',
+              value: '0.0005',
+            },
+          },
+        ],
       },
-      { text: 'Spam', level: 'H1', testId: 'spam' },
-      { text: 'Protection', level: 'H2', testId: 'spam-protection' },
-      { text: 'Delegation', level: 'H3', testId: 'spam-protection-delegation' },
-      { text: 'Min', level: 'H4', testId: 'spam-protection-delegation-min' },
-      { text: 'Voting', level: 'H3', testId: 'spam-protection-voting' },
-      { text: 'Min', level: 'H4', testId: 'spam-protection-voting-min' },
-      { text: 'Reward', level: 'H1', testId: 'reward' },
-      { text: 'Staking', level: 'H2', testId: 'reward-staking' },
-      { text: 'Delegation', level: 'H3', testId: 'reward-staking-delegation' },
-    ]);
+    };
+    render(<NetworkParametersTable data={data} loading={false} />);
+    expect(screen.getByTestId('network-param-header')).toHaveTextContent(
+      'Network Parameters'
+    );
+    const rows = screen.getAllByTestId('key-value-table-row');
+    expect(rows[0].children[0]).toHaveTextContent(
+      'market.fee.factors.infrastructureFee'
+    );
+    expect(rows[1].children[0]).toHaveTextContent(
+      'market.liquidityProvision.minLpStakeQuantumMultiple'
+    );
+    expect(rows[0].children[1]).toHaveTextContent('0.0005');
+    expect(rows[1].children[1]).toHaveTextContent('1');
   });
 
-  it('renders network params correctly', () => {
-    renderComponent(mockData);
-
-    const delegationMinTokensRow = screen.getByTestId(
-      'spam-protection-delegation-min-tokens'
+  it('renders the rows in ascending order', () => {
+    const data: NetworkParamsQuery = {
+      networkParametersConnection: {
+        edges: [
+          {
+            node: {
+              __typename: 'NetworkParameter',
+              key: 'market.fee.factors.infrastructureFee',
+              value: '0.0005',
+            },
+          },
+          {
+            node: {
+              __typename: 'NetworkParameter',
+              key: 'market.liquidityProvision.minLpStakeQuantumMultiple',
+              value: '1',
+            },
+          },
+        ],
+      },
+    };
+    render(<NetworkParametersTable data={data} loading={false} />);
+    expect(screen.getByTestId('network-param-header')).toHaveTextContent(
+      'Network Parameters'
     );
-    expect(delegationMinTokensRow).toHaveTextContent('0.000000000000000003');
-
-    const votingMinTokensRow = screen.getByTestId(
-      'spam-protection-voting-min-tokens'
+    const rows = screen.getAllByTestId('key-value-table-row');
+    expect(rows[0].children[0]).toHaveTextContent(
+      'market.fee.factors.infrastructureFee'
     );
-    expect(votingMinTokensRow).toHaveTextContent('0.000000000000000001');
-
-    const minimumValidatorStakeRow = screen.getByTestId(
-      'reward-staking-delegation-minimumValidatorStake'
-    );
-    expect(minimumValidatorStakeRow).toHaveTextContent('2');
-
-    const assetRow = screen.getByTestId('reward-asset');
-    expect(assetRow).toHaveTextContent(
-      'fc7fd956078fb1fc9db5c19b88f0874c4299b2a7639ad05a47a28c0aef291b55'
+    expect(rows[1].children[0]).toHaveTextContent(
+      'market.liquidityProvision.minLpStakeQuantumMultiple'
     );
+    expect(rows[0].children[1]).toHaveTextContent('0.0005');
+    expect(rows[1].children[1]).toHaveTextContent('1');
   });
 
   it('does not render rows when is loading', () => {
-    renderComponent(undefined);
+    render(<NetworkParametersTable data={undefined} loading={true} />);
     expect(screen.getByTestId('network-param-header')).toHaveTextContent(
       'Network Parameters'
     );

apps/explorer/src/app/routes/network-parameters/network-parameters.tsx

@@ -1,8 +1,6 @@
-import startCase from 'lodash/startCase';
-import classNames from 'classnames';
-import { Link } from 'react-router-dom';
 import {
   AsyncRenderer,
+  KeyValueTable,
   KeyValueTableRow,
   SyntaxHighlighter,
 } from '@vegaprotocol/ui-toolkit';
@@ -14,12 +12,11 @@ import {
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import { RouteTitle } from '../../components/route-title';
+import orderBy from 'lodash/orderBy';
 import { useNetworkParamsQuery } from '@vegaprotocol/network-parameters';
+import type { NetworkParamsQuery } from '@vegaprotocol/network-parameters';
 import { useScrollToLocation } from '../../hooks/scroll-to-location';
 import { useDocumentTitle } from '../../hooks/use-document-title';
-import { structureNetworkParams } from './structure-network-params';
-import type { NetworkParamsQuery } from '@vegaprotocol/network-parameters';
-import type { GroupedParams } from './structure-network-params';
 
 const PERCENTAGE_PARAMS = [
   'governance.proposal.asset.requiredMajority',
@@ -61,54 +58,6 @@ const BIG_NUMBER_PARAMS = [
   'governance.proposal.updateAsset.minVoterBalance',
 ];
 
-export const renderGroupedParams = (
-  group: GroupedParams,
-  level: number,
-  parentKeys: string[] = []
-) => {
-  const Header = `h${level}` as keyof JSX.IntrinsicElements;
-  const headerStyles = classNames('uppercase font-semibold', {
-    'pt-6 text-3xl underline': level === 1,
-    'pt-3 text-2xl': level === 2,
-    'pt-2 text-lg': level === 3,
-    'pt-2 text-default': level === 4,
-  });
-
-  return Object.entries(group).map(([key, value]) => {
-    const fullPath = [...parentKeys, key].join('.');
-    const isLeafNode = typeof value !== 'object';
-    const id = parentKeys.concat([key]).join('-');
-
-    return (
-      <div key={key}>
-        {!isLeafNode && (
-          <div id={id}>
-            <Link to={`#${id}`}>
-              <Header className={headerStyles} data-testid={id}>
-                {startCase(key)}
-              </Header>
-            </Link>
-          </div>
-        )}
-        {isLeafNode ? (
-          typeof value === 'string' ? (
-            <div data-testid={id}>
-              <NetworkParameterRow
-                key={fullPath}
-                row={{ key: fullPath, value: value }}
-              />
-            </div>
-          ) : null
-        ) : (
-          <div className="pb-1">
-            {renderGroupedParams(value, level + 1, [...parentKeys, key])}
-          </div>
-        )}
-      </div>
-    );
-  });
-};
-
 export const NetworkParameterRow = ({
   row: { key, value },
 }: {
@@ -128,9 +77,7 @@ export const NetworkParameterRow = ({
     >
       {key}
       {isSyntaxRow ? (
-        <div className="pb-2">
-          <SyntaxHighlighter data={JSON.parse(value)} />
-        </div>
+        <SyntaxHighlighter data={JSON.parse(value)} />
       ) : isNaN(Number(value)) ? (
         value
       ) : BIG_NUMBER_PARAMS.includes(key) ? (
@@ -166,12 +113,17 @@ export const NetworkParametersTable = ({
       loading={loading}
       error={error}
       render={(data) => {
-        const flatParams = removePaginationWrapper(
-          data.networkParametersConnection.edges
+        const ascParams = orderBy(
+          removePaginationWrapper(data.networkParametersConnection.edges),
+          (param) => param.key,
+          'asc'
         );
-        const groupedParams = structureNetworkParams(flatParams);
         return (
-          <div className="-mt-6">{renderGroupedParams(groupedParams, 1)}</div>
+          <KeyValueTable data-testid="parameters">
+            {(ascParams || []).map((row) => (
+              <NetworkParameterRow key={row.key} row={row} />
+            ))}
+          </KeyValueTable>
         );
       }}
     />

apps/explorer/src/app/routes/network-parameters/structure-network-params.spec.tsx

@@ -1,109 +0,0 @@
-import type { GroupedParams } from './structure-network-params';
-import {
-  structureParams,
-  sortGroupedParams,
-  structureNetworkParams,
-} from './structure-network-params';
-
-describe('structureParams', () => {
-  it('should correctly structure params', () => {
-    const input = [
-      { key: 'spam.protection.delegation.min.tokens', value: '10' },
-      { key: 'spam.protection.voting.min.tokens', value: '5' },
-    ];
-    const output: GroupedParams = {
-      spam: {
-        protection: {
-          delegation: {
-            min: {
-              tokens: '10',
-            },
-          },
-          voting: {
-            min: {
-              tokens: '5',
-            },
-          },
-        },
-      },
-    };
-    expect(structureParams(input)).toEqual(output);
-  });
-
-  it('should handle top-level keys correctly', () => {
-    const input = [{ key: 'levelOne', value: '10' }];
-    const output = {
-      levelOne: '10',
-    };
-    expect(structureParams(input)).toEqual(output);
-  });
-});
-
-describe('sortGroupedParams', () => {
-  it('should correctly sort grouped params', () => {
-    const input: GroupedParams = {
-      spam: {
-        protection: {
-          delegation: {
-            min: {
-              tokens: '10',
-            },
-          },
-        },
-      },
-      reward: '50',
-    };
-    const output: GroupedParams = {
-      reward: '50',
-      spam: {
-        protection: {
-          delegation: {
-            min: {
-              tokens: '10',
-            },
-          },
-        },
-      },
-    };
-    expect(sortGroupedParams(input)).toEqual(output);
-  });
-
-  it('should handle already sorted keys', () => {
-    const input = {
-      a: '10',
-      b: {
-        c: '5',
-        d: '6',
-      },
-    };
-    expect(sortGroupedParams(input)).toEqual(input);
-  });
-});
-
-describe('structureNetworkParams', () => {
-  it('should structure and sort network params correctly', () => {
-    const input = [
-      { key: 'spam.protection.delegation.min.tokens', value: '10' },
-      { key: 'reward.asset', value: '50' },
-    ];
-    const output: GroupedParams = {
-      reward: {
-        asset: '50',
-      },
-      spam: {
-        protection: {
-          delegation: {
-            min: {
-              tokens: '10',
-            },
-          },
-        },
-      },
-    };
-    expect(structureNetworkParams(input)).toEqual(output);
-  });
-
-  it('should return an empty object if no params are provided', () => {
-    expect(structureNetworkParams([])).toEqual({});
-  });
-});

apps/explorer/src/app/routes/network-parameters/structure-network-params.tsx

@@ -1,107 +0,0 @@
-/**
- * Categorizes and sorts an array of key-value pairs of network params into a nested object structure.
- *
- * The function takes an array of network params where keys are dot-delimited
- * strings representing nested categories (e.g., 'spam.protection.delegation.min.tokens').
- *
- * Why this is necessary:
- * A flat key-value structure wouldn't provide the hierarchical information needed.
- * Organizing network parameters like this allows the rendering of nested headers
- * and their corresponding network params.
- *
- * It also ensures that items with the minimum amount of nesting are ordered first. This
- * allows us to render these items first, before more deeply nested items are rendered with
- * subheaders. This creates a more intuitive UI.
- *
- * For example, given the input:
- * [
- *   { key: 'spam.protection.delegation.min.tokens', value: '10' },
- *   { key: 'spam.protection.voting.min.tokens', value: '5' },
- *   { key: 'reward.staking.delegation.minimumValidatorStake', value: '2' }
- *   { key: 'reward.asset', value: 'fc7fd956078fb1fc9db5c19b88f0874c4299b2a7639ad05a47a28c0aef291b55' }
- * ]
- *
- * The output will be:
- * {
- *   spam: {
- *     protection: {
- *       delegation: {
- *         min: {
- *           tokens: '10'
- *         }
- *       },
- *       voting: {
- *         min: {
- *           tokens: '5'
- *         }
- *       }
- *     }
- *   },
- *   reward: {
- *     asset: 'fc7fd956078fb1fc9db5c19b88f0874c4299b2a7639ad05a47a28c0aef291b55',
- *     staking: {
- *       delegation: {
- *         minimumValidatorStake: '2'
- *       }
- *     }
- *   }
- * }
- *
- * @param {Array} params - An array of key-value pairs to categorize and sort.
- * @returns {GroupedParams} - A nested object that groups the key-value pairs.
- */
-
-export type GroupedParams = {
-  [key: string]: string | GroupedParams;
-};
-
-export const structureParams = (
-  params: { key: string; value: string }[]
-): GroupedParams => {
-  const grouped: GroupedParams = {};
-
-  params.forEach(({ key, value }) => {
-    const parts = key.split('.');
-    let node: GroupedParams = grouped;
-
-    parts.forEach((part, i) => {
-      if (typeof node[part] === 'undefined') {
-        node[part] = i === parts.length - 1 ? value : {};
-      }
-
-      if (typeof node[part] === 'object') {
-        node = node[part] as GroupedParams;
-      }
-    });
-  });
-
-  return grouped;
-};
-
-export const sortGroupedParams = (
-  groupedParams: GroupedParams
-): GroupedParams => {
-  const sorted: GroupedParams = {};
-
-  // Sort top-level keys first
-  Object.entries(groupedParams).forEach(([key, value]) => {
-    if (typeof value === 'string') {
-      sorted[key] = value;
-    }
-  });
-
-  Object.entries(groupedParams).forEach(([key, value]) => {
-    if (typeof value === 'object') {
-      sorted[key] = sortGroupedParams(value);
-    }
-  });
-
-  return sorted;
-};
-
-export const structureNetworkParams = (
-  params: { key: string; value: string }[]
-) => {
-  const grouped = structureParams(params);
-  return sortGroupedParams(grouped);
-};

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

@@ -11,14 +11,6 @@ fragment ExplorerOracleForMarketsMarket on Market {
             id
           }
         }
-        ... on Perpetual {
-          dataSourceSpecForSettlementData {
-            id
-          }
-          dataSourceSpecForSettlementSchedule {
-            id
-          }
-        }
       }
     }
   }

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

@@ -5,19 +5,19 @@ import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
 export type ExplorerOracleDataConnectionFragment = { __typename?: 'OracleSpec', dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
 
-export type ExplorerOracleDataSourceFragment = { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } | { __typename?: 'EthCallSpec' } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } | { __typename?: 'DataSourceSpecConfigurationTimeTrigger' } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
+export type ExplorerOracleDataSourceFragment = { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } };
 
 export type ExplorerOracleSpecsQueryVariables = Types.Exact<{ [key: string]: never; }>;
 
 
-export type ExplorerOracleSpecsQuery = { __typename?: 'Query', oracleSpecsConnection?: { __typename?: 'OracleSpecsConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleSpecEdge', node: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } | { __typename?: 'EthCallSpec' } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } | { __typename?: 'DataSourceSpecConfigurationTimeTrigger' } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } } | null> | null } | null };
+export type ExplorerOracleSpecsQuery = { __typename?: 'Query', oracleSpecsConnection?: { __typename?: 'OracleSpecsConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean }, edges?: Array<{ __typename?: 'OracleSpecEdge', node: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } } | null> | null } | null };
 
 export type ExplorerOracleSpecByIdQueryVariables = Types.Exact<{
   id: Types.Scalars['ID'];
 }>;
 
 
-export type ExplorerOracleSpecByIdQuery = { __typename?: 'Query', oracleSpec?: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } | { __typename?: 'EthCallSpec' } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } | { __typename?: 'DataSourceSpecConfigurationTimeTrigger' } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } | null };
+export type ExplorerOracleSpecByIdQuery = { __typename?: 'Query', oracleSpec?: { __typename?: 'OracleSpec', dataSourceSpec: { __typename?: 'ExternalDataSourceSpec', spec: { __typename?: 'DataSourceSpec', id: string, createdAt: any, updatedAt?: any | null, status: Types.DataSourceSpecStatus, data: { __typename?: 'DataSourceDefinition', sourceType: { __typename?: 'DataSourceDefinitionExternal', sourceType: { __typename?: 'DataSourceSpecConfiguration', signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, filters?: Array<{ __typename?: 'Filter', key: { __typename?: 'PropertyKey', name?: string | null, type: Types.PropertyKeyType, numberDecimalPlaces?: number | null }, conditions?: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator }> | null }> | null } } | { __typename?: 'DataSourceDefinitionInternal', sourceType: { __typename?: 'DataSourceSpecConfigurationTime', conditions: Array<{ __typename?: 'Condition', value?: string | null, operator: Types.ConditionOperator } | null> } } } } }, dataConnection: { __typename?: 'OracleDataConnection', edges?: Array<{ __typename?: 'OracleDataEdge', node: { __typename?: 'OracleData', externalData: { __typename?: 'ExternalData', data: { __typename?: 'Data', matchedSpecIds?: Array<string> | null, broadcastAt: any, signers?: Array<{ __typename?: 'Signer', signer: { __typename?: 'ETHAddress', address?: string | null } | { __typename?: 'PubKey', key?: string | null } }> | null, data?: Array<{ __typename?: 'Property', name: string, value: string }> | null } } } } | null> | null } } | null };
 
 export const ExplorerOracleDataConnectionFragmentDoc = gql`
     fragment ExplorerOracleDataConnection on OracleSpec {

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

@@ -3,12 +3,12 @@ import * as Types from '@vegaprotocol/types';
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
-export type ExplorerOracleForMarketsMarketFragment = { __typename?: 'Market', id: string, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', product: { __typename?: 'Future', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForTradingTermination: { __typename?: 'DataSourceSpec', id: string } } | { __typename?: 'Perpetual', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForSettlementSchedule: { __typename?: 'DataSourceSpec', id: string } } | { __typename?: 'Spot' } } } };
+export type ExplorerOracleForMarketsMarketFragment = { __typename?: 'Market', id: string, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', product: { __typename?: 'Future', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForTradingTermination: { __typename?: 'DataSourceSpec', id: string } } } } };
 
 export type ExplorerOracleFormMarketsQueryVariables = Types.Exact<{ [key: string]: never; }>;
 
 
-export type ExplorerOracleFormMarketsQuery = { __typename?: 'Query', marketsConnection?: { __typename?: 'MarketConnection', edges: Array<{ __typename?: 'MarketEdge', node: { __typename?: 'Market', id: string, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', product: { __typename?: 'Future', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForTradingTermination: { __typename?: 'DataSourceSpec', id: string } } | { __typename?: 'Perpetual', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForSettlementSchedule: { __typename?: 'DataSourceSpec', id: string } } | { __typename?: 'Spot' } } } } }> } | null };
+export type ExplorerOracleFormMarketsQuery = { __typename?: 'Query', marketsConnection?: { __typename?: 'MarketConnection', edges: Array<{ __typename?: 'MarketEdge', node: { __typename?: 'Market', id: string, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', product: { __typename?: 'Future', dataSourceSpecForSettlementData: { __typename?: 'DataSourceSpec', id: string }, dataSourceSpecForTradingTermination: { __typename?: 'DataSourceSpec', id: string } } } } } }> } | null };
 
 export const ExplorerOracleForMarketsMarketFragmentDoc = gql`
     fragment ExplorerOracleForMarketsMarket on Market {
@@ -24,14 +24,6 @@ export const ExplorerOracleForMarketsMarketFragmentDoc = gql`
             id
           }
         }
-        ... on Perpetual {
-          dataSourceSpecForSettlementData {
-            id
-          }
-          dataSourceSpecForSettlementSchedule {
-            id
-          }
-        }
       }
     }
   }

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

@@ -10,7 +10,7 @@ interface OracleMarketsProps {
 }
 
 /**
- * Slightly misleading names, OracleMarkets lists the market (almost always singular)
+ * Slightly misleadlingly names, OracleMarkets lists the market (almost always singular)
  * to which an oracle is attached. It also checks what it triggers, by checking on the
  * market whether it is attached to the dataSourceSpecForSettlementData or ..TradingTermination
  */
@@ -27,10 +27,8 @@ export function OracleMarkets({ id }: OracleMarketsProps) {
     const m = markets.find((m) => {
       const p = m.tradableInstrument.instrument.product;
       if (
-        ((p.__typename === 'Future' || p.__typename === 'Perpetual') &&
-          p.dataSourceSpecForSettlementData.id === id) ||
-        ('dataSourceSpecForTradingTermination' in p &&
-          p.dataSourceSpecForTradingTermination.id === id)
+        p?.dataSourceSpecForSettlementData?.id === id ||
+        p?.dataSourceSpecForTradingTermination?.id === id
       ) {
         return true;
       }
@@ -63,32 +61,8 @@ export function getLabel(
   m: ExplorerOracleForMarketsMarketFragment | null
 ): string {
   const settlementId =
-    ((m?.tradableInstrument?.instrument?.product?.__typename === 'Future' ||
-      m?.tradableInstrument?.instrument?.product?.__typename === 'Perpetual') &&
-      m?.tradableInstrument?.instrument?.product
-        ?.dataSourceSpecForSettlementData?.id) ||
-    null;
+    m?.tradableInstrument?.instrument?.product?.dataSourceSpecForSettlementData
+      ?.id || null;
 
-  const terminationId =
-    (m?.tradableInstrument?.instrument?.product?.__typename === 'Future' &&
-      m?.tradableInstrument?.instrument?.product
-        ?.dataSourceSpecForTradingTermination?.id) ||
-    null;
-
-  const settlementScheduleId =
-    (m?.tradableInstrument?.instrument?.product?.__typename === 'Perpetual' &&
-      m?.tradableInstrument?.instrument?.product
-        ?.dataSourceSpecForSettlementSchedule?.id) ||
-    null;
-
-  switch (id) {
-    case settlementId:
-      return 'Settlement for';
-    case terminationId:
-      return 'Termination for';
-    case settlementScheduleId:
-      return 'Settlement schedule for';
-    default:
-      return 'Unknown';
-  }
+  return id === settlementId ? 'Settlement for' : 'Termination for';
 }

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

@@ -67,9 +67,6 @@ export function OracleSigners({ sourceType }: OracleDetailsSignersProps) {
   if (sourceType.__typename !== 'DataSourceDefinitionExternal') {
     return null;
   }
-  if (!('signers' in sourceType.sourceType)) {
-    return null;
-  }
   const signers = sourceType.sourceType.signers;
 
   if (!signers || signers.length === 0) {

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

@@ -38,12 +38,7 @@ const Oracles = () => {
               const dataConnection = o?.node.dataConnection;
 
               return (
-                <div
-                  id={id}
-                  key={id}
-                  className="mb-10"
-                  data-testid="oracle-details"
-                >
+                <div id={id} key={id} className="mb-10">
                   <OracleDetails
                     id={id}
                     dataSource={o?.node}

apps/explorer/src/app/routes/parties/id/Party-assets.graphql

@@ -23,9 +23,6 @@ fragment ExplorerPartyAssetsAccounts on AccountBalance {
           ... on Future {
             quoteName
           }
-          ... on Perpetual {
-            quoteName
-          }
         }
       }
     }

apps/explorer/src/app/routes/parties/id/__generated__/Party-assets.ts

@@ -3,14 +3,14 @@ import * as Types from '@vegaprotocol/types';
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
-export type ExplorerPartyAssetsAccountsFragment = { __typename?: 'AccountBalance', type: Types.AccountType, balance: string, asset: { __typename?: 'Asset', name: string, id: string, decimals: number, symbol: string, source: { __typename: 'BuiltinAsset' } | { __typename: 'ERC20', contractAddress: string } }, market?: { __typename?: 'Market', id: string, decimalPlaces: number, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } | { __typename?: 'Perpetual', quoteName: string } | { __typename?: 'Spot' } } } } | null };
+export type ExplorerPartyAssetsAccountsFragment = { __typename?: 'AccountBalance', type: Types.AccountType, balance: string, asset: { __typename?: 'Asset', name: string, id: string, decimals: number, symbol: string, source: { __typename: 'BuiltinAsset' } | { __typename: 'ERC20', contractAddress: string } }, market?: { __typename?: 'Market', id: string, decimalPlaces: number, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } } } } | null };
 
 export type ExplorerPartyAssetsQueryVariables = Types.Exact<{
   partyId: Types.Scalars['ID'];
 }>;
 
 
-export type ExplorerPartyAssetsQuery = { __typename?: 'Query', partiesConnection?: { __typename?: 'PartyConnection', edges: Array<{ __typename?: 'PartyEdge', node: { __typename?: 'Party', id: string, delegationsConnection?: { __typename?: 'DelegationsConnection', edges?: Array<{ __typename?: 'DelegationEdge', node: { __typename?: 'Delegation', amount: string, epoch: number, node: { __typename?: 'Node', id: string, name: string } } } | null> | null } | null, stakingSummary: { __typename?: 'StakingSummary', currentStakeAvailable: string, linkings: { __typename?: 'StakesConnection', edges?: Array<{ __typename?: 'StakeLinkingEdge', node: { __typename?: 'StakeLinking', type: Types.StakeLinkingType, status: Types.StakeLinkingStatus, amount: string } } | null> | null } }, accountsConnection?: { __typename?: 'AccountsConnection', edges?: Array<{ __typename?: 'AccountEdge', node: { __typename?: 'AccountBalance', type: Types.AccountType, balance: string, asset: { __typename?: 'Asset', name: string, id: string, decimals: number, symbol: string, source: { __typename: 'BuiltinAsset' } | { __typename: 'ERC20', contractAddress: string } }, market?: { __typename?: 'Market', id: string, decimalPlaces: number, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } | { __typename?: 'Perpetual', quoteName: string } | { __typename?: 'Spot' } } } } | null } } | null> | null } | null } }> } | null };
+export type ExplorerPartyAssetsQuery = { __typename?: 'Query', partiesConnection?: { __typename?: 'PartyConnection', edges: Array<{ __typename?: 'PartyEdge', node: { __typename?: 'Party', id: string, delegationsConnection?: { __typename?: 'DelegationsConnection', edges?: Array<{ __typename?: 'DelegationEdge', node: { __typename?: 'Delegation', amount: string, epoch: number, node: { __typename?: 'Node', id: string, name: string } } } | null> | null } | null, stakingSummary: { __typename?: 'StakingSummary', currentStakeAvailable: string, linkings: { __typename?: 'StakesConnection', edges?: Array<{ __typename?: 'StakeLinkingEdge', node: { __typename?: 'StakeLinking', type: Types.StakeLinkingType, status: Types.StakeLinkingStatus, amount: string } } | null> | null } }, accountsConnection?: { __typename?: 'AccountsConnection', edges?: Array<{ __typename?: 'AccountEdge', node: { __typename?: 'AccountBalance', type: Types.AccountType, balance: string, asset: { __typename?: 'Asset', name: string, id: string, decimals: number, symbol: string, source: { __typename: 'BuiltinAsset' } | { __typename: 'ERC20', contractAddress: string } }, market?: { __typename?: 'Market', id: string, decimalPlaces: number, tradableInstrument: { __typename?: 'TradableInstrument', instrument: { __typename?: 'Instrument', name: string, product: { __typename?: 'Future', quoteName: string } } } } | null } } | null> | null } | null } }> } | null };
 
 export const ExplorerPartyAssetsAccountsFragmentDoc = gql`
     fragment ExplorerPartyAssetsAccounts on AccountBalance {
@@ -38,9 +38,6 @@ export const ExplorerPartyAssetsAccountsFragmentDoc = gql`
           ... on Future {
             quoteName
           }
-          ... on Perpetual {
-            quoteName
-          }
         }
       }
     }

apps/explorer/src/app/routes/validators/validators-page.tsx

@@ -139,7 +139,7 @@ export const ValidatorsPage = () => {
   const [vegaDialog, setVegaDialog] = useState<boolean>(false);
   const [tmDialog, setTmDialog] = useState<boolean>(false);
 
-  const tokenLink = useLinks(DApp.Governance);
+  const tokenLink = useLinks(DApp.Token);
 
   return (
     <>

apps/explorer/src/types/explorer.d.ts

@@ -1453,6 +1453,11 @@ export interface components {
       readonly liquidityMonitoringParameters?: components['schemas']['vegaLiquidityMonitoringParameters'];
       /** @description Log normal risk model parameters, valid only if MODEL_LOG_NORMAL is selected. */
       readonly logNormal?: components['schemas']['vegaLogNormalRiskModel'];
+      /**
+       * @description Percentage move up and down from the mid price which specifies the range of
+       * price levels over which automated liquidity provision orders will be deployed.
+       */
+      readonly lpPriceRange?: string;
       /** @description Optional new futures market metadata, tags. */
       readonly metadata?: readonly string[];
       /**
@@ -1848,6 +1853,11 @@ export interface components {
       readonly liquidityMonitoringParameters?: components['schemas']['vegaLiquidityMonitoringParameters'];
       /** @description Log normal risk model parameters, valid only if MODEL_LOG_NORMAL is selected. */
       readonly logNormal?: components['schemas']['vegaLogNormalRiskModel'];
+      /**
+       * @description Percentage move up and down from the mid price which specifies the range of
+       * price levels over which automated liquidity provision orders will be deployed.
+       */
+      readonly lpPriceRange?: string;
       /** @description Optional futures market metadata, tags. */
       readonly metadata?: readonly string[];
       /** @description Price monitoring parameters. */

apps/governance-e2e/.env

@@ -14,8 +14,6 @@ NX_ETH_LOCAL_PROVIDER_URL=http://localhost:8545/
 NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/mainnet
 NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
-
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/test/announcements.json
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72

apps/governance-e2e/.env.devnet

@@ -3,4 +3,3 @@ NX_VEGA_ENV=DEVNET
 NX_VEGA_URL=https://api.n04.d.vega.xyz/graphql
 NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9edefb8
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json

apps/governance-e2e/.env.mainnet

@@ -3,4 +3,3 @@ NX_VEGA_ENV=MAINNET
 NX_VEGA_URL=https://api.vega.community/graphql
 NX_ETHEREUM_PROVIDER_URL=https://mainnet.infura.io/v3/4f846e79e13f44d1b51bbd7ed9edefb8
 NX_ETHERSCAN_URL=https://etherscan.io
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json

apps/governance-e2e/.env.testnet

@@ -3,4 +3,3 @@ NX_VEGA_ENV=TESTNET
 NX_VEGA_URL=https://api.n07.testnet.vega.xyz/graphql
 NX_ETHEREUM_PROVIDER_URL=https://sepolia.infura.io/v3/4f846e79e13f44d1b51bbd7ed9edefb8
 NX_ETHERSCAN_URL=https://sepolia.etherscan.io
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json

apps/governance-e2e/src/fixtures/mocks/network-upgrade.ts

@@ -19,22 +19,7 @@ export const upgradeProposalsData = {
       },
       {
         node: {
-          upgradeBlockHeight: '10001',
-          vegaReleaseTag: 'v0.71.0+dev-12156-bca1d57e',
-          approvers: [
-            '02a6531716b7a6d82779b7793c3ad2fcb47290ea2ff0912c56f61219bd9675ff',
-            '121934387281812a2d5e6913e5d57c0f85a8f169e2752347ee2e23b52d46623c',
-            '65c80e2f5f84e2109eec30810f137ba04cbbecaba8f27706c146cc6c6f90db29',
-            'bd6339d2428c79ac3bc9011771236d17bac92bcb1806423388d52fb440043aef',
-          ],
-          status: 'PROTOCOL_UPGRADE_PROPOSAL_STATUS_APPROVED',
-          __typename: 'ProtocolUpgradeProposal',
-        },
-        __typename: 'ProtocolUpgradeProposalEdge',
-      },
-      {
-        node: {
-          upgradeBlockHeight: '20',
+          upgradeBlockHeight: '1955065',
           vegaReleaseTag: 'v0.71.0+dev-12156-bca1d57e',
           approvers: [
             '02a6531716b7a6d82779b7793c3ad2fcb47290ea2ff0912c56f61219bd9675ff',

apps/governance-e2e/src/fixtures/proposals/new-market-raw.json

@@ -10,6 +10,7 @@
         "positionDecimalPlaces": "5",
         "linearSlippageFactor": "0.001",
         "quadraticSlippageFactor": "0",
+        "lpPriceRange": "10",
         "instrument": {
           "name": "Token test market",
           "code": "TEST.24h",
@@ -103,12 +104,6 @@
             "r": 0.016,
             "sigma": 0.5
           }
-        },
-        "liquiditySlaParameters": {
-          "priceRange": "0.95",
-          "commitmentMinTimeFraction": "0.5",
-          "performanceHysteresisEpochs": 2,
-          "slaCompetitionFactor": "0.75"
         }
       }
     },

apps/governance-e2e/src/fixtures/proposals/new-market.json

@@ -4,6 +4,7 @@
     "positionDecimalPlaces": "5",
     "linearSlippageFactor": "0.001",
     "quadraticSlippageFactor": "0",
+    "lpPriceRange": "10",
     "instrument": {
       "name": "Token test market",
       "code": "Token.24h",
@@ -97,12 +98,6 @@
         "r": 0.016,
         "sigma": 0.8
       }
-    },
-    "liquiditySlaParameters": {
-      "priceRange": "0.95",
-      "commitmentMinTimeFraction": "0.5",
-      "performanceHysteresisEpochs": 2,
-      "slaCompetitionFactor": "0.75"
     }
   }
 }

apps/governance-e2e/src/fixtures/proposals/successor-market.json

@@ -4,6 +4,7 @@
     "positionDecimalPlaces": "5",
     "linearSlippageFactor": "0.001",
     "quadraticSlippageFactor": "0",
+    "lpPriceRange": "10",
     "instrument": {
       "name": "Token test market",
       "code": "Token.24h",
@@ -98,12 +99,6 @@
         "sigma": 0.8
       }
     },
-    "liquiditySlaParameters": {
-      "priceRange": "0.95",
-      "commitmentMinTimeFraction": "0.5",
-      "performanceHysteresisEpochs": 2,
-      "slaCompetitionFactor": "0.75"
-    },
     "successor": {
       "parentMarketId": "",
       "insurancePoolFraction": "0.75"

apps/governance-e2e/src/fixtures/proposals/update-market-old.json

@@ -1,4 +1,5 @@
 {
+  "lpPriceRange": "11",
   "instrument": {
     "code": "Token.24h",
     "future": {

apps/governance-e2e/src/fixtures/proposals/update-market.json

@@ -1,4 +1,5 @@
 {
+  "lpPriceRange": "10",
   "linearSlippageFactor": "0.001",
   "quadraticSlippageFactor": "0",
   "instrument": {
@@ -97,11 +98,5 @@
       "r": 0.016,
       "sigma": 0.3
     }
-  },
-  "liquiditySlaParameters": {
-    "priceRange": "0.95",
-    "commitmentMinTimeFraction": "0.5",
-    "performanceHysteresisEpochs": 2,
-    "slaCompetitionFactor": "0.75"
   }
 }

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

@@ -34,20 +34,19 @@ import { formatDateWithLocalTimezone } from '@vegaprotocol/utils';
 import { createSuccessorMarketProposalTxBody } from '../../support/proposal.functions';
 
 const proposalListItem = '[data-testid="proposals-list-item"]';
-const participationNotMet = 'token-participation-not-met';
-const voteStatus = 'vote-status';
-const voteMajorityNotMet = 'token-majority-not-met';
-const numberOfVotesFor = 'num-votes-for';
-const votesForPercentage = 'votes-for-percentage';
-const numberOfVotesAgainst = 'num-votes-against';
-const votesAgainstPercentage = 'votes-against-percentage';
-const totalVotedNumber = 'total-voted';
-const totalVotedPercentage = 'total-voted-percentage';
+const proposalVoteProgressForPercentage =
+  'vote-progress-indicator-percentage-for';
+const proposalVoteProgressAgainstPercentage =
+  'vote-progress-indicator-percentage-against';
+const proposalVoteProgressForTokens = 'vote-progress-indicator-tokens-for';
+const proposalVoteProgressAgainstTokens =
+  'vote-progress-indicator-tokens-against';
 const changeVoteButton = 'change-vote-button';
 const proposalDetailsTitle = 'proposal-title';
 const proposalDetailsDescription = 'proposal-description';
 const openProposals = 'open-proposals';
 const viewProposalButton = 'view-proposal-btn';
+const voteBreakdownToggle = 'vote-breakdown-toggle';
 const proposalTermsToggle = 'proposal-json-toggle';
 const marketDataToggle = 'proposal-market-data-toggle';
 
@@ -151,32 +150,29 @@ describe(
       // 3001-VOTE-037
       // 3001-VOTE-040
       // 3001-VOTE-067
-      // 3001-VOTE-023
       createRawProposal();
       cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
         getProposalFromTitle(rawProposal.rationale.title).within(() =>
           cy.getByTestId(viewProposalButton).click()
         );
       });
-      cy.getByTestId(participationNotMet).should(
-        'have.text',
-        '0.000000000000000000000015% participation threshold not met'
-      );
-      cy.getByTestId(voteMajorityNotMet).should(
-        'have.text',
-        '66% majority threshold not met'
-      );
-      cy.getByTestId(voteStatus).should(
-        'have.text',
-        'Currently expected to  fail'
+      cy.contains('Participation: Not Met 0.00 0.00%(0.00% Required)').should(
+        'be.visible'
       );
+      cy.getByTestId(voteBreakdownToggle).click();
+      getProposalInformationFromTable('Expected to pass')
+        .contains('👎')
+        .should('be.visible');
       // 3001-VOTE-062
       // 3001-VOTE-040
       // 3001-VOTE-070
+      getProposalInformationFromTable('Token majority met')
+        .contains('👎')
+        .should('be.visible');
       // 3001-VOTE-068
-      cy.getByTestId(numberOfVotesFor).should('have.text', '0.0M');
-      cy.getByTestId(numberOfVotesAgainst).should('have.text', '0.0M');
-      cy.getByTestId(totalVotedNumber).should('have.text', '0.0M');
+      getProposalInformationFromTable('Token participation met')
+        .contains('👎')
+        .should('be.visible');
     });
 
     // 3001-VOTE-080 3001-VOTE-090 3001-VOTE-069 3001-VOTE-072 3001-VOTE-073
@@ -201,16 +197,43 @@ describe(
           .contains(votedDate)
           .should('be.visible');
       });
-      cy.getByTestId(votesForPercentage) // 3001-VOTE-072
-        .should('have.text', '100%');
-      cy.getByTestId(votesAgainstPercentage).should('have.text', '0%');
-      cy.getByTestId('token-majority-progress')
-        .should('have.attr', 'style')
-        .and('eq', 'width: 100%;'); // 3001-VOTE-024
+      cy.getByTestId(proposalVoteProgressForPercentage) // 3001-VOTE-072
+        .contains('100.00%')
+        .and('be.visible');
+      cy.getByTestId(proposalVoteProgressAgainstPercentage)
+        .contains('0.00%')
+        .and('be.visible');
+      cy.getByTestId(proposalVoteProgressForTokens)
+        .contains('1.00')
+        .and('be.visible');
+      cy.getByTestId(proposalVoteProgressAgainstTokens)
+        .contains('0.00')
+        .and('be.visible');
+      cy.getByTestId(voteBreakdownToggle).click();
+      getProposalInformationFromTable('Tokens for proposal')
+        .should('have.text', (1).toFixed(2))
+        .and('be.visible');
+      getProposalInformationFromTable('Tokens against proposal')
+        .should('have.text', '0.00')
+        .and('be.visible');
+      // 3001-VOTE-061
+      getProposalInformationFromTable('Participation required')
+        .contains('0.00%')
+        .should('be.visible');
+      // 3001-VOTE-066
+      getProposalInformationFromTable('Majority Required') // 3001-VOTE-073
+        .contains(`${(66).toFixed(2)}%`)
+        .should('be.visible');
+      getProposalInformationFromTable('Number of voting parties')
+        .should('have.text', '1')
+        .and('be.visible');
       cy.getByTestId(changeVoteButton).should('be.visible').click();
       voteForProposal('for');
       // 3001-VOTE-064
       cy.getByTestId('user-voted-yes').should('exist');
+      getProposalInformationFromTable('Tokens for proposal')
+        .should('have.text', (1).toFixed(2))
+        .and('be.visible');
       navigateTo(navigation.proposals);
       cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
         getProposalFromTitle(rawProposal.rationale.title).within(() => {
@@ -221,7 +244,16 @@ describe(
       });
       cy.getByTestId(changeVoteButton).should('be.visible').click();
       voteForProposal('against');
-      cy.getByTestId(votesAgainstPercentage).should('have.text', '100%');
+      cy.getByTestId(proposalVoteProgressAgainstPercentage)
+        .contains('100.00%')
+        .and('be.visible');
+      cy.getByTestId(voteBreakdownToggle).click();
+      getProposalInformationFromTable('Tokens against proposal')
+        .should('have.text', (1).toFixed(2))
+        .and('be.visible');
+      getProposalInformationFromTable('Number of voting parties')
+        .should('have.text', '1')
+        .and('be.visible');
       navigateTo(navigation.proposals);
       cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
         getProposalFromTitle(rawProposal.rationale.title).within(() => {
@@ -233,7 +265,6 @@ describe(
 
     // 3001-VOTE-042, 3001-VOTE-057, 3001-VOTE-058, 3001-VOTE-059, 3001-VOTE-060
     it('Newly created proposal details - ability to increase associated tokens - by voting again after association', function () {
-      ensureSpecifiedUnstakedTokensAreAssociated('1');
       vegaWalletSetSpecifiedApprovalAmount('1000');
       createRawProposal();
       cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
@@ -244,28 +275,69 @@ describe(
       voteForProposal('for');
       // 3001-VOTE-079
       cy.contains('You voted: For').should('be.visible');
-      cy.getByTestId(numberOfVotesFor).should('have.text', '0.0M');
-      cy.getByTestId(votesForPercentage).should('have.text', '100%');
-      cy.getByTestId(totalVotedNumber).should('have.text', '0.0M');
-      cy.getByTestId(totalVotedPercentage).should('have.text', '(0.00%)');
-      ethereumWalletConnect();
-      stakingPageAssociateTokens('1000000', { approve: true });
-      navigateTo(navigation.proposals);
-      cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
-        getProposalFromTitle(rawProposal.rationale.title).within(() =>
-          cy.getByTestId(viewProposalButton).click()
-        );
-      });
-      cy.getByTestId(votesForPercentage).should('have.text', '100%');
-      cy.getByTestId(numberOfVotesFor).should('have.text', '0.0M');
-      cy.getByTestId(totalVotedNumber).should('have.text', '0.0M');
-      cy.getByTestId(totalVotedPercentage).should('have.text', '(0.00%)');
-      // 3001-VOTE-065
-      cy.getByTestId(changeVoteButton).should('be.visible').click();
-      voteForProposal('for');
-      cy.getByTestId(numberOfVotesFor).should('have.text', '1.0M');
-      cy.getByTestId(totalVotedNumber).should('have.text', '1.0M');
-      cy.getByTestId(totalVotedPercentage).should('have.text', '(1.54%)');
+      cy.getByTestId(proposalVoteProgressForTokens)
+        .contains('1')
+        .and('be.visible');
+      cy.getByTestId(voteBreakdownToggle).click();
+      getProposalInformationFromTable('Total Supply')
+        .invoke('text')
+        .then((totalSupply) => {
+          const tokensRequiredToAchieveResult = (
+            (Number(totalSupply.replace(/,/g, '')) * 0.001) /
+            100
+          ).toFixed(2);
+          ethereumWalletConnect();
+          ensureSpecifiedUnstakedTokensAreAssociated(
+            tokensRequiredToAchieveResult
+          );
+          navigateTo(navigation.proposals);
+          cy.get<testFreeformProposal>('@rawProposal').then((rawProposal) => {
+            getProposalFromTitle(rawProposal.rationale.title).within(() =>
+              cy.getByTestId(viewProposalButton).click()
+            );
+          });
+          cy.getByTestId(proposalVoteProgressForPercentage)
+            .contains('100.00%')
+            .and('be.visible');
+          cy.getByTestId(proposalVoteProgressAgainstPercentage)
+            .contains('0.00%')
+            .and('be.visible');
+          // 3001-VOTE-065
+          cy.getByTestId(changeVoteButton).should('be.visible').click();
+          voteForProposal('for');
+          cy.getByTestId(proposalVoteProgressForTokens)
+            .contains(tokensRequiredToAchieveResult)
+            .and('be.visible');
+          cy.getByTestId(proposalVoteProgressAgainstTokens)
+            .contains('0.00')
+            .and('be.visible');
+          cy.getByTestId(voteBreakdownToggle).click();
+          getProposalInformationFromTable('Total tokens voted percentage')
+            .should('have.text', '0.00%')
+            .and('be.visible');
+          getProposalInformationFromTable('Tokens for proposal')
+            .should('have.text', tokensRequiredToAchieveResult)
+            .and('be.visible');
+          getProposalInformationFromTable('Tokens against proposal')
+            .should('have.text', '0.00')
+            .and('be.visible');
+          getProposalInformationFromTable('Number of voting parties')
+            .should('have.text', '1')
+            .and('be.visible');
+          getProposalInformationFromTable('Expected to pass')
+            .contains('👍')
+            .should('be.visible');
+          // 3001-VOTE-062
+          getProposalInformationFromTable('Token majority met')
+            .contains('👍')
+            .should('be.visible');
+          getProposalInformationFromTable('Token participation met')
+            .contains('👍')
+            .should('be.visible');
+          getProposalInformationFromTable('Tokens for proposal')
+            .contains(tokensRequiredToAchieveResult)
+            .and('be.visible');
+        });
     });
 
     it('Able to vote for proposal twice by switching public key', function () {
@@ -288,6 +360,10 @@ describe(
         voteForProposal('against');
         cy.contains('You voted: Against').should('be.visible');
         switchVegaWalletPubKey();
+        cy.getByTestId(proposalVoteProgressForTokens).should(
+          'contain.text',
+          '1.00'
+        );
         // Checking vote status for different public keys is displayed correctly
         cy.contains('You voted: For').should('be.visible');
       });

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

@@ -22,10 +22,12 @@ const proposalListItem = '[data-testid="proposals-list-item"]';
 const closedProposals = 'closed-proposals';
 const proposalStatus = 'proposal-status';
 const viewProposalButton = 'view-proposal-btn';
-const votesTable = 'user-vote';
+const votesTable = 'votes-table';
 const openProposals = 'open-proposals';
-const majorityVoteReached = 'token-majority-met';
-const minParticipationReached = 'token-participation-met';
+const proposalVoteProgressForPercentage =
+  'vote-progress-indicator-percentage-for';
+const majorityVoteReached = 'majority-reached';
+const minParticipationReached = 'participation-reached';
 const proposalTimeout = { timeout: 8000 };
 
 context(
@@ -68,6 +70,7 @@ context(
       cy.getByTestId('proposal-type').should('have.text', 'New market');
       cy.getByTestId(proposalStatus).should('have.text', 'Enacted');
       cy.getByTestId(votesTable).within(() => {
+        cy.contains('Vote passed.').should('be.visible');
         cy.contains('Voting has ended.').should('be.visible');
       });
     });
@@ -89,7 +92,7 @@ context(
             // 3001-VOTE-019 time to vote is highlighted red
             cy.getByTestId('vote-details')
               .find('span')
-              .should('have.class', 'text-vega-orange');
+              .should('have.class', 'text-vega-pink');
             cy.getByTestId(viewProposalButton).click();
           });
       });
@@ -106,9 +109,12 @@ context(
           );
         });
       cy.getByTestId(votesTable).within(() => {
+        cy.contains('Vote passed.').should('be.visible');
         cy.contains('Voting has ended.').should('be.visible');
       });
-      cy.getByTestId('votes-for-percentage').should('have.text', '100%');
+      cy.getByTestId(proposalVoteProgressForPercentage)
+        .contains('100.00%')
+        .and('be.visible');
       navigateTo(navigation.proposals);
       cy.contains(proposalTitle)
         .parentsUntil(proposalListItem)

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

@@ -298,6 +298,9 @@ context(
       getProposalFromTitle(proposalTitle).within(() =>
         cy.getByTestId(viewProposalButton).click()
       );
+      cy.contains('Vote breakdown').should('be.visible', {
+        timeout: 10000,
+      });
       cy.getByTestId(voteButtons).should('not.exist');
       cy.getByTestId('min-proposal-requirements').should(
         'have.text',

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

@@ -36,7 +36,6 @@ const proposalType = 'proposal-type';
 const proposalDetails = 'proposal-details';
 const newProposalSubmitButton = 'proposal-submit';
 const proposalVoteDeadline = 'proposal-vote-deadline';
-const proposalEnactmentDeadline = 'proposal-enactment-deadline';
 const proposalParameterSelect = 'proposal-parameter-select';
 const proposalMarketSelect = 'proposal-market-select';
 const newProposalTitle = 'proposal-title';
@@ -53,6 +52,8 @@ const enactmentDeadlineError = 'enactment-before-voting-deadline';
 const proposalDownloadBtn = 'proposal-download-json';
 const feedbackError = '[data-testid="Error"]';
 const viewProposalBtn = 'view-proposal-btn';
+const liquidityVoteStatus = 'liquidity-votes-status';
+const tokenVoteStatus = 'token-votes-status';
 const proposalJsonToggle = 'proposal-json-toggle';
 const proposalJsonSection = 'proposal-json';
 const vegaWalletPublicKey = Cypress.env('vegaWalletPublicKey');
@@ -228,8 +229,6 @@ context(
             parseSpecialCharSequences: false,
             delay: 2,
           });
-          cy.getByTestId(proposalVoteDeadline).clear().type('2');
-          cy.getByTestId(proposalEnactmentDeadline).clear().type('3');
         });
         cy.getByTestId(proposalDownloadBtn)
           .should('be.visible')
@@ -422,28 +421,27 @@ context(
             cy.getByTestId(viewProposalBtn).click();
           });
       });
-      cy.getByTestId('lp-majority-not-met').should(
-        'have.text',
-        '66% majority threshold not met'
+      cy.getByTestId(liquidityVoteStatus).should(
+        'contain.text',
+        'Currently expected to fail'
       );
-
-      cy.getByTestId('token-majority-not-met').should(
-        'have.text',
-        '66% majority threshold not met'
+      cy.getByTestId(tokenVoteStatus).should(
+        'contain.text',
+        'Currently expected to fail'
       );
       voteForProposal('for');
-      cy.getByTestId('lp-majority-met').should(
-        'have.text',
-        '66% majority threshold met'
+      cy.getByTestId(liquidityVoteStatus).should(
+        'contain.text',
+        'Currently expected to pass'
       );
-      cy.getByTestId('token-majority-met').should(
-        'have.text',
-        '66% majority threshold met'
-      );
-      cy.getByTestId('vote-status').should(
-        'have.text',
-        'Currently expected to  pass by token vote'
+      cy.getByTestId(tokenVoteStatus).should(
+        'contain.text',
+        'Currently expected to pass'
       );
+      cy.getByTestId('vote-breakdown-toggle').click();
+      getProposalInformationFromTable('Expected to pass')
+        .contains('👍 by token vote')
+        .should('be.visible');
     });
 
     // 3001-VOTE-026 3001-VOTE-027 3001-VOTE-028 3001-VOTE-095 3001-VOTE-096 3005-PASN-001
@@ -637,8 +635,6 @@ context(
           parseSpecialCharSequences: false,
           delay: 2,
         });
-        cy.getByTestId(proposalVoteDeadline).clear().type('2');
-        cy.getByTestId(proposalEnactmentDeadline).clear().type('3');
       });
       cy.getByTestId(proposalDownloadBtn)
         .should('be.visible')

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

@@ -11,6 +11,7 @@ import {
   enterRawProposalBody,
   generateFreeFormProposalTitle,
   getProposalFromTitle,
+  getProposalInformationFromTable,
   goToMakeNewProposal,
   governanceProposalType,
   submitUniqueRawProposal,
@@ -29,9 +30,7 @@ const proposalType = 'proposal-type';
 const proposalStatus = 'proposal-status';
 const proposalClosingDate = 'vote-details';
 const viewProposalButton = 'view-proposal-btn';
-const voteMajorityNotMet = 'token-majority-not-met';
-const voteMajorityMet = 'token-majority-met';
-const votesForPercentage = 'votes-for-percentage';
+const voteBreakDownToggle = 'vote-breakdown-toggle';
 
 describe('Governance flow for proposal list', { tags: '@slow' }, function () {
   before('connect wallets and set approval limit', function () {
@@ -122,15 +121,10 @@ describe('Governance flow for proposal list', { tags: '@slow' }, function () {
     submitUniqueRawProposal({ proposalTitle: proposalTitle });
     getProposalFromTitle(proposalTitle).within(() => {
       // 3001-VOTE-039
-      cy.getByTestId(voteMajorityNotMet).should(
+      cy.getByTestId('participation-not-reached').should(
         'have.text',
-        '66% majority threshold not met'
+        'Min. participation not reached'
       );
-      cy.getByTestId('token-participation-not-met').should(
-        'have.text',
-        '0.000000000000000000000015% participation threshold not met'
-      );
-      cy.getByTestId(votesForPercentage).should('have.text', '0%');
       cy.getByTestId(viewProposalButton).click();
     });
     voteForProposal('for');
@@ -140,15 +134,16 @@ describe('Governance flow for proposal list', { tags: '@slow' }, function () {
         'have.text',
         'Currently expected to  pass'
       );
-      cy.getByTestId(voteMajorityMet).should(
+      cy.getByTestId('user-voted-yes').should('exist');
+      cy.getByTestId('participation-reached').should(
         'have.text',
-        '66% majority threshold met'
-      );
-      cy.getByTestId(votesForPercentage).should('have.text', '100%');
-      cy.getByTestId('token-participation-met').should(
-        'have.text',
-        '0.000000000000000000000015% participation threshold met'
+        'Min. participation reached'
       );
+      cy.getByTestId(viewProposalButton).click();
     });
+    cy.getByTestId(voteBreakDownToggle).click();
+    getProposalInformationFromTable('Token participation met')
+      .contains('👍')
+      .should('be.visible');
   });
 });

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

@@ -212,7 +212,7 @@ context(
         closeStakingDialog();
         navigateTo(navigation.validators);
         cy.get(`[row-id="${0}"]`)
-          .first()
+          .eq(1)
           .within(() => {
             cy.getByTestId(stakeValidatorListTotalStake)
               .should('have.text', '3,002.00')
@@ -222,7 +222,7 @@ context(
               .and('be.visible');
           });
         cy.get(`[row-id="${1}"]`)
-          .first()
+          .eq(1)
           .within(() => {
             cy.getByTestId(stakeValidatorListTotalStake)
               .scrollIntoView()
@@ -262,10 +262,10 @@ context(
             '2'
           );
           waitForBeginningOfEpoch();
-          cy.getByTestId(
-            stakeValidatorListStakePercentage,
-            epochTimeout
-          ).should('have.text', '50.02%');
+          cy.getByTestId(stakeValidatorListStakePercentage).should(
+            'have.text',
+            '50.02%'
+          );
           navigateTo(navigation.validators);
           validateValidatorListTotalStakeAndShare('0', '3,002.00', '50.02%');
         }

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

@@ -15,7 +15,6 @@ const proposalDocumentationLink = 'proposal-documentation-link';
 const connectToVegaWalletButton = 'connect-to-vega-wallet-btn';
 const governanceDocsUrl = 'https://vega.xyz/governance';
 const networkUpgradeProposalListItem = 'protocol-upgrade-proposals-list-item';
-const proposalUpgradeBlockHeight = 'protocol-upgrade-proposal-block-height';
 const closedProposals = 'closed-proposals';
 const closedProposalToggle = 'closed-proposals-toggle-networkUpgrades';
 const protocolUpgradeTime = 'protocol-upgrade-time';
@@ -38,39 +37,11 @@ context(
     });
 
     // 3002-PROP-023 3004-PMAC-002 3005-PASN-002 3006-PASC-002 3007-PNEC-002 3008-PFRO-003
-    it('new proposal page should have button for link to more information on proposals', function () {
-      cy.getByTestId('new-proposal-link').click();
-      cy.url().should('include', '/proposals/propose/raw');
-      cy.contains('To see Explorer data on proposals visit').within(() => {
-        cy.getByTestId('external-link').should(
-          'have.attr',
-          'href',
-          'https://explorer.fairground.wtf/governance'
-        );
-      });
-      cy.contains(
-        '1. Sense check your proposal with the community on the forum:'
-      ).within(() => {
-        cy.getByTestId('external-link').should(
-          'have.attr',
-          'href',
-          'https://community.vega.xyz/c/governance/25'
-        );
-      });
-      cy.contains(
-        '2. Use the appropriate proposal template in the docs:'
-      ).within(() => {
-        cy.getByTestId('external-link').should(
-          'have.attr',
-          'href',
-          'https://docs.vega.xyz/mainnet/tutorials/proposals'
-        );
-      });
-      cy.contains('Connect your wallet to submit a proposal').should(
-        'be.visible'
-      );
-      cy.getByTestId('connect-to-vega-wallet-btn').should('exist');
-      navigateTo(navigation.proposals);
+    it('should have button for link to more information on proposals', function () {
+      const proposalsUrl = 'https://docs.vega.xyz/mainnet/tutorials/proposals';
+      cy.getByTestId('new-proposal-link')
+        .find('a')
+        .should('have.attr', 'href', proposalsUrl);
     });
 
     it('should be able to see a working link for - find out more about Vega governance', function () {
@@ -185,7 +156,7 @@ context(
               'have.text',
               'Vega release tag: v1'
             );
-            cy.getByTestId(proposalUpgradeBlockHeight).should(
+            cy.getByTestId('protocol-upgrade-proposal-block-height').should(
               'have.text',
               'Upgrade block height: 2015942'
             );
@@ -200,15 +171,7 @@ context(
       });
       cy.getByTestId(closedProposalToggle).click();
       cy.getByTestId(closedProposals).within(() => {
-        cy.getByTestId(networkUpgradeProposalListItem).should('have.length', 2);
-        cy.getByTestId(networkUpgradeProposalListItem)
-          .first()
-          .within(() => {
-            cy.getByTestId(proposalUpgradeBlockHeight).should(
-              'contain.text',
-              '10001'
-            );
-          });
+        cy.getByTestId(networkUpgradeProposalListItem).should('have.length', 1);
       });
     });
 
@@ -220,7 +183,7 @@ context(
         .first()
         .find('[data-testid="view-proposal-btn"]')
         .click();
-      cy.url().should('contain', '/protocol-upgrades/v1/2015942');
+      cy.url().should('contain', '/protocol-upgrades/v1');
       cy.getByTestId('protocol-upgrade-proposal').within(() => {
         cy.get('h1').should('have.text', 'Vega Release v1');
         cy.getByTestId('protocol-upgrade-block-height').should(
@@ -280,7 +243,7 @@ context(
           );
         cy.getByTestId('external-link')
           .should('have.attr', 'href')
-          .and('contain', '/proposals/protocol-upgrade/v1/2015942');
+          .and('contain', '/proposals/protocol-upgrade/v1');
       });
 
       // estimate does not display possibly due to mocks or Cypress unless the proposal is clicked on several times

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

@@ -146,7 +146,7 @@ export function getProposalInformationFromTable(heading: string) {
 }
 
 export function voteForProposal(vote: string) {
-  cy.get(voteButtons).should('be.visible', { timeout: 10000 });
+  cy.contains('Vote breakdown').should('be.visible', { timeout: 10000 });
   cy.get(voteButtons).contains(vote).click();
   cy.get(dialogTitle, proposalTimeout).should(
     'have.text',

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

@@ -105,13 +105,8 @@ export function createNewMarketProposalTxBody(): ProposalSubmissionBody {
             decimalPlaces: '5',
             positionDecimalPlaces: '5',
             linearSlippageFactor: '0.001',
-            liquiditySlaParameters: {
-              priceRange: '0.5',
-              commitmentMinTimeFraction: '0.1',
-              performanceHysteresisEpochs: 2,
-              slaCompetitionFactor: '0.1',
-            },
             quadraticSlippageFactor: '0',
+            lpPriceRange: '10',
             instrument: {
               name: 'Token test market',
               code: 'TEST.24h',
@@ -240,12 +235,7 @@ export function createSuccessorMarketProposalTxBody(
             positionDecimalPlaces: '5',
             linearSlippageFactor: '0.001',
             quadraticSlippageFactor: '0',
-            liquiditySlaParameters: {
-              priceRange: '0.5',
-              commitmentMinTimeFraction: '0.1',
-              performanceHysteresisEpochs: 2,
-              slaCompetitionFactor: '0.1',
-            },
+            lpPriceRange: '10',
             instrument: {
               name: 'Token test market',
               code: 'TEST.24h',

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

@@ -170,20 +170,21 @@ export function clickOnValidatorFromList(
   validatorName = null
 ) {
   cy.contains('Loading...', epochTimeout).should('not.exist');
+  waitForBeginningOfEpoch();
   // below is to ensure validator list is shown
   cy.get(stakeValidatorListName, { timeout: 10000 }).should('exist');
   cy.get(stakeValidatorListPendingStake, txTimeout).should(
     'not.contain',
     '2,000,000,000,000,000,000.00' // number due to bug #936
   );
-  waitForBeginningOfEpoch();
   if (validatorName) {
     cy.contains(validatorName).click();
   } else {
     cy.get(`[row-id="${validatorNumber}"]`)
       .should('be.visible')
       .first()
-      .click();
+      .as('validatorOnList');
+    cy.get('@validatorOnList').click();
   }
 }
 
@@ -195,7 +196,7 @@ export function validateValidatorListTotalStakeAndShare(
   cy.contains('Loading...', epochTimeout).should('not.exist');
   waitForBeginningOfEpoch();
   cy.get(`[row-id="${positionOnList}"]`)
-    .first()
+    .eq(1)
     .within(() => {
       cy.getByTestId(stakeValidatorListTotalStake, epochTimeout).should(
         'have.text',
@@ -218,9 +219,7 @@ export function ensureSpecifiedUnstakedTokensAreAssociated(
     .eq(1)
     .invoke('text')
     .then((unstakedBalance) => {
-      const tokenFloat = parseFloat(tokenAmount);
-      const unstakedFloat = parseFloat(unstakedBalance.replace(/,/g, ''));
-      if (tokenFloat != unstakedFloat) {
+      if (parseFloat(unstakedBalance) != parseFloat(tokenAmount)) {
         vegaWalletTeardown();
         cy.get(vegaWalletAssociatedBalance, txTimeout).contains(
           '0.00',

apps/governance/.env

@@ -23,7 +23,7 @@ NX_TENDERMINT_URL=https://tm.n01.stagnet1.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n01.stagnet1.vega.xyz/websocket
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false
@@ -31,4 +31,4 @@ LC_ALL="en_US.UTF-8"
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true
-NX_METAMASK_SNAPS=true
+NX_METAMASK_SNAPS=true

apps/governance/.env.capsule

@@ -20,9 +20,7 @@ NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
 NX_VEGA_REST_URL=http://localhost:3008/api/v2/
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
-
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=http://localhost:26617
 NX_TENDERMINT_WEBSOCKET_URL=wss://localhost:26617/websocket
@@ -32,4 +30,4 @@ CYPRESS_FAIRGROUND=false
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=false
-NX_METAMASK_SNAPS=false
+NX_METAMASK_SNAPS=false

apps/governance/.env.devnet

@@ -15,13 +15,11 @@ NX_VEGA_REST_URL=https://api.n00.devnet1.vega.xyz/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://tm.be.devnet1.vega.xyz/
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.devnet1.vega.xyz/websocket
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
-
 
 # Cosmic elevator flags
 NX_SUCCESSOR_MARKETS=true
-NX_METAMASK_SNAPS=true
+NX_METAMASK_SNAPS=true

apps/governance/.env.mainnet

@@ -15,8 +15,7 @@ NX_TRANCHES_SERVICE_URL=https://tranches-mainnet-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_REST_URL=https://api.vega.community/api/v2/
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-mainnet
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://be.vega.community
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.vega.community/websocket

apps/governance/.env.mainnet-mirror

@@ -14,8 +14,7 @@ NX_TRANCHES_SERVICE_URL=https://tranches-mainnet-mirror-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/mainnet/announcements.json
 NX_VEGA_REST_URL=https://api.mainnet-mirror.vega.rocks/api/v2/
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-mainnet
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://be.mainnet-mirror.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.mainnet-mirror.vega.rocks/websocket

apps/governance/.env.stagnet1

@@ -9,10 +9,9 @@ NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_REST_URL=https://api.n00.stagnet1.vega.xyz/api/v2/
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://tm.n01.stagnet1.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://tm.n01.stagnet1.vega.xyz/websocket

apps/governance/.env.testnet

@@ -14,10 +14,9 @@ NX_TRANCHES_SERVICE_URL=https://tranches-testnet-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_REST_URL=https://api.n07.testnet.vega.xyz/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://tm.be.testnet.vega.xyz
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.testnet.vega.xyz/websocket

apps/governance/.env.validators-testnet

@@ -11,10 +11,9 @@ NX_VEGA_EXPLORER_URL=https://explorer.validators-testnet.vega.rocks/
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
 NX_VEGA_REST_URL=https://api-validators-testnet.vega.rocks/api/v2/
 NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40@o286262.ingest.sentry.io/5882996
-NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/main/__generated__/oracle-proofs.json
 
 NX_CHROME_EXTENSION_URL=https://chrome.google.com/webstore/detail/vega-wallet-fairground/nmmjkiafpmphlikhefgjbblebfgclikn
-NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/firefox/addon/vega-wallet-fairground
+NX_MOZILLA_EXTENSION_URL=https://addons.mozilla.org/pl/firefox/addon/vega-wallet
 
 NX_TENDERMINT_URL=https://tm.be.validators-testnet.vega.rocks
 NX_TENDERMINT_WEBSOCKET_URL=wss://be.validators-testnet.vega.

apps/governance/src/app.tsx

@@ -184,7 +184,7 @@ const Web3Container = ({
                     <TemplateSidebar sidebar={sideBar}>
                       <AppRouter />
                     </TemplateSidebar>
-                    <footer className="p-4 border-t border-neutral-700 break-all">
+                    <footer className="p-4 border-t border-neutral-700">
                       <NetworkInfo />
                     </footer>
                   </AppLayout>
@@ -308,7 +308,7 @@ const AppContainer = () => {
     <Router>
       <ScrollToTop />
       <AppStateProvider>
-        <div className="min-h-full text-white">
+        <div className="min-h-full text-white grid">
           <NodeGuard
             skeleton={<div>{t('Loading')}</div>}
             failure={

apps/governance/src/components/wallet-card/wallet-card.tsx

@@ -54,7 +54,7 @@ export const WalletCardRow = ({
 }) => {
   const ref = React.useRef<HTMLDivElement | null>(null);
   useAnimateValue(ref, value);
-  const [integers, decimalsPlaces, separator] = useNumberParts(value, decimals);
+  const [integers, decimalsPlaces] = useNumberParts(value, decimals);
 
   return (
     <div
@@ -75,10 +75,7 @@ export const WalletCardRow = ({
           className="font-mono flex-1 text-right"
           data-testid="associated-amount"
         >
-          <span>
-            {integers}
-            {separator}
-          </span>
+          <span>{integers}.</span>
           <span>{decimalsPlaces}</span>
         </span>
       )}
@@ -113,10 +110,7 @@ export const WalletCardAsset = ({
   border,
   subheading,
 }: WalletCardAssetProps) => {
-  const [integers, decimalsPlaces, separator] = useNumberParts(
-    balance,
-    decimals
-  );
+  const [integers, decimalsPlaces] = useNumberParts(balance, decimals);
 
   return (
     <div className="flex flex-nowrap mt-2 mb-4">
@@ -138,10 +132,7 @@ export const WalletCardAsset = ({
           </div>
         </div>
         <div className="px-2 basis-full font-mono" data-testid="currency-value">
-          <span>
-            {integers}
-            {separator}
-          </span>
+          <span>{integers}.</span>
           <span className="text-neutral-400">{decimalsPlaces}</span>
         </div>
       </div>

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

@@ -201,8 +201,6 @@
   "STATE_WAITING_FOR_NODE_VOTE": "Waiting for node vote",
   "UpdateNetworkParameter": "Network parameter",
   "NewFreeform": "Freeform",
-  "setToPass": "Set to pass",
-  "setToFail": "Set to fail",
   "tokenVotes": "Token votes",
   "liquidityVotes": "Liquidity votes",
   "castYourVote": "Cast your vote",
@@ -211,23 +209,13 @@
   "against": "Against",
   "majorityRequired": "Majority Required",
   "participation": "Participation",
-  "majorityThreshold": "majority threshold",
-  "participationThreshold": "participation threshold",
-  "met": "met",
-  "notMet": "not met",
+  "met": "Met",
+  "notMet": "Not Met",
   "governanceRequired": "Required",
   "daysLeft": "{{daysLeft}} left to vote.",
   "toVote": "to vote",
   "voteFor": "Vote for",
   "voteAgainst": "Vote against",
-  "tokenVote": "Token vote",
-  "tokenVotesFor": "Token votes for",
-  "tokenVotesAgainst": "Token votes against",
-  "totalTokensVoted": "Total tokens voted",
-  "liquidityProviderVote": "Liquidity provider vote",
-  "liquidityProviderVotesFor": "LP votes for",
-  "liquidityProviderVotesAgainst": "LP votes against",
-  "totalLiquidityProviderTokensVoted": "Total LP tokens voted",
   "votingThresholdInfo": "If the token vote passes the participation threshold it will be the deciding vote. If not, the outcome will be determined by liquidity providers on this market.",
   "noGovernanceTokens": "You need some VEGA tokens to participate in governance",
   "youVoted": "You voted",
@@ -474,7 +462,7 @@
   "rewardsColLiquidityProvisionHeader": "LIQUIDITY PROVISION",
   "rewardsColLiquidityProvisionTooltip": "Liquidity provision rewards are distributed based on how much you have earned in liquidity fees, funded by a liquidity reward pool for that market",
   "rewardsColMarketCreationHeader": "MARKET CREATION",
-  "rewardsColMarketCreationTooltip": "Market creation rewards are paid out to the creator of any market that exceeds a set threshold of cumulative volume in a given epoch, currently {{marketCreationQuantumMultiple}}",
+  "rewardsColMarketCreationTooltip": "Market creation rewards are paid out to the creator of any market that exceeds a set threshold of cumulative volume in a given epoch, currently [rewards.marketCreationQuantumMultiple]",
   "rewardsColTotalHeader": "TOTAL",
   "ofTotalDistributed": "of total distributed",
   "checkBackSoon": "Check back soon",
@@ -708,7 +696,7 @@
   "NewAssetProposal": "New asset proposal",
   "UpdateAssetProposal": "Update asset proposal",
   "NewFreeformProposal": "New freeform proposal",
-  "NewRawProposal": "New proposal",
+  "NewRawProposal": "New raw proposal",
   "MinProposalRequirements": "You must have at least {{value}} VEGA associated to make a proposal",
   "MinProposalVoteRequirements": "You must have at least {{value}} VEGA associated to vote on this proposal",
   "totalSupply": "Total Supply",
@@ -870,9 +858,5 @@
   "Upgraded at": "Upgraded at",
   "dataIsIdentical": "Data is identical",
   "updatesToMarket": "Updates to market",
-  "viewAsParty": "View as party",
-  "HowToPropose": "How to make a proposal",
-  "HowToProposeRawStep1": "1. Sense check your proposal with the community on the forum:",
-  "HowToProposeRawStep2": "2. Use the appropriate proposal template in the docs:",
-  "HowToProposeRawStep3": "3. Submit on-chain below"
+  "viewAsParty": "View as party"
 }

apps/governance/src/routes/home/index.tsx

@@ -31,6 +31,10 @@ import {
   orderByDate,
   orderByUpgradeBlockHeight,
 } from '../proposals/components/proposals-list/proposals-list';
+import {
+  NetworkParams,
+  useNetworkParams,
+} from '@vegaprotocol/network-parameters';
 import { BigNumber } from '../../lib/bignumber';
 
 const nodesToShow = 6;
@@ -43,34 +47,57 @@ const HomeProposals = ({
   protocolUpgradeProposals: ProtocolUpgradeProposalFieldsFragment[];
 }) => {
   const { t } = useTranslation();
+  const {
+    params: networkParams,
+    loading: networkParamsLoading,
+    error: networkParamsError,
+  } = useNetworkParams([
+    NetworkParams.governance_proposal_market_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajorityLP,
+    NetworkParams.governance_proposal_asset_requiredMajority,
+    NetworkParams.governance_proposal_updateAsset_requiredMajority,
+    NetworkParams.governance_proposal_updateNetParam_requiredMajority,
+    NetworkParams.governance_proposal_freeform_requiredMajority,
+  ]);
 
   return (
-    <section className="mb-16 break-all" data-testid="home-proposals">
-      <Heading title={t('vegaGovernance')} />
-      <h3 className="mb-6">{t('homeProposalsIntro')}</h3>
-      <div className="mb-8">
-        <ExternalLink href={ExternalLinks.GOVERNANCE_PAGE}>
-          {t(`readMoreGovernance`)}
-        </ExternalLink>
-      </div>
+    <AsyncRenderer
+      loading={networkParamsLoading}
+      error={networkParamsError}
+      data={networkParams}
+    >
+      <section className="mb-16" data-testid="home-proposals">
+        <Heading title={t('vegaGovernance')} />
+        <h3 className="mb-6">{t('homeProposalsIntro')}</h3>
+        <div className="mb-8">
+          <ExternalLink href={ExternalLinks.GOVERNANCE_PAGE}>
+            {t(`readMoreGovernance`)}
+          </ExternalLink>
+        </div>
 
-      <SubHeading title={t('latestProposals')} />
-      <ul data-testid="home-proposal-list" className="grid gap-6">
-        {protocolUpgradeProposals.map((proposal, index) => (
-          <ProtocolUpgradeProposalsListItem key={index} proposal={proposal} />
-        ))}
+        <SubHeading title={t('latestProposals')} />
+        <ul data-testid="home-proposal-list" className="grid gap-6">
+          {protocolUpgradeProposals.map((proposal, index) => (
+            <ProtocolUpgradeProposalsListItem key={index} proposal={proposal} />
+          ))}
 
-        {proposals.map((proposal) => (
-          <ProposalsListItem key={proposal.id} proposal={proposal} />
-        ))}
-      </ul>
+          {proposals.map((proposal) => (
+            <ProposalsListItem
+              key={proposal.id}
+              proposal={proposal}
+              networkParams={networkParams}
+            />
+          ))}
+        </ul>
 
-      <div className="mt-6">
-        <Link to={`${Routes.PROPOSALS}`}>
-          <Button size="md">{t('homeProposalsButtonText')}</Button>
-        </Link>
-      </div>
-    </section>
+        <div className="mt-6">
+          <Link to={`${Routes.PROPOSALS}`}>
+            <Button size="md">{t('homeProposalsButtonText')}</Button>
+          </Link>
+        </div>
+      </section>
+    </AsyncRenderer>
   );
 };
 
@@ -279,8 +306,8 @@ const GovernanceHome = ({ name }: RouteChildProps) => {
         trimmedActiveNodes={trimmedActiveNodes}
       />
 
-      <section className="flex justify-between flex-wrap gap-12 mb-16">
-        <div className="min-w-[360px] flex-1" data-testid="home-rewards">
+      <section className="grid grid-cols-2 gap-12 mb-16">
+        <div data-testid="home-rewards">
           <Heading title={t('Rewards')} marginTop={false} />
           <h3 className="mb-6">{t('homeRewardsIntro')}</h3>
           <div className="flex items-center mb-8 gap-4">
@@ -290,7 +317,7 @@ const GovernanceHome = ({ name }: RouteChildProps) => {
           </div>
         </div>
 
-        <div className="min-w-[360px] flex-1" data-testid="home-vega-token">
+        <div data-testid="home-vega-token">
           <Heading title={t('vegaToken')} marginTop={false} />
           <h3 className="mb-6">{t('homeVegaTokenIntro')}</h3>
           <div className="flex items-center mb-8 gap-4">

apps/governance/src/routes/proposals/components/proposal-detail-header/proposal-header.spec.tsx

@@ -16,6 +16,7 @@ import { ProposalHeader } from './proposal-header';
 import {
   lastWeek,
   nextWeek,
+  mockNetworkParams,
   mockWalletContext,
   createUserVoteQueryMock,
 } from '../../test-helpers/mocks';
@@ -47,6 +48,7 @@ const renderComponent = (
             <ProposalHeader
               proposal={proposal}
               isListItem={isListItem}
+              networkParams={mockNetworkParams}
               voteState={voteState}
             />
           </VegaWalletContext.Provider>

apps/governance/src/routes/proposals/components/proposal-detail-header/proposal-header.tsx

@@ -8,19 +8,22 @@ import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
 import { truncateMiddle } from '../../../../lib/truncate-middle';
 import { CurrentProposalState } from '../current-proposal-state';
 import { ProposalInfoLabel } from '../proposal-info-label';
+import { ProposalVotingStatus } from '../proposal-voting-status';
+import type { NetworkParamsResult } from '@vegaprotocol/network-parameters';
 import { useSuccessorMarketProposalDetails } from '@vegaprotocol/proposals';
 import { FLAGS } from '@vegaprotocol/environment';
 import Routes from '../../../routes';
 import { Link } from 'react-router-dom';
 import type { VoteState } from '../vote-details/use-user-vote';
-import { VoteBreakdown } from '../vote-breakdown';
 
 export const ProposalHeader = ({
   proposal,
+  networkParams,
   isListItem = true,
   voteState,
 }: {
   proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
+  networkParams: Partial<NetworkParamsResult>;
   isListItem?: boolean;
   voteState?: VoteState | null;
 }) => {
@@ -143,7 +146,7 @@ export const ProposalHeader = ({
               className="flex items-center gap-2"
               data-testid={`user-voted-${voteState.toLowerCase()}`}
             >
-              <div data-testid="you-voted-icon">
+              <div className="text-vega-green" data-testid="you-voted-icon">
                 <VegaIcon name={VegaIconNames.VOTE} size={24} />
               </div>
               <div>
@@ -159,7 +162,7 @@ export const ProposalHeader = ({
         </div>
       </div>
 
-      <div data-testid="proposal-title" className="break-all">
+      <div data-testid="proposal-title">
         {isListItem ? (
           <header>
             <SubHeading
@@ -182,7 +185,7 @@ export const ProposalHeader = ({
         </div>
       )}
 
-      <VoteBreakdown proposal={proposal} />
+      <ProposalVotingStatus proposal={proposal} networkParams={networkParams} />
     </>
   );
 };

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

@@ -5,6 +5,7 @@ import {
   InstrumentInfoPanel,
   KeyDetailsInfoPanel,
   LiquidityMonitoringParametersInfoPanel,
+  LiquidityPriceRangeInfoPanel,
   MetadataInfoPanel,
   OracleInfoPanel,
   PriceMonitoringBoundsInfoPanel,
@@ -12,10 +13,6 @@ import {
   RiskModelInfoPanel,
   RiskParametersInfoPanel,
   SettlementAssetInfoPanel,
-  getDataSourceSpecForSettlementSchedule,
-  getDataSourceSpecForSettlementData,
-  getDataSourceSpecForTradingTermination,
-  getSigners,
 } from '@vegaprotocol/markets';
 import {
   Button,
@@ -27,6 +24,7 @@ import {
 import { SubHeading } from '../../../../components/heading';
 import { CollapsibleToggle } from '../../../../components/collapsible-toggle';
 import type { MarketInfo } from '@vegaprotocol/markets';
+import type { DataSourceDefinition } from '@vegaprotocol/types';
 import { create } from 'zustand';
 
 type MarketDataDialogState = {
@@ -61,31 +59,20 @@ export const ProposalMarketData = ({
     return null;
   }
 
-  const { product } = marketData.tradableInstrument.instrument;
-
-  const settlementData = getDataSourceSpecForSettlementData(product);
-  const settlementScheduleData =
-    getDataSourceSpecForSettlementSchedule(product);
-  const terminationData = getDataSourceSpecForTradingTermination(product);
-
-  const parentProduct = parentMarketData?.tradableInstrument.instrument.product;
+  const settlementData = marketData.tradableInstrument.instrument.product
+    .dataSourceSpecForSettlementData.data as DataSourceDefinition;
   const parentSettlementData =
-    parentProduct && getDataSourceSpecForSettlementData(parentProduct);
-  const parentSettlementScheduleData =
-    parentProduct && getDataSourceSpecForSettlementSchedule(parentProduct);
+    parentMarketData?.tradableInstrument.instrument?.product
+      ?.dataSourceSpecForSettlementData?.data;
+  const terminationData = marketData.tradableInstrument.instrument.product
+    .dataSourceSpecForTradingTermination.data as DataSourceDefinition;
   const parentTerminationData =
-    parentProduct && getDataSourceSpecForTradingTermination(parentProduct);
-
-  // TODO add settlementScheduleData for Perp Proposal
+    parentMarketData?.tradableInstrument.instrument?.product
+      ?.dataSourceSpecForTradingTermination?.data;
 
   const isParentSettlementDataEqual =
     parentSettlementData !== undefined &&
     isEqual(settlementData, parentSettlementData);
-
-  const isParentSettlementScheduleDataEqual =
-    parentSettlementData !== undefined &&
-    isEqual(settlementScheduleData, parentSettlementScheduleData);
-
   const isParentTerminationDataEqual =
     parentTerminationData !== undefined &&
     isEqual(terminationData, parentTerminationData);
@@ -98,6 +85,20 @@ export const ProposalMarketData = ({
       parentMarketData?.priceMonitoringSettings?.parameters?.triggers
     );
 
+  const getSigners = (data: DataSourceDefinition) => {
+    if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
+      const signers = data.sourceType.sourceType.signers || [];
+
+      return signers.map(({ signer }) => {
+        return (
+          (signer.__typename === 'ETHAddress' && signer.address) ||
+          (signer.__typename === 'PubKey' && signer.key)
+        );
+      });
+    }
+    return [];
+  };
+
   return (
     <section className="relative" data-testid="proposal-market-data">
       <CollapsibleToggle
@@ -128,9 +129,10 @@ export const ProposalMarketData = ({
               parentMarket={parentMarketData}
             />
 
-            {settlementData &&
-            terminationData &&
-            isEqual(getSigners(settlementData), getSigners(terminationData)) ? (
+            {isEqual(
+              getSigners(settlementData),
+              getSigners(terminationData)
+            ) ? (
               <>
                 <h2 className={marketDataHeaderStyles}>{t('Oracle')}</h2>
 
@@ -138,17 +140,14 @@ export const ProposalMarketData = ({
                   market={marketData}
                   type="settlementData"
                   parentMarket={
-                    isParentSettlementDataEqual ||
-                    isParentSettlementScheduleDataEqual
-                      ? undefined
-                      : parentMarketData
+                    isParentSettlementDataEqual ? undefined : parentMarketData
                   }
                 />
               </>
             ) : (
               <>
                 <h2 className={marketDataHeaderStyles}>
-                  {t('Settlement oracle')}
+                  {t('Settlement Oracle')}
                 </h2>
                 <OracleInfoPanel
                   market={marketData}
@@ -158,41 +157,16 @@ export const ProposalMarketData = ({
                   }
                 />
 
-                {marketData.tradableInstrument.instrument.product.__typename ===
-                  'Future' && (
-                  <div>
-                    <h2 className={marketDataHeaderStyles}>
-                      {t('Termination oracle')}
-                    </h2>
-                    <OracleInfoPanel
-                      market={marketData}
-                      type="termination"
-                      parentMarket={
-                        isParentTerminationDataEqual
-                          ? undefined
-                          : parentMarketData
-                      }
-                    />
-                  </div>
-                )}
-
-                {marketData.tradableInstrument.instrument.product.__typename ===
-                  'Perpetual' && (
-                  <div>
-                    <h2 className={marketDataHeaderStyles}>
-                      {t('Settlement schedule oracle')}
-                    </h2>
-                    <OracleInfoPanel
-                      market={marketData}
-                      type="settlementSchedule"
-                      parentMarket={
-                        isParentSettlementScheduleDataEqual
-                          ? undefined
-                          : parentMarketData
-                      }
-                    />
-                  </div>
-                )}
+                <h2 className={marketDataHeaderStyles}>
+                  {t('Termination Oracle')}
+                </h2>
+                <OracleInfoPanel
+                  market={marketData}
+                  type="termination"
+                  parentMarket={
+                    isParentTerminationDataEqual ? undefined : parentMarketData
+                  }
+                />
               </>
             )}
 
@@ -270,6 +244,14 @@ export const ProposalMarketData = ({
               market={marketData}
               parentMarket={parentMarketData}
             />
+
+            <h2 className={marketDataHeaderStyles}>
+              {t('Liquidity price range')}
+            </h2>
+            <LiquidityPriceRangeInfoPanel
+              market={marketData}
+              parentMarket={parentMarketData}
+            />
           </div>
         </>
       )}

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

@@ -0,0 +1 @@
+export { ProposalVotesTable } from './proposal-votes-table';

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

@@ -0,0 +1,119 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import { AppStateProvider } from '../../../../contexts/app-state/app-state-provider';
+import { ProposalVotesTable } from './proposal-votes-table';
+import { ProposalType } from '../proposal/proposal';
+import {
+  generateNoVotes,
+  generateProposal,
+  generateYesVotes,
+} from '../../test-helpers/generate-proposals';
+
+const defaultProposal = generateProposal();
+const defaultProposalType = ProposalType.PROPOSAL_NETWORK_PARAMETER;
+const updateMarketProposal = generateProposal({
+  terms: {
+    change: {
+      __typename: 'UpdateMarket',
+      marketId: '12345',
+    },
+  },
+  votes: {
+    __typename: 'ProposalVotes',
+    yes: generateYesVotes(10),
+    no: generateNoVotes(0),
+  },
+});
+const updateMarketProposalType = ProposalType.PROPOSAL_UPDATE_MARKET;
+
+const renderComponent = (
+  proposal = defaultProposal,
+  proposalType = defaultProposalType
+) =>
+  render(
+    <MockedProvider>
+      <AppStateProvider>
+        <ProposalVotesTable proposal={proposal} proposalType={proposalType} />
+      </AppStateProvider>
+    </MockedProvider>
+  );
+
+describe('Proposal Votes Table', () => {
+  it('should render successfully', () => {
+    const { baseElement } = renderComponent();
+    expect(baseElement).toBeTruthy();
+  });
+
+  it('should show vote breakdown fields, excluding custom update market fields', () => {
+    renderComponent();
+    fireEvent.click(screen.getByTestId('vote-breakdown-toggle'));
+    expect(screen.getByText('Expected to pass')).toBeInTheDocument();
+    expect(screen.getByText('Token majority met')).toBeInTheDocument();
+    expect(screen.getByText('Token participation met')).toBeInTheDocument();
+    expect(screen.getByText('Tokens for proposal')).toBeInTheDocument();
+    expect(screen.getByText('Total Supply')).toBeInTheDocument();
+    expect(screen.getByText('Tokens against proposal')).toBeInTheDocument();
+    expect(screen.getByText('Participation required')).toBeInTheDocument();
+    expect(screen.getByText('Majority Required')).toBeInTheDocument();
+    expect(screen.getByText('Number of voting parties')).toBeInTheDocument();
+    expect(screen.getByText('Total tokens voted')).toBeInTheDocument();
+    expect(
+      screen.getByText('Total tokens voted percentage')
+    ).toBeInTheDocument();
+    expect(screen.getByText('Number of votes for')).toBeInTheDocument();
+    expect(screen.getByText('Number of votes against')).toBeInTheDocument();
+    expect(screen.getByText('Yes percentage')).toBeInTheDocument();
+    expect(screen.getByText('No percentage')).toBeInTheDocument();
+    expect(screen.queryByText('Liquidity majority met')).toBeNull();
+    expect(screen.queryByText('Liquidity participation met')).toBeNull();
+    expect(screen.queryByText('Liquidity shares for proposal')).toBeNull();
+  });
+
+  it('displays different breakdown fields for update market proposal', () => {
+    renderComponent(updateMarketProposal, updateMarketProposalType);
+    fireEvent.click(screen.getByTestId('vote-breakdown-toggle'));
+    expect(screen.getByText('Liquidity majority met')).toBeInTheDocument();
+    expect(screen.getByText('Liquidity participation met')).toBeInTheDocument();
+    expect(
+      screen.getByText('Liquidity shares for proposal')
+    ).toBeInTheDocument();
+    expect(screen.queryByText('Number of voting parties')).toBeNull();
+    expect(screen.queryByText('Total tokens voted')).toBeNull();
+    expect(screen.queryByText('Total tokens voted percentage')).toBeNull();
+    expect(screen.queryByText('Number of votes for')).toBeNull();
+    expect(screen.queryByText('Number of votes against')).toBeNull();
+    expect(screen.queryByText('Yes percentage')).toBeNull();
+    expect(screen.queryByText('No percentage')).toBeNull();
+  });
+
+  it('displays if an update market proposal will pass by token vote', () => {
+    renderComponent(updateMarketProposal, updateMarketProposalType);
+    fireEvent.click(screen.getByTestId('vote-breakdown-toggle'));
+    expect(screen.getByText('👍 by token vote')).toBeInTheDocument();
+  });
+
+  it('displays if an update market proposal will pass by LP vote', () => {
+    renderComponent(
+      generateProposal({
+        terms: {
+          change: {
+            __typename: 'UpdateMarket',
+            marketId: '12345',
+          },
+        },
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: {
+            ...generateYesVotes(0, 1, '10'),
+          },
+          no: {
+            ...generateNoVotes(0, 1, '0'),
+          },
+        },
+      }),
+      updateMarketProposalType
+    );
+    fireEvent.click(screen.getByTestId('vote-breakdown-toggle'));
+    expect(screen.getByText('👍 by liquidity vote')).toBeInTheDocument();
+  });
+});

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

@@ -0,0 +1,177 @@
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import {
+  KeyValueTable,
+  KeyValueTableRow,
+  Thumbs,
+  RoundedWrapper,
+} from '@vegaprotocol/ui-toolkit';
+import { formatNumber, formatNumberPercentage } from '@vegaprotocol/utils';
+import { SubHeading } from '../../../../components/heading';
+import { useVoteInformation } from '../../hooks';
+import { useAppState } from '../../../../contexts/app-state/app-state-context';
+import { ProposalType } from '../proposal/proposal';
+import { CollapsibleToggle } from '../../../../components/collapsible-toggle';
+import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
+import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+
+interface ProposalVotesTableProps {
+  proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
+  proposalType: ProposalType | null;
+}
+
+export const ProposalVotesTable = ({
+  proposal,
+  proposalType,
+}: ProposalVotesTableProps) => {
+  const { t } = useTranslation();
+  const {
+    appState: { totalSupply },
+  } = useAppState();
+  const [showDetails, setShowDetails] = useState(false);
+  const {
+    willPassByTokenVote,
+    willPassByLPVote,
+    totalTokensPercentage,
+    participationMet,
+    participationLPMet,
+    totalTokensVoted,
+    noPercentage,
+    yesPercentage,
+    noTokens,
+    yesTokens,
+    yesEquityLikeShareWeight,
+    yesVotes,
+    noVotes,
+    totalVotes,
+    requiredMajorityPercentage,
+    requiredParticipation,
+    majorityMet,
+    majorityLPMet,
+  } = useVoteInformation({ proposal });
+
+  const isUpdateMarket = proposalType === ProposalType.PROPOSAL_UPDATE_MARKET;
+  const updateMarketWillPass = willPassByTokenVote || willPassByLPVote;
+  const updateMarketVotePassMethod = willPassByTokenVote
+    ? t('byTokenVote')
+    : t('byLiquidityVote');
+
+  return (
+    <>
+      <CollapsibleToggle
+        toggleState={showDetails}
+        setToggleState={setShowDetails}
+        dataTestId="vote-breakdown-toggle"
+      >
+        <SubHeading title={t('voteBreakdown')} />
+      </CollapsibleToggle>
+
+      {showDetails && (
+        <RoundedWrapper marginBottomLarge={true} paddingBottom={true}>
+          <KeyValueTable
+            data-testid="proposal-votes-table"
+            numerical={true}
+            headingLevel={4}
+          >
+            <KeyValueTableRow>
+              {t('expectedToPass')}
+              {isUpdateMarket ? (
+                updateMarketWillPass ? (
+                  <Thumbs up={true} text={updateMarketVotePassMethod} />
+                ) : (
+                  <Thumbs up={false} />
+                )
+              ) : willPassByTokenVote ? (
+                <Thumbs up={true} />
+              ) : (
+                <Thumbs up={false} />
+              )}
+            </KeyValueTableRow>
+            <KeyValueTableRow>
+              {t('majorityMet')}
+              {majorityMet ? <Thumbs up={true} /> : <Thumbs up={false} />}
+            </KeyValueTableRow>
+            {isUpdateMarket && (
+              <KeyValueTableRow>
+                {t('majorityLPMet')}
+                {majorityLPMet ? <Thumbs up={true} /> : <Thumbs up={false} />}
+              </KeyValueTableRow>
+            )}
+            <KeyValueTableRow>
+              {t('participationMet')}
+              {participationMet ? <Thumbs up={true} /> : <Thumbs up={false} />}
+            </KeyValueTableRow>
+            {isUpdateMarket && (
+              <KeyValueTableRow>
+                {t('participationLPMet')}
+                {participationLPMet ? (
+                  <Thumbs up={true} />
+                ) : (
+                  <Thumbs up={false} />
+                )}
+              </KeyValueTableRow>
+            )}
+            <KeyValueTableRow>
+              {t('tokenForProposal')}
+              {formatNumber(yesTokens, 2)}
+            </KeyValueTableRow>
+            {isUpdateMarket && (
+              <KeyValueTableRow>
+                {t('tokenLPForProposal')}
+                {formatNumber(yesEquityLikeShareWeight, 2)}
+              </KeyValueTableRow>
+            )}
+            <KeyValueTableRow>
+              {t('totalSupply')}
+              {formatNumber(totalSupply, 2)}
+            </KeyValueTableRow>
+            <KeyValueTableRow>
+              {t('tokensAgainstProposal')}
+              {formatNumber(noTokens, 2)}
+            </KeyValueTableRow>
+            <KeyValueTableRow>
+              {t('participationRequired')}
+              {formatNumberPercentage(requiredParticipation)}
+            </KeyValueTableRow>
+            <KeyValueTableRow>
+              {t('majorityRequired')}
+              {formatNumberPercentage(requiredMajorityPercentage)}
+            </KeyValueTableRow>
+            {!isUpdateMarket && (
+              <>
+                <KeyValueTableRow>
+                  {t('numberOfVotingParties')}
+                  {formatNumber(totalVotes, 0)}
+                </KeyValueTableRow>
+                <KeyValueTableRow>
+                  {t('totalTokensVotes')}
+                  {formatNumber(totalTokensVoted, 2)}
+                </KeyValueTableRow>
+                <KeyValueTableRow>
+                  {t('totalTokenVotedPercentage')}
+                  {formatNumberPercentage(totalTokensPercentage, 2)}
+                </KeyValueTableRow>
+                <KeyValueTableRow>
+                  {t('numberOfForVotes')}
+                  {formatNumber(yesVotes, 0)}
+                </KeyValueTableRow>
+                <KeyValueTableRow>
+                  {t('numberOfAgainstVotes')}
+                  {formatNumber(noVotes, 0)}
+                </KeyValueTableRow>
+                <KeyValueTableRow>
+                  {t('yesPercentage')}
+                  {formatNumberPercentage(yesPercentage, 2)}
+                </KeyValueTableRow>
+                <KeyValueTableRow noBorder={true}>
+                  {t('noPercentage')}
+                  {formatNumberPercentage(noPercentage, 2)}
+                </KeyValueTableRow>
+              </>
+            )}
+          </KeyValueTable>
+        </RoundedWrapper>
+      )}
+    </>
+  );
+};

apps/governance/src/routes/proposals/components/proposal-voting-status/index.tsx

@@ -0,0 +1 @@
+export * from './proposal-voting-status';

apps/governance/src/routes/proposals/components/proposal-voting-status/proposal-voting-status.spec.tsx

@@ -0,0 +1,153 @@
+import { render, screen } from '@testing-library/react';
+import { BrowserRouter as Router } from 'react-router-dom';
+import { MockedProvider } from '@apollo/client/testing';
+import { VegaWalletContext } from '@vegaprotocol/wallet';
+import {
+  lastWeek,
+  mockWalletContext,
+  networkParamsQueryMock,
+  nextWeek,
+  mockNetworkParams,
+} from '../../test-helpers/mocks';
+import { ProposalVotingStatus } from './proposal-voting-status';
+import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import type { MockedResponse } from '@apollo/client/testing';
+import {
+  generateNoVotes,
+  generateProposal,
+  generateYesVotes,
+} from '../../test-helpers/generate-proposals';
+import { ProposalState } from '@vegaprotocol/types';
+import { BigNumber } from '../../../../lib/bignumber';
+import type { AppState } from '../../../../contexts/app-state/app-state-context';
+
+const mockTotalSupply = new BigNumber(100);
+// Note - giving a fixedTokenValue of 1 means a ratio of 1:1 votes to tokens, making sums easier :)
+const fixedTokenValue = 1000000000000000000;
+
+const mockAppState: AppState = {
+  totalAssociated: new BigNumber('50063005'),
+  decimals: 18,
+  totalSupply: mockTotalSupply,
+  vegaWalletManageOverlay: false,
+  transactionOverlay: false,
+  bannerMessage: '',
+  disconnectNotice: false,
+};
+
+jest.mock('../../../../contexts/app-state/app-state-context', () => ({
+  useAppState: () => ({
+    appState: mockAppState,
+  }),
+}));
+
+const renderComponent = (
+  proposal: ProposalQuery['proposal'],
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  mocks: MockedResponse<any>[] = [networkParamsQueryMock]
+) =>
+  render(
+    <Router>
+      <MockedProvider mocks={mocks}>
+        <VegaWalletContext.Provider value={mockWalletContext}>
+          <ProposalVotingStatus
+            proposal={proposal}
+            networkParams={mockNetworkParams}
+          />
+        </VegaWalletContext.Provider>
+      </MockedProvider>
+    </Router>
+  );
+
+describe('ProposalVotingStatus', () => {
+  beforeAll(() => {
+    jest.useFakeTimers();
+    jest.setSystemTime(0);
+  });
+  afterAll(() => {
+    jest.useRealTimers();
+  });
+
+  it('Renders majority reached', () => {
+    const yesVotes = 100;
+    const noVotes = 0;
+
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_PASSED,
+        terms: {
+          closingDatetime: lastWeek.toString(),
+          enactmentDatetime: nextWeek.toString(),
+        },
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: generateYesVotes(yesVotes, fixedTokenValue),
+          no: generateNoVotes(noVotes, fixedTokenValue),
+        },
+      })
+    );
+    expect(screen.getByTestId('majority-reached')).toBeInTheDocument();
+  });
+
+  it('Renders majority not reached', () => {
+    const yesVotes = 20;
+    const noVotes = 80;
+
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_PASSED,
+        terms: {
+          closingDatetime: lastWeek.toString(),
+          enactmentDatetime: nextWeek.toString(),
+        },
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: generateYesVotes(yesVotes, fixedTokenValue),
+          no: generateNoVotes(noVotes, fixedTokenValue),
+        },
+      })
+    );
+    expect(screen.getByTestId('majority-not-reached')).toBeInTheDocument();
+  });
+
+  it('Renders participation reached', () => {
+    const yesVotes = 1000;
+    const noVotes = 0;
+
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_PASSED,
+        terms: {
+          closingDatetime: lastWeek.toString(),
+          enactmentDatetime: nextWeek.toString(),
+        },
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: generateYesVotes(yesVotes, fixedTokenValue),
+          no: generateNoVotes(noVotes, fixedTokenValue),
+        },
+      })
+    );
+    expect(screen.getByTestId('participation-reached')).toBeInTheDocument();
+  });
+
+  it('Renders participation not reached', () => {
+    const yesVotes = 0;
+    const noVotes = 0;
+
+    renderComponent(
+      generateProposal({
+        terms: {
+          closingDatetime: lastWeek.toString(),
+          enactmentDatetime: nextWeek.toString(),
+        },
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: generateYesVotes(yesVotes, fixedTokenValue),
+          no: generateNoVotes(noVotes, fixedTokenValue),
+        },
+      })
+    );
+    expect(screen.getByTestId('participation-not-reached')).toBeInTheDocument();
+  });
+});

apps/governance/src/routes/proposals/components/proposal-voting-status/proposal-voting-status.tsx

@@ -0,0 +1,174 @@
+import classNames from 'classnames';
+import { useTranslation } from 'react-i18next';
+import { Icon } from '@vegaprotocol/ui-toolkit';
+import { useVoteInformation } from '../../hooks';
+import { BigNumber } from '../../../../lib/bignumber';
+import type { NetworkParamsResult } from '@vegaprotocol/network-parameters';
+import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
+import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+
+const statusClasses = (reached: boolean) =>
+  classNames('flex items-center gap-2 px-4 py-2 rounded-md', {
+    'bg-vega-green-700': reached,
+    'bg-vega-red-700': !reached,
+  });
+
+const MajorityStatus = ({
+  reached,
+  requiredMajority,
+}: {
+  reached: boolean;
+  requiredMajority: string | null | undefined;
+}) => {
+  const { t } = useTranslation();
+
+  return (
+    <div
+      className={statusClasses(reached)}
+      data-testid="proposal-majority-status"
+    >
+      {reached ? <Icon name="tick" /> : <Icon name="cross" />}
+      {reached ? (
+        <div data-testid="majority-reached">
+          {requiredMajority ? (
+            <>
+              {new BigNumber(requiredMajority).times(100).toString()}%{' '}
+              {t('majorityVotedForProposal')}
+            </>
+          ) : (
+            t('requiredMajorityVotedForProposal')
+          )}
+        </div>
+      ) : (
+        <div data-testid="majority-not-reached">
+          {requiredMajority ? (
+            <>
+              {new BigNumber(requiredMajority).times(100).toString()}%{' '}
+              {t('majorityNotVotedForProposal')}
+            </>
+          ) : (
+            t('requiredMajorityNotVotedForProposal')
+          )}
+        </div>
+      )}
+    </div>
+  );
+};
+
+const ParticipationStatus = ({ reached }: { reached: boolean }) => {
+  const { t } = useTranslation();
+
+  return (
+    <div className={statusClasses(reached)}>
+      {reached ? (
+        <>
+          <Icon name="tick" />
+          <div data-testid="participation-reached">
+            {t('minParticipationReached')}
+          </div>
+        </>
+      ) : (
+        <>
+          <Icon name="cross" />
+          <div data-testid="participation-not-reached">
+            {t('minParticipationNotReached')}
+          </div>
+        </>
+      )}
+    </div>
+  );
+};
+
+export const ProposalVotingStatus = ({
+  proposal,
+  networkParams,
+}: {
+  proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
+  networkParams: Partial<NetworkParamsResult>;
+}) => {
+  const { t } = useTranslation();
+  const { majorityMet, majorityLPMet, participationMet, participationLPMet } =
+    useVoteInformation({
+      proposal,
+    });
+
+  if (!proposal) {
+    return null;
+  }
+
+  const isUpdateMarket = proposal?.terms.change.__typename === 'UpdateMarket';
+
+  let requiredVotingMajority = null;
+  let requiredVotingMajorityLP = null;
+
+  if (networkParams) {
+    switch (proposal.terms.change.__typename) {
+      case 'NewMarket':
+        requiredVotingMajority =
+          networkParams.governance_proposal_market_requiredMajority;
+        break;
+      case 'UpdateMarket':
+        requiredVotingMajority =
+          networkParams.governance_proposal_updateMarket_requiredMajority;
+        requiredVotingMajorityLP =
+          networkParams.governance_proposal_updateMarket_requiredMajorityLP;
+        break;
+      case 'NewAsset':
+        requiredVotingMajority =
+          networkParams.governance_proposal_asset_requiredMajority;
+        break;
+      case 'UpdateAsset':
+        requiredVotingMajority =
+          networkParams.governance_proposal_updateAsset_requiredMajority;
+        break;
+      case 'UpdateNetworkParameter':
+        requiredVotingMajority =
+          networkParams.governance_proposal_updateNetParam_requiredMajority;
+        break;
+      case 'NewFreeform':
+        requiredVotingMajority =
+          networkParams.governance_proposal_freeform_requiredMajority;
+        break;
+    }
+  }
+
+  if (isUpdateMarket) {
+    return (
+      <div className="mb-6">
+        <p>{t('Token vote')}</p>
+        <div
+          className="grid grid-cols-2 gap-4 items-center"
+          data-testid="token-vote-statuses"
+        >
+          <MajorityStatus
+            reached={majorityMet}
+            requiredMajority={requiredVotingMajority}
+          />{' '}
+          <ParticipationStatus reached={participationMet} />
+        </div>
+
+        <p className="mt-4">{t('Liquidity provider vote')}</p>
+        <div
+          className="grid grid-cols-2 gap-4 items-center"
+          data-testid="lp-vote-statuses"
+        >
+          <MajorityStatus
+            reached={majorityLPMet}
+            requiredMajority={requiredVotingMajorityLP}
+          />{' '}
+          <ParticipationStatus reached={participationLPMet} />
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="grid grid-cols-2 gap-4 items-center mb-6">
+      <MajorityStatus
+        reached={majorityMet}
+        requiredMajority={requiredVotingMajority}
+      />{' '}
+      <ParticipationStatus reached={participationMet} />
+    </div>
+  );
+};

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

@@ -34,6 +34,12 @@ jest.mock('../proposal-change-table', () => ({
 jest.mock('../proposal-json', () => ({
   ProposalJson: () => <div data-testid="proposal-json"></div>,
 }));
+jest.mock('../proposal-votes-table', () => ({
+  ProposalVotesTable: () => <div data-testid="proposal-votes-table"></div>,
+}));
+jest.mock('../vote-details', () => ({
+  VoteDetails: () => <div data-testid="proposal-vote-details"></div>,
+}));
 jest.mock('../list-asset', () => ({
   ListAsset: () => <div data-testid="proposal-list-asset"></div>,
 }));
@@ -98,6 +104,8 @@ it('renders each section', async () => {
   expect(await screen.findByTestId('proposal-header')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-change-table')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-json')).toBeInTheDocument();
+  expect(screen.getByTestId('proposal-votes-table')).toBeInTheDocument();
+  expect(screen.getByTestId('proposal-vote-details')).toBeInTheDocument();
   expect(screen.queryByTestId('proposal-list-asset')).not.toBeInTheDocument();
 });
 

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

@@ -5,8 +5,9 @@ import { ProposalHeader } from '../proposal-detail-header/proposal-header';
 import { ProposalDescription } from '../proposal-description';
 import { ProposalChangeTable } from '../proposal-change-table';
 import { ProposalJson } from '../proposal-json';
+import { ProposalVotesTable } from '../proposal-votes-table';
 import { ProposalAssetDetails } from '../proposal-asset-details';
-import { UserVote } from '../vote-details';
+import { VoteDetails } from '../vote-details';
 import { ListAsset } from '../list-asset';
 import Routes from '../../../routes';
 import { ProposalMarketData } from '../proposal-market-data';
@@ -21,6 +22,14 @@ import type { NetworkParamsResult } from '@vegaprotocol/network-parameters';
 import { useVoteSubmit } from '@vegaprotocol/proposals';
 import { useUserVote } from '../vote-details/use-user-vote';
 
+export enum ProposalType {
+  PROPOSAL_NEW_MARKET = 'PROPOSAL_NEW_MARKET',
+  PROPOSAL_UPDATE_MARKET = 'PROPOSAL_UPDATE_MARKET',
+  PROPOSAL_NEW_ASSET = 'PROPOSAL_NEW_ASSET',
+  PROPOSAL_UPDATE_ASSET = 'PROPOSAL_UPDATE_ASSET',
+  PROPOSAL_NETWORK_PARAMETER = 'PROPOSAL_NETWORK_PARAMETER',
+  PROPOSAL_FREEFORM = 'PROPOSAL_FREEFORM',
+}
 export interface ProposalProps {
   proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
   networkParams: Partial<NetworkParamsResult>;
@@ -71,32 +80,39 @@ export const Proposal = ({
   }
 
   let minVoterBalance = null;
+  let proposalType = null;
 
   if (networkParams) {
     switch (proposal.terms.change.__typename) {
       case 'NewMarket':
         minVoterBalance =
           networkParams.governance_proposal_market_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_NEW_MARKET;
         break;
       case 'UpdateMarket':
         minVoterBalance =
           networkParams.governance_proposal_updateMarket_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_UPDATE_MARKET;
         break;
       case 'NewAsset':
         minVoterBalance =
           networkParams.governance_proposal_asset_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_NEW_ASSET;
         break;
       case 'UpdateAsset':
         minVoterBalance =
           networkParams.governance_proposal_updateAsset_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_UPDATE_ASSET;
         break;
       case 'UpdateNetworkParameter':
         minVoterBalance =
           networkParams.governance_proposal_updateNetParam_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_NETWORK_PARAMETER;
         break;
       case 'NewFreeform':
         minVoterBalance =
           networkParams.governance_proposal_freeform_minVoterBalance;
+        proposalType = ProposalType.PROPOSAL_FREEFORM;
         break;
     }
   }
@@ -124,81 +140,91 @@ export const Proposal = ({
       <ProposalHeader
         proposal={proposal}
         isListItem={false}
+        networkParams={networkParams}
         voteState={voteState}
       />
 
-      <div className="my-10 break-all">
-        <ProposalChangeTable proposal={proposal} />
-      </div>
-
-      {proposal.terms.change.__typename === 'NewAsset' &&
-      proposal.terms.change.source.__typename === 'ERC20' &&
-      proposal.id ? (
-        <ListAsset
-          assetId={proposal.id}
-          withdrawalThreshold={proposal.terms.change.source.withdrawThreshold}
-          lifetimeLimit={proposal.terms.change.source.lifetimeLimit}
-        />
-      ) : null}
-
-      <div className="mb-4">
-        <ProposalDescription description={proposal.rationale.description} />
-      </div>
-
-      {newMarketData && (
-        <div className="mb-4">
-          <ProposalMarketData
-            marketData={newMarketData}
-            parentMarketData={parentMarketData ? parentMarketData : undefined}
-          />
+      <div id="details">
+        <div className="my-10">
+          <ProposalChangeTable proposal={proposal} />
         </div>
-      )}
 
-      {proposal.terms.change.__typename === 'UpdateMarket' && (
-        <div className="mb-4">
-          <ProposalMarketChanges
-            originalProposal={
-              originalMarketProposalRestData?.data?.proposal?.terms?.newMarket
-                ?.changes || {}
-            }
-            latestEnactedProposal={
-              mostRecentlyEnactedAssociatedMarketProposal?.node?.proposal?.terms
-                ?.updateMarket?.changes || {}
-            }
-            updatedProposal={
-              restData?.data?.proposal?.terms?.updateMarket?.changes || {}
-            }
+        {proposal.terms.change.__typename === 'NewAsset' &&
+        proposal.terms.change.source.__typename === 'ERC20' &&
+        proposal.id ? (
+          <ListAsset
+            assetId={proposal.id}
+            withdrawalThreshold={proposal.terms.change.source.withdrawThreshold}
+            lifetimeLimit={proposal.terms.change.source.lifetimeLimit}
           />
-        </div>
-      )}
+        ) : null}
 
-      {(proposal.terms.change.__typename === 'NewAsset' ||
-        proposal.terms.change.__typename === 'UpdateAsset') &&
-        asset && (
+        <div className="mb-4">
+          <ProposalDescription description={proposal.rationale.description} />
+        </div>
+
+        {newMarketData && (
           <div className="mb-4">
-            <ProposalAssetDetails asset={asset} />
+            <ProposalMarketData
+              marketData={newMarketData}
+              parentMarketData={parentMarketData ? parentMarketData : undefined}
+            />
           </div>
         )}
 
-      <div className="mb-10">
-        <RoundedWrapper paddingBottom={true}>
-          <UserVote
-            proposal={proposal}
-            minVoterBalance={minVoterBalance}
-            spamProtectionMinTokens={
-              networkParams?.spam_protection_voting_min_tokens
-            }
-            submit={submit}
-            dialog={Dialog}
-            transaction={transaction}
-            voteState={voteState}
-            voteDatetime={voteDatetime}
-          />
-        </RoundedWrapper>
+        {proposal.terms.change.__typename === 'UpdateMarket' && (
+          <div className="mb-4">
+            <ProposalMarketChanges
+              originalProposal={
+                originalMarketProposalRestData?.data?.proposal?.terms?.newMarket
+                  ?.changes || {}
+              }
+              latestEnactedProposal={
+                mostRecentlyEnactedAssociatedMarketProposal?.node?.proposal
+                  ?.terms?.updateMarket?.changes || {}
+              }
+              updatedProposal={
+                restData?.data?.proposal?.terms?.updateMarket?.changes || {}
+              }
+            />
+          </div>
+        )}
+
+        {(proposal.terms.change.__typename === 'NewAsset' ||
+          proposal.terms.change.__typename === 'UpdateAsset') &&
+          asset && (
+            <div className="mb-4">
+              <ProposalAssetDetails asset={asset} />
+            </div>
+          )}
+
+        <div className="mb-6">
+          <ProposalJson proposal={restData?.data?.proposal} />
+        </div>
       </div>
 
-      <div className="mb-6">
-        <ProposalJson proposal={restData?.data?.proposal} />
+      <div id="voting">
+        <div className="mb-10">
+          <RoundedWrapper paddingBottom={true}>
+            <VoteDetails
+              proposal={proposal}
+              proposalType={proposalType}
+              minVoterBalance={minVoterBalance}
+              spamProtectionMinTokens={
+                networkParams?.spam_protection_voting_min_tokens
+              }
+              submit={submit}
+              dialog={Dialog}
+              transaction={transaction}
+              voteState={voteState}
+              voteDatetime={voteDatetime}
+            />
+          </RoundedWrapper>
+        </div>
+
+        <div className="mb-4">
+          <ProposalVotesTable proposal={proposal} proposalType={proposalType} />
+        </div>
       </div>
     </section>
   );

apps/governance/src/routes/proposals/components/proposals-list-item/proposals-list-item-details.spec.tsx

@@ -6,7 +6,11 @@ import { MockedProvider } from '@apollo/client/testing';
 import { render, screen } from '@testing-library/react';
 import { format } from 'date-fns';
 import { ProposalRejectionReason, ProposalState } from '@vegaprotocol/types';
-import { generateProposal } from '../../test-helpers/generate-proposals';
+import {
+  generateNoVotes,
+  generateProposal,
+  generateYesVotes,
+} from '../../test-helpers/generate-proposals';
 import { ProposalsListItemDetails } from './proposals-list-item-details';
 import { DATE_FORMAT_DETAILED } from '../../../../lib/date-formats';
 import {
@@ -89,6 +93,84 @@ describe('Proposals list item details', () => {
     );
   });
 
+  it('Renders proposal state: Update market proposal - Currently expected to pass by LP vote', () => {
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_OPEN,
+        terms: {
+          change: {
+            __typename: 'UpdateMarket',
+          },
+        },
+        votes: {
+          yes: {
+            ...generateYesVotes(0),
+            totalEquityLikeShareWeight: '1000',
+          },
+          no: {
+            ...generateNoVotes(0),
+            totalEquityLikeShareWeight: '0',
+          },
+        },
+      })
+    );
+    expect(screen.getByTestId('vote-status')).toHaveTextContent(
+      'Currently expected to pass by LP vote'
+    );
+  });
+
+  it('Renders proposal state: Update market proposal - Currently expected to pass by token vote', () => {
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_OPEN,
+        terms: {
+          change: {
+            __typename: 'UpdateMarket',
+          },
+        },
+        votes: {
+          yes: {
+            ...generateYesVotes(1000, 1000),
+            totalEquityLikeShareWeight: '0',
+          },
+          no: {
+            ...generateNoVotes(0),
+            totalEquityLikeShareWeight: '0',
+          },
+        },
+      })
+    );
+    expect(screen.getByTestId('vote-status')).toHaveTextContent(
+      'Currently expected to pass by token vote'
+    );
+  });
+
+  it('Renders proposal state: Update market proposal - Currently expected to fail', () => {
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_OPEN,
+        terms: {
+          change: {
+            __typename: 'UpdateMarket',
+          },
+        },
+        votes: {
+          yes: {
+            ...generateYesVotes(0),
+            totalEquityLikeShareWeight: '0',
+          },
+          no: {
+            ...generateNoVotes(0),
+            totalEquityLikeShareWeight: '0',
+          },
+        },
+      })
+    );
+    expect(screen.getByTestId('vote-status')).toHaveTextContent(
+      'Currently expected to fail'
+    );
+  });
+
   it('Renders proposal state: Open - 5 minutes left to vote', () => {
     renderComponent(
       generateProposal({
@@ -131,6 +213,43 @@ describe('Proposals list item details', () => {
     );
   });
 
+  it('Renders proposal state: Open - majority not reached', () => {
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_OPEN,
+        terms: {
+          enactmentDatetime: nextWeek.toString(),
+        },
+        votes: {
+          no: generateNoVotes(1, 1000000000000000000),
+          yes: generateYesVotes(1, 1000000000000000000),
+        },
+      })
+    );
+    expect(screen.getByTestId('vote-status')).toHaveTextContent(
+      'Currently expected to fail'
+    );
+  });
+
+  it('Renders proposal state: Open - will pass', () => {
+    renderComponent(
+      generateProposal({
+        state: ProposalState.STATE_OPEN,
+        votes: {
+          __typename: 'ProposalVotes',
+          yes: generateYesVotes(3000, 1000000000000000000),
+          no: generateNoVotes(0),
+        },
+        terms: {
+          closingDatetime: nextWeek.toString(),
+        },
+      })
+    );
+    expect(screen.getByTestId('vote-status')).toHaveTextContent(
+      'Currently expected to pass'
+    );
+  });
+
   it('Renders proposal state: Rejected', () => {
     renderComponent(
       generateProposal({

apps/governance/src/routes/proposals/components/proposals-list-item/proposals-list-item-details.tsx

@@ -11,6 +11,7 @@ import {
 import Routes from '../../../routes';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import { useVoteInformation } from '../../hooks';
 
 export const ProposalsListItemDetails = ({
   proposal,
@@ -19,10 +20,18 @@ export const ProposalsListItemDetails = ({
 }) => {
   const { t } = useTranslation();
   const state = proposal?.state;
+  const { willPassByTokenVote, willPassByLPVote } = useVoteInformation({
+    proposal,
+  });
+  const updateMarketWillPass = willPassByTokenVote || willPassByLPVote;
+  const updateMarketVotePassMethod = willPassByTokenVote
+    ? t('byTokenVote')
+    : t('byLPVote');
   const nowToEnactmentInHours = differenceInHours(
     new Date(proposal?.terms.closingDatetime),
     new Date()
   );
+  const isUpdateMarket = proposal?.terms.change.__typename === 'UpdateMarket';
 
   let voteDetails: ReactNode;
   let voteStatus: ReactNode;
@@ -69,11 +78,31 @@ export const ProposalsListItemDetails = ({
     }
     case ProposalState.STATE_OPEN: {
       voteDetails = (
-        <span className={nowToEnactmentInHours < 6 ? 'text-vega-orange' : ''}>
+        <span className={nowToEnactmentInHours < 6 ? 'text-vega-pink' : ''}>
           {formatDistanceToNowStrict(new Date(proposal?.terms.closingDatetime))}{' '}
           {t('left to vote')}
         </span>
       );
+      voteStatus =
+        (isUpdateMarket &&
+          (updateMarketWillPass ? (
+            <>
+              {t('currentlySetTo')} {t('pass')} {updateMarketVotePassMethod}
+            </>
+          ) : (
+            <>
+              {t('currentlySetTo')} {t('fail')}
+            </>
+          ))) ||
+        (willPassByTokenVote ? (
+          <>
+            {t('currentlySetTo')} {t('pass')}
+          </>
+        ) : (
+          <>
+            {t('currentlySetTo')} {t('fail')}
+          </>
+        ));
       break;
     }
     case ProposalState.STATE_REJECTED: {

apps/governance/src/routes/proposals/components/proposals-list-item/proposals-list-item.tsx

@@ -4,19 +4,28 @@ import { ProposalsListItemDetails } from './proposals-list-item-details';
 import { useUserVote } from '../vote-details/use-user-vote';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import type { NetworkParamsResult } from '@vegaprotocol/network-parameters';
 
 interface ProposalsListItemProps {
   proposal?: ProposalFieldsFragment | ProposalQuery['proposal'] | null;
+  networkParams: Partial<NetworkParamsResult> | null;
 }
 
-export const ProposalsListItem = ({ proposal }: ProposalsListItemProps) => {
+export const ProposalsListItem = ({
+  proposal,
+  networkParams,
+}: ProposalsListItemProps) => {
   const { voteState } = useUserVote(proposal?.id);
-  if (!proposal || !proposal.id) return null;
+  if (!proposal || !proposal.id || !networkParams) return null;
 
   return (
     <li id={proposal.id} data-testid="proposals-list-item">
       <RoundedWrapper paddingBottom={true} heightFull={true}>
-        <ProposalHeader proposal={proposal} voteState={voteState} />
+        <ProposalHeader
+          proposal={proposal}
+          networkParams={networkParams}
+          voteState={voteState}
+        />
         <ProposalsListItemDetails proposal={proposal} />
       </RoundedWrapper>
     </li>

apps/governance/src/routes/proposals/components/proposals-list/proposals-list.tsx

@@ -7,13 +7,23 @@ import { ProposalsListItem } from '../proposals-list-item';
 import { ProtocolUpgradeProposalsListItem } from '../protocol-upgrade-proposals-list-item/protocol-upgrade-proposals-list-item';
 import { ProposalsListFilter } from '../proposals-list-filter';
 import Routes from '../../../routes';
-import { Button, Toggle } from '@vegaprotocol/ui-toolkit';
+import {
+  AsyncRenderer,
+  Button,
+  Toggle,
+  VegaIcon,
+  VegaIconNames,
+} from '@vegaprotocol/ui-toolkit';
 import { Link } from 'react-router-dom';
 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 { ExternalLinks } from '@vegaprotocol/environment';
+import { DocsLinks, ExternalLinks } from '@vegaprotocol/environment';
+import {
+  NetworkParams,
+  useNetworkParams,
+} from '@vegaprotocol/network-parameters';
 
 interface ProposalsListProps {
   proposals: Array<ProposalFieldsFragment | ProposalQuery['proposal']>;
@@ -50,10 +60,7 @@ export const orderByUpgradeBlockHeight = (
 ) =>
   orderBy(
     arr,
-    [
-      (p) => (p?.upgradeBlockHeight ? parseInt(p.upgradeBlockHeight, 10) : 0),
-      (p) => p.vegaReleaseTag,
-    ],
+    [(p) => p?.upgradeBlockHeight, (p) => p.vegaReleaseTag],
     ['desc', 'desc']
   );
 
@@ -68,6 +75,20 @@ export const ProposalsList = ({
   lastBlockHeight,
 }: ProposalsListProps) => {
   const { t } = useTranslation();
+  const {
+    params: networkParams,
+    loading: networkParamsLoading,
+    error: networkParamsError,
+  } = useNetworkParams([
+    NetworkParams.governance_proposal_market_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajorityLP,
+    NetworkParams.governance_proposal_asset_requiredMajority,
+    NetworkParams.governance_proposal_updateAsset_requiredMajority,
+    NetworkParams.governance_proposal_updateNetParam_requiredMajority,
+    NetworkParams.governance_proposal_freeform_requiredMajority,
+  ]);
+
   const [filterString, setFilterString] = useState('');
   const [closedProposalsView, setClosedProposalsView] =
     useState<ClosedProposalsViewOptions>(
@@ -132,161 +153,181 @@ export const ProposalsList = ({
     p?.party?.id?.toString().includes(filterString);
 
   return (
-    <div data-testid="proposals-list">
-      <div className="grid xs:grid-cols-2 items-center">
-        <Heading
-          centerContent={false}
-          marginBottom={false}
-          title={t('pageTitleProposals')}
-        />
+    <AsyncRenderer
+      loading={networkParamsLoading}
+      error={networkParamsError}
+      data={networkParams}
+    >
+      <div data-testid="proposals-list">
+        <div className="grid xs:grid-cols-2 items-center">
+          <Heading
+            centerContent={false}
+            marginBottom={false}
+            title={t('pageTitleProposals')}
+          />
 
-        <div className="xs:justify-self-end" data-testid="new-proposal-link">
-          <Link to={`${Routes.PROPOSALS}/propose/raw`}>
-            <Button variant="primary" size="sm">
-              <div className="flex items-center gap-1">{t('NewProposal')}</div>
-            </Button>
-          </Link>
+          {DocsLinks && (
+            <div
+              className="xs:justify-self-end"
+              data-testid="new-proposal-link"
+            >
+              <ExternalLink href={DocsLinks.PROPOSALS_GUIDE}>
+                <Button variant="primary" size="sm">
+                  <div className="flex items-center gap-1">
+                    {t('NewProposal')}
+                    <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} size={13} />
+                  </div>
+                </Button>
+              </ExternalLink>
+            </div>
+          )}
         </div>
-      </div>
 
-      <p className="mb-8">
-        {t(
-          `The Vega network is governed by the community. View active proposals, vote on them or propose changes to the network. Network upgrades are proposed and approved by validators.`
-        )}{' '}
-        <ExternalLink
-          data-testid="proposal-documentation-link"
-          href={ExternalLinks.GOVERNANCE_PAGE}
-          className="text-white"
-        >
-          {t(`Find out more about Vega governance`)}
-        </ExternalLink>
-      </p>
+        <p className="mb-8">
+          {t(
+            `The Vega network is governed by the community. View active proposals, vote on them or propose changes to the network. Network upgrades are proposed and approved by validators.`
+          )}{' '}
+          <ExternalLink
+            data-testid="proposal-documentation-link"
+            href={ExternalLinks.GOVERNANCE_PAGE}
+            className="text-white"
+          >
+            {t(`Find out more about Vega governance`)}
+          </ExternalLink>
+        </p>
 
-      {proposals.length > 0 && (
-        <ProposalsListFilter
-          filterString={filterString}
-          setFilterString={(value) => {
-            setFilterString(value);
-            if (value.length > 0) {
-              // If the filter is engaged, ensure the user is viewing governance proposals,
-              // as network upgrades do not have IDs to filter by and will be excluded.
-              setClosedProposalsView(
-                ClosedProposalsViewOptions.NetworkGovernance
-              );
-            }
-          }}
-        />
-      )}
+        {proposals.length > 0 && (
+          <ProposalsListFilter
+            filterString={filterString}
+            setFilterString={(value) => {
+              setFilterString(value);
+              if (value.length > 0) {
+                // If the filter is engaged, ensure the user is viewing governance proposals,
+                // as network upgrades do not have IDs to filter by and will be excluded.
+                setClosedProposalsView(
+                  ClosedProposalsViewOptions.NetworkGovernance
+                );
+              }
+            }}
+          />
+        )}
 
-      <section className="-mx-4 p-4 mb-8 bg-vega-dark-100">
-        <SubHeading title={t('openProposals')} />
+        <section className="-mx-4 p-4 mb-8 bg-vega-dark-100">
+          <SubHeading title={t('openProposals')} />
 
-        {sortedProposals.open.length > 0 ||
-        sortedProtocolUpgradeProposals.open.length > 0 ? (
-          <ul data-testid="open-proposals">
-            {filterString.length < 1 &&
-              sortedProtocolUpgradeProposals.open.map((proposal) => (
-                <ProtocolUpgradeProposalsListItem
-                  key={proposal.upgradeBlockHeight}
+          {sortedProposals.open.length > 0 ||
+          sortedProtocolUpgradeProposals.open.length > 0 ? (
+            <ul data-testid="open-proposals">
+              {filterString.length < 1 &&
+                sortedProtocolUpgradeProposals.open.map((proposal) => (
+                  <ProtocolUpgradeProposalsListItem
+                    key={proposal.upgradeBlockHeight}
+                    proposal={proposal}
+                  />
+                ))}
+
+              {sortedProposals.open.filter(filterPredicate).map((proposal) => (
+                <ProposalsListItem
+                  key={proposal?.id}
                   proposal={proposal}
+                  networkParams={networkParams}
                 />
               ))}
+            </ul>
+          ) : (
+            <p className="mb-0" data-testid="no-open-proposals">
+              {t('noOpenProposals')}
+            </p>
+          )}
+        </section>
 
-            {sortedProposals.open.filter(filterPredicate).map((proposal) => (
-              <ProposalsListItem key={proposal?.id} proposal={proposal} />
-            ))}
-          </ul>
-        ) : (
-          <p className="mb-0" data-testid="no-open-proposals">
-            {t('noOpenProposals')}
-          </p>
-        )}
-      </section>
-
-      <section className="relative">
-        <SubHeading title={t('closedProposals')} />
-        {sortedProposals.closed.length > 0 ||
-        sortedProtocolUpgradeProposals.closed.length > 0 ? (
-          <>
-            {
-              // We need both the closed proposals and closed protocol upgrade
-              // proposals to be present for there to be a toggle. It also gets
-              // hidden if the user has filtered the list, as the upgrade proposals
-              // do not have the necessary fields for filtering.
-              sortedProposals.closed.length > 0 &&
-                sortedProtocolUpgradeProposals.closed.length > 0 &&
-                filterString.length < 1 && (
-                  <div
-                    className="flex justify-end xl:-mt-12 pb-6"
-                    data-testid="toggle-closed-proposals"
-                  >
-                    <div className="w-full max-w-[420px]">
-                      <Toggle
-                        name="closed-proposals-toggle"
-                        toggles={[
-                          {
-                            label: t(
-                              ClosedProposalsViewOptions.NetworkGovernance
-                            ),
-                            value: ClosedProposalsViewOptions.NetworkGovernance,
-                          },
-                          {
-                            label: t(
-                              ClosedProposalsViewOptions.NetworkUpgrades
-                            ),
-                            value: ClosedProposalsViewOptions.NetworkUpgrades,
-                          },
-                        ]}
-                        checkedValue={closedProposalsView}
-                        onChange={(e) =>
-                          setClosedProposalsView(
-                            e.target.value as ClosedProposalsViewOptions
-                          )
-                        }
-                      />
+        <section className="relative">
+          <SubHeading title={t('closedProposals')} />
+          {sortedProposals.closed.length > 0 ||
+          sortedProtocolUpgradeProposals.closed.length > 0 ? (
+            <>
+              {
+                // We need both the closed proposals and closed protocol upgrade
+                // proposals to be present for there to be a toggle. It also gets
+                // hidden if the user has filtered the list, as the upgrade proposals
+                // do not have the necessary fields for filtering.
+                sortedProposals.closed.length > 0 &&
+                  sortedProtocolUpgradeProposals.closed.length > 0 &&
+                  filterString.length < 1 && (
+                    <div
+                      className="grid w-full justify-end xl:-mt-12 pb-6"
+                      data-testid="toggle-closed-proposals"
+                    >
+                      <div className="w-[440px]">
+                        <Toggle
+                          name="closed-proposals-toggle"
+                          toggles={[
+                            {
+                              label: t(
+                                ClosedProposalsViewOptions.NetworkGovernance
+                              ),
+                              value:
+                                ClosedProposalsViewOptions.NetworkGovernance,
+                            },
+                            {
+                              label: t(
+                                ClosedProposalsViewOptions.NetworkUpgrades
+                              ),
+                              value: ClosedProposalsViewOptions.NetworkUpgrades,
+                            },
+                          ]}
+                          checkedValue={closedProposalsView}
+                          onChange={(e) =>
+                            setClosedProposalsView(
+                              e.target.value as ClosedProposalsViewOptions
+                            )
+                          }
+                        />
+                      </div>
                     </div>
-                  </div>
-                )
-            }
+                  )
+              }
 
-            <ul data-testid="closed-proposals">
-              {closedProposalsView ===
-                ClosedProposalsViewOptions.NetworkUpgrades && (
-                <div data-testid="closed-upgrade-proposals">
-                  {sortedProtocolUpgradeProposals.closed.map((proposal) => (
-                    <ProtocolUpgradeProposalsListItem
-                      key={proposal.upgradeBlockHeight}
-                      proposal={proposal}
-                    />
-                  ))}
-                </div>
-              )}
-
-              {closedProposalsView ===
-                ClosedProposalsViewOptions.NetworkGovernance && (
-                <div data-testid="closed-governance-proposals">
-                  {sortedProposals.closed
-                    .filter(filterPredicate)
-                    .map((proposal) => (
-                      <ProposalsListItem
-                        key={proposal?.id}
+              <ul data-testid="closed-proposals">
+                {closedProposalsView ===
+                  ClosedProposalsViewOptions.NetworkUpgrades && (
+                  <div data-testid="closed-upgrade-proposals">
+                    {sortedProtocolUpgradeProposals.closed.map((proposal) => (
+                      <ProtocolUpgradeProposalsListItem
+                        key={proposal.upgradeBlockHeight}
                         proposal={proposal}
                       />
                     ))}
-                </div>
-              )}
-            </ul>
-          </>
-        ) : (
-          <p className="mb-0" data-testid="no-closed-proposals">
-            {t('noClosedProposals')}
-          </p>
-        )}
-      </section>
+                  </div>
+                )}
 
-      <Link className="underline" to={Routes.PROPOSALS_REJECTED}>
-        {t('seeRejectedProposals')}
-      </Link>
-    </div>
+                {closedProposalsView ===
+                  ClosedProposalsViewOptions.NetworkGovernance && (
+                  <div data-testid="closed-governance-proposals">
+                    {sortedProposals.closed
+                      .filter(filterPredicate)
+                      .map((proposal) => (
+                        <ProposalsListItem
+                          key={proposal?.id}
+                          proposal={proposal}
+                          networkParams={networkParams}
+                        />
+                      ))}
+                  </div>
+                )}
+              </ul>
+            </>
+          ) : (
+            <p className="mb-0" data-testid="no-closed-proposals">
+              {t('noClosedProposals')}
+            </p>
+          )}
+        </section>
+
+        <Link className="underline" to={Routes.PROPOSALS_REJECTED}>
+          {t('seeRejectedProposals')}
+        </Link>
+      </div>
+    </AsyncRenderer>
   );
 };

apps/governance/src/routes/proposals/components/proposals-list/rejected-proposals-list.tsx

@@ -1,10 +1,15 @@
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
 import { Heading } from '../../../../components/heading';
 import { ProposalsListItem } from '../proposals-list-item';
 import { ProposalsListFilter } from '../proposals-list-filter';
 import type { ProposalFieldsFragment } from '../../proposals/__generated__/Proposals';
 import type { ProposalQuery } from '../../proposal/__generated__/Proposal';
+import {
+  NetworkParams,
+  useNetworkParams,
+} from '@vegaprotocol/network-parameters';
 
 interface ProposalsListProps {
   proposals: Array<ProposalQuery['proposal'] | ProposalFieldsFragment>;
@@ -12,6 +17,19 @@ interface ProposalsListProps {
 
 export const RejectedProposalsList = ({ proposals }: ProposalsListProps) => {
   const { t } = useTranslation();
+  const {
+    params: networkParams,
+    loading: networkParamsLoading,
+    error: networkParamsError,
+  } = useNetworkParams([
+    NetworkParams.governance_proposal_market_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajority,
+    NetworkParams.governance_proposal_updateMarket_requiredMajorityLP,
+    NetworkParams.governance_proposal_asset_requiredMajority,
+    NetworkParams.governance_proposal_updateAsset_requiredMajority,
+    NetworkParams.governance_proposal_updateNetParam_requiredMajority,
+    NetworkParams.governance_proposal_freeform_requiredMajority,
+  ]);
   const [filterString, setFilterString] = useState('');
 
   const filterPredicate = (
@@ -21,7 +39,11 @@ export const RejectedProposalsList = ({ proposals }: ProposalsListProps) => {
     p?.party?.id?.toString().includes(filterString);
 
   return (
-    <>
+    <AsyncRenderer
+      loading={networkParamsLoading}
+      error={networkParamsError}
+      data={networkParams}
+    >
       <Heading title={t('pageTitleRejectedProposals')} />
       <ProposalsListFilter
         filterString={filterString}
@@ -31,7 +53,11 @@ export const RejectedProposalsList = ({ proposals }: ProposalsListProps) => {
         {proposals.length > 0 ? (
           <ul data-testid="rejected-proposals">
             {proposals.filter(filterPredicate).map((proposal) => (
-              <ProposalsListItem key={proposal?.id} proposal={proposal} />
+              <ProposalsListItem
+                key={proposal?.id}
+                proposal={proposal}
+                networkParams={networkParams}
+              />
             ))}
           </ul>
         ) : (
@@ -40,6 +66,6 @@ export const RejectedProposalsList = ({ proposals }: ProposalsListProps) => {
           </p>
         )}
       </section>
-    </>
+    </AsyncRenderer>
   );
 };