feat(3602): change url of upgrade proposals

Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

.github/workflows/publish-dist.yml

@@ -62,17 +62,19 @@ jobs:
       - name: Define variables
         run: |
           envName=''
+          domain="vega.rocks"
           if [[ "${{ github.event_name }}" = "push" ]]; then
-            domain="vega.rocks"
             if [[ "${{ github.ref }}" =~ .*release/.* ]]; then
               envName="$(echo ${{ github.ref }} | rev | cut -d '/' -f 1 | rev)"
-              if [[ "${{ github.ref }}" =~ .*mainnet.* ]]; then
-                domain="vega.community"
-              fi
             elif [[ "${{ github.ref }}" =~ .*develop$ ]]; then
               envName="stagnet1"
             elif [[ "${{ matrix.app}}" = "trading" ]] && [[ ${{ startsWith(github.ref, 'refs/tags/v') && 'true' || 'false' }} = "true" ]]; then
               envName="mainnet"
+            elif [[ "${{ github.ref }}" =~ .*main$ ]]; then
+              envName="mainnet"
+            fi
+            if [[ "${envName}" = "mainnet" ]]; then
+              domain="vega.xyz"
             fi
             bucketName="${{ matrix.app }}.${envName}.${domain}"
             echo BUCKET_NAME=${bucketName} >> $GITHUB_ENV

apps/explorer/.env

@@ -14,6 +14,7 @@ NX_ORACLE_PROOFS_URL=https://raw.githubusercontent.com/vegaprotocol/well-known/m
 NX_VEGA_GOVERNANCE_URL=https://stagnet1.governance.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.jsoo
 NX_VEGA_NETWORKS='{"TESTNET":"https://explorer.fairground.wtf","MAINNET":"https://explorer.vega.xyz"}'
+NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 
 # App flags
 NX_EXPLORER_ASSETS=1

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

@@ -48,11 +48,13 @@ export const Footer = () => {
           </Link>
         </div>
 
-        <div className="flex pl-2 content-center">
-          <ExternalLink href={ENV.addresses.feedback}>
-            {showFullFeedbackLabel ? t('Share your feedback') : t('Feedback')}
-          </ExternalLink>
-        </div>
+        {ENV.addresses.feedback ? (
+          <div className="flex pl-2 content-center">
+            <ExternalLink href={ENV.addresses.feedback}>
+              {showFullFeedbackLabel ? t('Share your feedback') : t('Feedback')}
+            </ExternalLink>
+          </div>
+        ) : null}
       </div>
     </footer>
   );
@@ -62,9 +64,5 @@ const NodeUrl = ({ url }: { url: string }) => {
   // get base url from api url, api sub domain
   const urlObj = new URL(url);
   const nodeUrl = urlObj.origin.replace(/^[^.]+\./g, '');
-  return (
-    <Link href={'https://' + nodeUrl} target="_blank">
-      {nodeUrl}
-    </Link>
-  );
+  return <span className="cursor-default">{nodeUrl}</span>;
 };

apps/governance-e2e/.env

@@ -17,6 +17,7 @@ NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
 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
+NX_VEGA_REST_URL=http://localhost:3008/api/v2/
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false

apps/governance/.env

@@ -15,6 +15,7 @@ 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/main/announcements.json
 NX_WALLETCONNECT_PROJECT_ID=fe8091dc35738863e509fc4947525c72
+NX_VEGA_REST_URL=https://api.n00.stagnet1.vega.xyz/api/v2/
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false

apps/governance/.env.capsule

@@ -17,6 +17,7 @@ NX_VEGA_WALLET_URL=http://localhost:1789
 NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-stagnet1-k8s.ops.vega.xyz
+NX_VEGA_REST_URL=http://localhost:3008/api/v2/
 
 #Test configuration variables
 CYPRESS_FAIRGROUND=false

apps/governance/.env.devnet

@@ -11,3 +11,4 @@ NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 NX_DELEGATIONS_PAGINATION=50
 NX_TRANCHES_SERVICE_URL=https://tranches-devnet1-k8s.ops.vega.xyz
 NX_ANNOUNCEMENTS_CONFIG_URL=https://raw.githubusercontent.com/vegaprotocol/announcements/fairground/announcements.json
+NX_VEGA_REST_URL=https://api.n00.devnet1.vega.xyz/api/v2/

apps/governance/.env.mainnet

@@ -12,3 +12,4 @@ NX_SENTRY_DSN=https://4b8c8a8ba07742648aa4dfe1b8d17e40:87edc2605e544f888305d7fc4
 NX_DELEGATIONS_PAGINATION=50
 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/

apps/governance/.env.stagnet1

@@ -8,3 +8,4 @@ NX_VEGA_DOCS_URL=https://docs.vega.xyz/testnet
 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/

apps/governance/.env.testnet

@@ -12,3 +12,4 @@ NX_HOSTED_WALLET_URL=https://wallet.testnet.vega.xyz
 NX_DELEGATIONS_PAGINATION=50
 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/

apps/governance/.env.validator-testnet

@@ -9,3 +9,4 @@ NX_ETHERSCAN_URL=https://sepolia.etherscan.io
 NX_GITHUB_FEEDBACK_URL=https://github.com/vegaprotocol/feedback/discussions
 NX_VEGA_EXPLORER_URL=https://dev.explorer.vega.xyz
 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/

apps/governance/src/config/env.ts

@@ -62,6 +62,7 @@ export const ENV = {
   ethWalletMnemonic: windowOrDefault('NX_ETH_WALLET_MNEMONIC'),
   localProviderUrl: windowOrDefault('NX_LOCAL_PROVIDER_URL'),
   delegationsPagination: windowOrDefault('NX_DELEGATIONS_PAGINATION'),
+  rest: windowOrDefault('NX_VEGA_REST_URL'),
   flags: {
     NETWORK_DOWN: TRUTHY.includes(windowOrDefault('NX_NETWORK_DOWN')),
     MOCK: TRUTHY.includes(windowOrDefault('NX_MOCKED')),

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

@@ -43,13 +43,17 @@ jest.mock('../list-asset', () => ({
 
 it('Renders with data-testid', async () => {
   const proposal = generateProposal();
-  render(<Proposal proposal={proposal as ProposalQuery['proposal']} />);
+  render(
+    <Proposal restData={{}} proposal={proposal as ProposalQuery['proposal']} />
+  );
   expect(await screen.findByTestId('proposal')).toBeInTheDocument();
 });
 
 it('renders each section', async () => {
   const proposal = generateProposal();
-  render(<Proposal proposal={proposal as ProposalQuery['proposal']} />);
+  render(
+    <Proposal restData={{}} proposal={proposal as ProposalQuery['proposal']} />
+  );
   expect(await screen.findByTestId('proposal-header')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-change-table')).toBeInTheDocument();
   expect(screen.getByTestId('proposal-json')).toBeInTheDocument();
@@ -76,6 +80,8 @@ it('renders whitelist section if proposal is new asset and source is erc20', asy
       },
     },
   });
-  render(<Proposal proposal={proposal as ProposalQuery['proposal']} />);
+  render(
+    <Proposal restData={{}} proposal={proposal as ProposalQuery['proposal']} />
+  );
   expect(screen.getByTestId('proposal-list-asset')).toBeInTheDocument();
 });

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

@@ -24,9 +24,11 @@ export enum ProposalType {
 }
 export interface ProposalProps {
   proposal: ProposalFieldsFragment | ProposalQuery['proposal'];
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  restData: any;
 }
 
-export const Proposal = ({ proposal }: ProposalProps) => {
+export const Proposal = ({ proposal, restData }: ProposalProps) => {
   const { params, loading, error } = useNetworkParams([
     NetworkParams.governance_proposal_market_minVoterBalance,
     NetworkParams.governance_proposal_updateMarket_minVoterBalance,
@@ -104,7 +106,7 @@ export const Proposal = ({ proposal }: ProposalProps) => {
         </div>
 
         <div className="mb-6">
-          <ProposalJson proposal={proposal} />
+          <ProposalJson proposal={restData?.data?.proposal} />
         </div>
 
         <div className="mb-10">

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

@@ -107,7 +107,7 @@ export const ProtocolUpgradeProposalsListItem = ({
           <div className="grid grid-cols-1 mt-3">
             <div className="justify-self-end">
               <Link
-                to={`${Routes.PROPOSALS}/protocol-upgrade/${stripFullStops(
+                to={`${Routes.PROTOCOL_UPGRADES}/${stripFullStops(
                   proposal.vegaReleaseTag
                 )}`}
               >

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

@@ -5,9 +5,15 @@ import { useParams } from 'react-router-dom';
 import { Proposal } from '../components/proposal';
 import { ProposalNotFound } from '../components/proposal-not-found';
 import { useProposalQuery } from './__generated__/Proposal';
+import { useFetch } from '@vegaprotocol/react-helpers';
+import { ENV } from '../../../config';
 
 export const ProposalContainer = () => {
   const params = useParams<{ proposalId: string }>();
+  const {
+    state: { loading: restLoading, error: restError, data: restData },
+  } = useFetch(`${ENV.rest}governance?proposalId=${params.proposalId}`);
+  console.log(restLoading, restError, restData);
   const { data, loading, error, refetch } = useProposalQuery({
     fetchPolicy: 'network-only',
     errorPolicy: 'ignore',
@@ -23,7 +29,7 @@ export const ProposalContainer = () => {
   return (
     <AsyncRenderer loading={loading} error={error} data={data}>
       {data?.proposal ? (
-        <Proposal proposal={data.proposal} />
+        <Proposal proposal={data.proposal} restData={restData} />
       ) : (
         <ProposalNotFound />
       )}

apps/governance/src/routes/router-config.tsx

@@ -224,6 +224,10 @@ const redirects = [
     path: '/vesting',
     element: <Navigate to={Routes.REDEEM} replace />,
   },
+  {
+    path: Routes.PROTOCOL_UPGRADES,
+    element: <Navigate to={Routes.PROPOSALS} replace />,
+  },
 ];
 
 const routerConfig = [
@@ -264,13 +268,13 @@ const routerConfig = [
       },
       { path: 'proposals', element: <LazyProposalsList /> },
       { path: ':proposalId', element: <LazyProposal /> },
-      {
-        path: 'protocol-upgrade/:proposalReleaseTag',
-        element: <LazyProtocolUpgradeProposal />,
-      },
       { path: 'rejected', element: <LazyRejectedProposalsList /> },
     ],
   },
+  {
+    path: `${Routes.PROTOCOL_UPGRADES}/:proposalReleaseTag`,
+    element: <LazyProtocolUpgradeProposal />,
+  },
   {
     path: Routes.VALIDATORS,
     element: <LazyStaking name="Staking" />,

apps/governance/src/routes/routes.ts

@@ -5,6 +5,7 @@ const Routes = {
   REWARDS: '/rewards',
   PROPOSALS: '/proposals',
   PROPOSALS_REJECTED: '/proposals/rejected',
+  PROTOCOL_UPGRADES: '/protocol-upgrades',
   NOT_PERMITTED: '/not-permitted',
   NOT_FOUND: '/not-found',
   CONTRACTS: '/contracts',

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

@@ -5,7 +5,7 @@ import { AssetDetailsTable, useAssetDataProvider } from '@vegaprotocol/assets';
 import { t } from '@vegaprotocol/i18n';
 import { marketDataProvider } from '../../market-data-provider';
 import { totalFeesPercentage } from '../../market-utils';
-import { Dialog, ExternalLink, Splash } from '@vegaprotocol/ui-toolkit';
+import { ExternalLink, Splash } from '@vegaprotocol/ui-toolkit';
 import {
   addDecimalsFormatNumber,
   formatNumber,
@@ -25,12 +25,9 @@ import { ConditionOperatorMapping } from '@vegaprotocol/types';
 import { MarketTradingModeMapping } from '@vegaprotocol/types';
 import { useEnvironment } from '@vegaprotocol/environment';
 import type { Provider } from '../../oracle-schema';
-import {
-  OracleBasicProfile,
-  OracleProfileTitle,
-  OracleFullProfile,
-} from '../../components';
-import { useOracleProofs, useOracleMarkets } from '../../hooks';
+import { OracleBasicProfile } from '../../components/oracle-basic-profile';
+import { useOracleProofs } from '../../hooks';
+import { OracleDialog } from '../oracle-dialog/oracle-dialog';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 
 type PanelProps = Pick<
@@ -613,34 +610,6 @@ const NoOracleProof = ({
   );
 };
 
-export const OracleDialog = ({
-  provider,
-  dataSourceSpecId,
-  open,
-  onChange,
-}: {
-  dataSourceSpecId: string;
-  provider: Provider;
-  open: boolean;
-  onChange?: (isOpen: boolean) => void;
-}) => {
-  const oracleMarkets = useOracleMarkets(provider);
-  return (
-    <Dialog
-      title={<OracleProfileTitle provider={provider} />}
-      aria-labelledby="oracle-proof-dialog"
-      open={open}
-      onChange={onChange}
-    >
-      <OracleFullProfile
-        provider={provider}
-        dataSourceSpecId={dataSourceSpecId}
-        markets={oracleMarkets}
-      />
-    </Dialog>
-  );
-};
-
 const OracleProfile = (props: {
   provider: Provider;
   dataSourceSpecId: string;

libs/markets/src/lib/components/market-info/market-info.mock.ts

@@ -143,7 +143,7 @@ export const marketInfoQuery = (
                         __typename: 'Signer',
                         signer: {
                           __typename: 'PubKey',
-                          key: '69464e35bcb8e8a2900ca0f87acaf252d50cf2ab2fc73694845a16b7c8a0dc6f',
+                          key: '6d9d35f657589e40ddfb448b7ad4a7463b66efb307527fedd2aa7df1bbd5ea61',
                         },
                       },
                     ],
@@ -164,7 +164,7 @@ export const marketInfoQuery = (
                         __typename: 'Signer',
                         signer: {
                           __typename: 'PubKey',
-                          key: '69464e35bcb8e8a2900ca0f87acaf252d50cf2ab2fc73694845a16b7c8a0dc6f',
+                          key: '6d9d35f657589e40ddfb448b7ad4a7463b66efb307527fedd2aa7df1bbd5ea61',
                         },
                       },
                     ],

libs/markets/src/lib/components/markets-container/oracle-status.tsx

@@ -1,8 +1,10 @@
 import { useMemo } from 'react';
 import { useEnvironment } from '@vegaprotocol/environment';
-import { t } from '@vegaprotocol/i18n';
+import { Icon } from '@vegaprotocol/ui-toolkit';
+import type { IconName } from '@blueprintjs/icons';
 import { getMatchingOracleProvider, useOracleProofs } from '../../hooks';
 import type { Market } from '../../markets-provider';
+import { getVerifiedStatusIcon } from '../oracle-basic-profile';
 
 export const OracleStatus = ({
   dataSourceSpecForSettlementData,
@@ -23,22 +25,15 @@ export const OracleStatus = ({
         dataSourceSpecForTradingTermination.data,
         providers
       );
-      if (
-        (settlementDataProvider &&
-          settlementDataProvider.oracle.status !== 'GOOD') ||
-        (tradingTerminationDataProvider &&
-          tradingTerminationDataProvider.oracle.status !== 'GOOD')
-      ) {
-        return (
-          <span
-            className="ml-1"
-            role="img"
-            aria-label={t('oracle status not healthy')}
-          >
-            ⛔
-          </span>
-        );
+      let maliciousOracleProvider = null;
+      if (settlementDataProvider?.oracle.status !== 'GOOD') {
+        maliciousOracleProvider = settlementDataProvider;
+      } else if (tradingTerminationDataProvider?.oracle.status !== 'GOOD') {
+        maliciousOracleProvider = tradingTerminationDataProvider;
       }
+      if (!maliciousOracleProvider) return null;
+      const { icon } = getVerifiedStatusIcon(maliciousOracleProvider);
+      return <Icon size={3} name={icon as IconName} className="ml-1" />;
     }
     return null;
   }, [

libs/markets/src/lib/components/oracle-banner/oracle-banner.tsx

@@ -6,27 +6,13 @@ import {
   NotificationBanner,
   ButtonLink,
 } from '@vegaprotocol/ui-toolkit';
-import { OracleDialog } from '../market-info';
-
-export const oracleStatuses = {
-  UNKNOWN: t(
-    "This public key's proofs have not been verified yet, or no proofs have been provided yet."
-  ),
-  GOOD: t("This public key's proofs have been verified."),
-  SUSPICIOUS: t(
-    'This public key is suspected to be acting in bad faith, pending investigation.'
-  ),
-  MALICIOUS: t('This public key has been observed acting in bad faith.'),
-  RETIRED: t('This public key is no longer in use.'),
-  COMPROMISED: t(
-    'This public key is no longer in the control of its original owners.'
-  ),
-};
+import { OracleDialog } from '../oracle-dialog';
+import { oracleStatuses } from './oracle-statuses';
 
 export const OracleBanner = ({ marketId }: { marketId: string }) => {
   const [open, onChange] = useState(false);
-  const settlementOracle = useMarketOracle(marketId);
-  const tradingTerminationOracle = useMarketOracle(
+  const { data: settlementOracle } = useMarketOracle(marketId);
+  const { data: tradingTerminationOracle } = useMarketOracle(
     marketId,
     'dataSourceSpecForTradingTermination'
   );
@@ -36,15 +22,7 @@ export const OracleBanner = ({ marketId }: { marketId: string }) => {
   } else if (tradingTerminationOracle?.provider.oracle.status !== 'GOOD') {
     maliciousOracle = tradingTerminationOracle;
   }
-
   if (!maliciousOracle) return null;
-  if (!settlementOracle && !tradingTerminationOracle) {
-    return (
-      <NotificationBanner intent={Intent.Primary}>
-        <div>{t('There is no oracle for this market.')} </div>
-      </NotificationBanner>
-    );
-  }
 
   const { provider } = maliciousOracle;
   return (

libs/markets/src/lib/components/oracle-banner/oracle-statuses.ts

@@ -0,0 +1,16 @@
+import { t } from '@vegaprotocol/i18n';
+
+export const oracleStatuses = {
+  UNKNOWN: t(
+    "This public key's proofs have not been verified yet, or no proofs have been provided yet."
+  ),
+  GOOD: t("This public key's proofs have been verified."),
+  SUSPICIOUS: t(
+    'This public key is suspected to be acting in bad faith, pending investigation.'
+  ),
+  MALICIOUS: t('This public key has been observed acting in bad faith.'),
+  RETIRED: t('This public key is no longer in use.'),
+  COMPROMISED: t(
+    'This public key is no longer in the control of its original owners.'
+  ),
+};

libs/markets/src/lib/components/oracle-dialog/index.tsx

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

libs/markets/src/lib/components/oracle-dialog/oracle-dialog.tsx

@@ -0,0 +1,35 @@
+import { Dialog } from '@vegaprotocol/ui-toolkit';
+import {
+  OracleProfileTitle,
+  OracleFullProfile,
+} from '../../components/oracle-full-profile';
+import { useOracleMarkets } from '../../hooks';
+import type { Provider } from '../../oracle-schema';
+
+export const OracleDialog = ({
+  provider,
+  dataSourceSpecId,
+  open,
+  onChange,
+}: {
+  dataSourceSpecId: string;
+  provider: Provider;
+  open: boolean;
+  onChange?: (isOpen: boolean) => void;
+}) => {
+  const oracleMarkets = useOracleMarkets(provider);
+  return (
+    <Dialog
+      title={<OracleProfileTitle provider={provider} />}
+      aria-labelledby="oracle-proof-dialog"
+      open={open}
+      onChange={onChange}
+    >
+      <OracleFullProfile
+        provider={provider}
+        dataSourceSpecId={dataSourceSpecId}
+        markets={oracleMarkets}
+      />
+    </Dialog>
+  );
+};

libs/markets/src/lib/components/oracle-full-profile/index.ts

@@ -1,2 +1 @@
-export * from './oracle-full-profile.stories';
 export * from './oracle-full-profile';

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

@@ -9,7 +9,7 @@ import {
   VegaIcon,
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
-import { oracleStatuses } from '../oracle-banner';
+import { oracleStatuses } from '../oracle-banner/oracle-statuses';
 import type { IconName } from '@blueprintjs/icons';
 import classNames from 'classnames';
 import { getLinkIcon, getVerifiedStatusIcon } from '../oracle-basic-profile';

libs/markets/src/lib/hooks/use-market-oracle.spec.ts

@@ -1,6 +1,6 @@
 import { renderHook } from '@testing-library/react';
 import { useMarketOracle } from './use-market-oracle';
-import type { MarketInfoQuery } from '../components/market-info/__generated__/MarketInfo';
+import type { MarketFieldsFragment } from '../__generated__/markets';
 import type { Provider } from '../oracle-schema';
 
 const ORACLE_PROOFS_URL = 'ORACLE_PROOFS_URL';
@@ -10,43 +10,42 @@ const key = 'key';
 const dataSourceSpecId = 'dataSourceSpecId';
 
 const mockEnvironment = jest.fn(() => ({ ORACLE_PROOFS_URL }));
-const mockDataProvider = jest.fn<
-  { data: MarketInfoQuery['market'] },
-  unknown[]
->(() => ({
-  data: {
-    tradableInstrument: {
-      instrument: {
-        product: {
-          dataSourceSpecForSettlementData: {
-            id: dataSourceSpecId,
-            data: {
-              sourceType: {
-                __typename: 'DataSourceDefinitionExternal',
+const mockMarket = jest.fn<{ data: MarketFieldsFragment | null }, unknown[]>(
+  () => ({
+    data: {
+      tradableInstrument: {
+        instrument: {
+          product: {
+            dataSourceSpecForSettlementData: {
+              id: dataSourceSpecId,
+              data: {
                 sourceType: {
-                  signers: [
-                    {
-                      signer: {
-                        __typename: 'ETHAddress',
-                        address,
+                  __typename: 'DataSourceDefinitionExternal',
+                  sourceType: {
+                    signers: [
+                      {
+                        signer: {
+                          __typename: 'ETHAddress',
+                          address,
+                        },
                       },
-                    },
-                    {
-                      signer: {
-                        __typename: 'PubKey',
-                        key,
+                      {
+                        signer: {
+                          __typename: 'PubKey',
+                          key,
+                        },
                       },
-                    },
-                  ],
+                    ],
+                  },
                 },
               },
             },
           },
         },
       },
-    },
-  } as MarketInfoQuery['market'],
-}));
+    } as MarketFieldsFragment,
+  })
+);
 
 const mockOracleProofs = jest.fn<{ data?: Provider[] }, unknown[]>(() => ({}));
 
@@ -54,9 +53,8 @@ jest.mock('@vegaprotocol/environment', () => ({
   useEnvironment: jest.fn((args) => mockEnvironment()),
 }));
 
-jest.mock('@vegaprotocol/data-provider', () => ({
-  ...jest.requireActual('@vegaprotocol/data-provider'),
-  useDataProvider: jest.fn((args) => mockDataProvider()),
+jest.mock('../markets-provider', () => ({
+  useMarket: jest.fn((args) => mockMarket()),
 }));
 
 jest.mock('./use-oracle-proofs', () => ({
@@ -66,15 +64,15 @@ jest.mock('./use-oracle-proofs', () => ({
 const marketId = 'marketId';
 describe('useMarketOracle', () => {
   it('returns undefined if no market info present', () => {
-    mockDataProvider.mockReturnValueOnce({ data: null });
+    mockMarket.mockReturnValueOnce({ data: null });
     const { result } = renderHook(() => useMarketOracle(marketId));
-    expect(result.current).toBeUndefined();
+    expect(result.current?.data).toBeUndefined();
   });
 
   it('returns undefined if no oracle proofs present', () => {
     mockOracleProofs.mockReturnValueOnce({ data: undefined });
     const { result } = renderHook(() => useMarketOracle(marketId));
-    expect(result.current).toBeUndefined();
+    expect(result.current?.data).toBeUndefined();
   });
 
   it('returns oracle matched by eth_address', () => {
@@ -102,8 +100,8 @@ describe('useMarketOracle', () => {
       data,
     });
     const { result } = renderHook(() => useMarketOracle(marketId));
-    expect(result.current?.dataSourceSpecId).toBe(dataSourceSpecId);
-    expect(result.current?.provider).toBe(data[1]);
+    expect(result.current?.data?.dataSourceSpecId).toBe(dataSourceSpecId);
+    expect(result.current?.data?.provider).toBe(data[1]);
   });
 
   it('returns oracle matching by public_key', () => {
@@ -131,7 +129,7 @@ describe('useMarketOracle', () => {
       data,
     });
     const { result } = renderHook(() => useMarketOracle(marketId));
-    expect(result.current?.dataSourceSpecId).toBe(dataSourceSpecId);
-    expect(result.current?.provider).toBe(data[1]);
+    expect(result.current?.data?.dataSourceSpecId).toBe(dataSourceSpecId);
+    expect(result.current?.data?.provider).toBe(data[1]);
   });
 });

libs/markets/src/lib/hooks/use-market-oracle.ts

@@ -1,7 +1,7 @@
 import { useEnvironment } from '@vegaprotocol/environment';
 import { useOracleProofs } from './use-oracle-proofs';
-import { useDataProvider } from '@vegaprotocol/data-provider';
-import { marketInfoProvider } from '../components/market-info/market-info-data-provider';
+import { useMarket } from '../markets-provider';
+
 import { useMemo } from 'react';
 import type { Provider } from '../oracle-schema';
 import type { DataSourceSpecFragment } from '../__generated__/OracleMarketsSpec';
@@ -41,23 +41,30 @@ export const useMarketOracle = (
   dataSourceType:
     | 'dataSourceSpecForSettlementData'
     | 'dataSourceSpecForTradingTermination' = 'dataSourceSpecForSettlementData'
-) => {
+): {
+  data?: {
+    provider: NonNullable<ReturnType<typeof getMatchingOracleProvider>>;
+    dataSourceSpecId: string;
+  };
+  loading?: boolean;
+} => {
   const { ORACLE_PROOFS_URL } = useEnvironment();
-  const { data: marketInfo } = useDataProvider({
-    dataProvider: marketInfoProvider,
-    variables: { marketId },
-  });
-  const { data: providers } = useOracleProofs(ORACLE_PROOFS_URL);
+  const { data: market, loading: marketLoading } = useMarket(marketId);
+  const { data: providers, loading: providersLoading } =
+    useOracleProofs(ORACLE_PROOFS_URL);
   return useMemo(() => {
-    if (!providers || !marketInfo) {
-      return undefined;
+    if (marketLoading || providersLoading) {
+      return { loading: true };
+    }
+    if (!providers || !market) {
+      return { data: undefined };
     }
     const dataSourceSpec =
-      marketInfo.tradableInstrument.instrument.product[dataSourceType];
+      market.tradableInstrument.instrument.product[dataSourceType];
     const provider = getMatchingOracleProvider(dataSourceSpec.data, providers);
     if (provider) {
-      return { provider, dataSourceSpecId: dataSourceSpec.id };
+      return { data: { provider, dataSourceSpecId: dataSourceSpec.id } };
     }
-    return undefined;
-  }, [marketInfo, dataSourceType, providers]);
+    return { data: undefined };
+  }, [market, dataSourceType, providers, marketLoading, providersLoading]);
 };

libs/markets/src/lib/markets.mock.ts

@@ -64,26 +64,44 @@ export const createMarketFragment = (
           },
           dataSourceSpecForTradingTermination: {
             __typename: 'DataSourceSpec',
-            id: 'oracleId',
+            id: 'f028fe5ea7de3890962a05a7163fdde562629af649ed81b8c8902fafb6eef04f',
             data: {
               __typename: 'DataSourceDefinition',
               sourceType: {
                 __typename: 'DataSourceDefinitionExternal',
                 sourceType: {
                   __typename: 'DataSourceSpecConfiguration',
+                  signers: [
+                    {
+                      __typename: 'Signer',
+                      signer: {
+                        __typename: 'PubKey',
+                        key: '6d9d35f657589e40ddfb448b7ad4a7463b66efb307527fedd2aa7df1bbd5ea61',
+                      },
+                    },
+                  ],
                 },
               },
             },
           },
           dataSourceSpecForSettlementData: {
             __typename: 'DataSourceSpec',
-            id: 'oracleId',
+            id: 'f028fe5ea7de3890962a05a7163fdde562629af649ed81b8c8902fafb6eef04f',
             data: {
               __typename: 'DataSourceDefinition',
               sourceType: {
                 __typename: 'DataSourceDefinitionExternal',
                 sourceType: {
                   __typename: 'DataSourceSpecConfiguration',
+                  signers: [
+                    {
+                      __typename: 'Signer',
+                      signer: {
+                        __typename: 'PubKey',
+                        key: '6d9d35f657589e40ddfb448b7ad4a7463b66efb307527fedd2aa7df1bbd5ea61',
+                      },
+                    },
+                  ],
                 },
               },
             },

libs/ui-toolkit/src/components/syntax-highlighter/syntax-highlighter.tsx

@@ -1,4 +1,5 @@
 import classNames from 'classnames';
+import { useMemo } from 'react';
 import Highlighter from 'react-syntax-highlighter';
 
 export const SyntaxHighlighter = ({
@@ -8,6 +9,13 @@ export const SyntaxHighlighter = ({
   data: unknown;
   size?: 'smaller' | 'default';
 }) => {
+  const parsedData = useMemo(() => {
+    try {
+      return JSON.stringify(data, null, '  ');
+    } catch (e) {
+      return 'Unable to parse data';
+    }
+  }, [data]);
   return (
     <div
       className={classNames('syntax-highlighter-wrapper', {
@@ -15,7 +23,7 @@ export const SyntaxHighlighter = ({
       })}
     >
       <Highlighter language="json" useInlineStyles={false}>
-        {JSON.stringify(data, null, '  ')}
+        {parsedData}
       </Highlighter>
     </div>
   );