Fix/1128: Individual proposal pages failing to load - refactored from rest to gql as an easy way to avoid wrong endpoints (#1131)

This commit is contained in:
Sam Keen 2022-08-24 12:42:35 +01:00 committed by GitHub
parent 9b7a6b3598
commit 233647f550
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 49 deletions

View File

@ -1,11 +1,11 @@
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { SyntaxHighlighter } from '@vegaprotocol/ui-toolkit'; import { SyntaxHighlighter } from '@vegaprotocol/ui-toolkit';
import type { RestProposalResponse } from '../../proposal/proposal-container'; import type { Proposal_proposal_terms } from '../../proposal/__generated__/Proposal';
export const ProposalTermsJson = ({ export const ProposalTermsJson = ({
terms, terms,
}: { }: {
terms: RestProposalResponse; terms: Proposal_proposal_terms;
}) => { }) => {
const { t } = useTranslation(); const { t } = useTranslation();
return ( return (

View File

@ -1,6 +1,8 @@
import { ProposalHeader } from '../proposal-detail-header/proposal-header'; import { ProposalHeader } from '../proposal-detail-header/proposal-header';
import type { Proposal_proposal } from '../../proposal/__generated__/Proposal'; import type {
import type { RestProposalResponse } from '../../proposal/proposal-container'; Proposal_proposal,
Proposal_proposal_terms,
} from '../../proposal/__generated__/Proposal';
import { ProposalChangeTable } from '../proposal-change-table'; import { ProposalChangeTable } from '../proposal-change-table';
import { ProposalTermsJson } from '../proposal-terms-json'; import { ProposalTermsJson } from '../proposal-terms-json';
import { ProposalVotesTable } from '../proposal-votes-table'; import { ProposalVotesTable } from '../proposal-votes-table';
@ -8,7 +10,7 @@ import { VoteDetails } from '../vote-details';
interface ProposalProps { interface ProposalProps {
proposal: Proposal_proposal; proposal: Proposal_proposal;
terms: RestProposalResponse; terms: Proposal_proposal_terms;
} }
export const Proposal = ({ proposal, terms }: ProposalProps) => { export const Proposal = ({ proposal, terms }: ProposalProps) => {

View File

@ -1,30 +1,13 @@
import { gql, useQuery } from '@apollo/client'; import { gql, useQuery } from '@apollo/client';
import { Callout, Intent, Splash } from '@vegaprotocol/ui-toolkit'; import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { useParams } from 'react-router-dom'; import { useParams } from 'react-router-dom';
import { SplashLoader } from '../../../components/splash-loader';
import { useFetch } from '@vegaprotocol/react-helpers';
import { Proposal } from '../components/proposal'; import { Proposal } from '../components/proposal';
import { PROPOSALS_FRAGMENT } from '../proposal-fragment'; import { PROPOSALS_FRAGMENT } from '../proposal-fragment';
import type { import type {
Proposal as ProposalQueryResult, Proposal as ProposalQueryResult,
ProposalVariables, ProposalVariables,
} from './__generated__/Proposal'; } from './__generated__/Proposal';
import { ENV } from '../../../config/env';
/**
* TODO: how do we do this properly to ensure that it is kept up to date?
*/
export interface RestProposalResponse {
data: {
proposal: {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
terms: any;
};
};
}
export const PROPOSAL_QUERY = gql` export const PROPOSAL_QUERY = gql`
${PROPOSALS_FRAGMENT} ${PROPOSALS_FRAGMENT}
@ -36,16 +19,7 @@ export const PROPOSAL_QUERY = gql`
`; `;
export const ProposalContainer = () => { export const ProposalContainer = () => {
const { t } = useTranslation();
const params = useParams<{ proposalId: string }>(); const params = useParams<{ proposalId: string }>();
const proposalUrl = React.useMemo(
() => new URL(`governance/proposal/${params.proposalId}`, ENV.restUrl).href,
[params.proposalId]
);
const {
state: { loading: restLoading, error: restError, data: restData },
} = useFetch<RestProposalResponse>(proposalUrl);
const { data, loading, error } = useQuery< const { data, loading, error } = useQuery<
ProposalQueryResult, ProposalQueryResult,
@ -57,23 +31,11 @@ export const ProposalContainer = () => {
pollInterval: 5000, pollInterval: 5000,
}); });
if (error || restError) {
return ( return (
<Callout intent={Intent.Danger} title={t('Something went wrong')}> <AsyncRenderer loading={loading} error={error} data={data}>
<pre>{error?.message || restError?.message}</pre> {data && (
</Callout> <Proposal proposal={data.proposal} terms={data.proposal.terms} />
); )}
} </AsyncRenderer>
if (loading || !data || restLoading || !restData) {
return (
<Splash>
<SplashLoader />
</Splash>
);
}
return (
<Proposal proposal={data.proposal} terms={restData?.data.proposal.terms} />
); );
}; };