diff --git a/src/pages/proposal-page.tsx b/src/pages/proposal-page.tsx index cd924e6..0244b79 100644 --- a/src/pages/proposal-page.tsx +++ b/src/pages/proposal-page.tsx @@ -1,10 +1,12 @@ +import { useState } from 'react' import { redirect, useParams } from 'react-router-dom' +import Long from 'long' import { VoteOptionType } from 'types' import { throwError } from 'util/errors' import { ROUTE_PATH } from 'routes' -import { voteOnProposal } from 'api/proposal.actions' +import { executeProposal, voteOnProposal } from 'api/proposal.actions' import { useGroup, useGroupMembers, @@ -16,12 +18,19 @@ import { import { useTxToasts } from 'hooks/use-toasts' import { Button, PageContainer, RouteLink, Stack } from '@/atoms' +import { + FormFooter, + FormSubmitHiddenButton, + useFormFooter, +} from '@/molecules/form-footer' import { Loading } from '@/molecules/loading' import { ProposalDetails } from '@/organisms/proposal-details' import { ProposalFinalTallyTable } from '@/organisms/proposal-final-tally-table' import { ProposalSummary } from '@/organisms/proposal-summary' import { ProposalVotesTable } from '@/organisms/proposal-votes-table' +import { ProposalStatus } from '../util/enums' + import { BackIcon } from 'assets/tsx' export default function ProposalPage() { @@ -32,7 +41,11 @@ export default function ProposalPage() { const { data: historicalProposal, isLoading: isLoadingHistoricalProposal } = useHistoricalProposal(proposalId) - const { data: proposal, isLoading: isLoadingProposal } = useProposal( + const { + data: proposal, + isLoading: isLoadingProposal, + refetch: refetchProposal, + } = useProposal( proposalId, !isLoadingHistoricalProposal && !historicalProposal?.historical, ) @@ -42,6 +55,13 @@ export default function ProposalPage() { isLoading: isLoadingVotes, refetch: refetchVotes, } = useProposalVotes(proposalId) + const [submitting, setSubmitting] = useState(false) + + useFormFooter({ + onNext: undefined, + onPrev: undefined, + btnText: 'Execute', + }) const { data: userVotes, @@ -73,6 +93,22 @@ export default function ProposalPage() { } } + async function handleExec(event) { + event.preventDefault() + setSubmitting(true) + if (!proposalId) throwError('Proposal ID is required to execute proposal') + try { + const { transactionHash } = await executeProposal({ + proposalId: Long.fromString(proposalId), + }) + toastSuccess(transactionHash) + refetchProposal() + } catch (err) { + toastErr(err) + } + setSubmitting(false) + } + const userVote = userVotes ? userVotes.find((v) => v.proposalId.toString() === proposalId) : undefined @@ -90,50 +126,64 @@ export default function ProposalPage() { isHistorical ? historicalProposal.votingPeriodEnd : proposal.votingPeriodEnd, ).getTime() < now.getTime() + const isExecutable = + proposal && proposal.status === ProposalStatus.PROPOSAL_STATUS_ACCEPTED + return ( - - -
- -
- {isHistorical ? ( - <> - - - - - ) : ( - <> - - - {votingClosed ? ( - - ) : ( - - )} - - )} -
-
+ <> + + +
+ +
+ {isHistorical ? ( + <> + + + + + ) : ( + <> + + + {votingClosed ? ( + + ) : ( + + )} + + )} +
+
+ {isExecutable && ( +
+ + + )} + + ) } diff --git a/yarn.lock b/yarn.lock index 16c30d9..e0c2cd7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5707,10 +5707,10 @@ dependencies: remove-accents "0.4.2" -"@tanstack/query-core@4.29.25": - version "4.29.25" - resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.29.25.tgz#605d357968a740544af6754004eed1dfd4587cb8" - integrity sha512-DI4y4VC6Uw4wlTpOocEXDky69xeOScME1ezLKsj+hOk7DguC9fkqXtp6Hn39BVb9y0b5IBrY67q6kIX623Zj4Q== +"@tanstack/query-core@4.32.6": + version "4.32.6" + resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.32.6.tgz#cf7df91ab1542e67a82624fefb12a55f580b4c01" + integrity sha512-YVB+mVWENQwPyv+40qO7flMgKZ0uI41Ph7qXC2Zf1ft5AIGfnXnMZyifB2ghhZ27u+5wm5mlzO4Y6lwwadzxCA== "@tanstack/react-query-devtools@^4.29.19": version "4.29.19" @@ -5721,12 +5721,12 @@ superjson "^1.10.0" use-sync-external-store "^1.2.0" -"@tanstack/react-query@^4.29.25": - version "4.29.25" - resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.29.25.tgz#64df3260b65760fbd3c81ffae23b7b3802c71aa6" - integrity sha512-c1+Ezu+XboYrdAMdusK2fTdRqXPMgPAnyoTrzHOZQqr8Hqz6PNvV9DSKl8agUo6nXX4np7fdWabIprt+838dLg== +"@tanstack/react-query@^4.29.5": + version "4.32.6" + resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.32.6.tgz#f88c2d57f423d4cd295c501df2edeb3285a301bd" + integrity sha512-AITu/IKJJJXsHHeXNBy5bclu12t08usMCY0vFC2dh9SP/w6JAk5U9GwfjOIPj3p+ATADZvxQPe8UiCtMLNeQbg== dependencies: - "@tanstack/query-core" "4.29.25" + "@tanstack/query-core" "4.32.6" use-sync-external-store "^1.2.0" "@tanstack/react-table@^8.9.1":