From 926aa6e1f5c791897367df29ada1b0cfa1c06d60 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Sun, 23 Aug 2020 17:41:31 +0200 Subject: [PATCH] Remove ote duplication on treasury (#3488) --- .../Overview/{Submission.tsx => Council.tsx} | 20 +-- .../page-treasury/src/Overview/Proposal.tsx | 37 +++-- .../page-treasury/src/Overview/Voting.tsx | 148 ------------------ 3 files changed, 23 insertions(+), 182 deletions(-) rename packages/page-treasury/src/Overview/{Submission.tsx => Council.tsx} (86%) delete mode 100644 packages/page-treasury/src/Overview/Voting.tsx diff --git a/packages/page-treasury/src/Overview/Submission.tsx b/packages/page-treasury/src/Overview/Council.tsx similarity index 86% rename from packages/page-treasury/src/Overview/Submission.tsx rename to packages/page-treasury/src/Overview/Council.tsx index e37761e132..4449862ef4 100644 --- a/packages/page-treasury/src/Overview/Submission.tsx +++ b/packages/page-treasury/src/Overview/Council.tsx @@ -3,7 +3,6 @@ // of the Apache-2.0 license. See the LICENSE file for details. import { SubmittableExtrinsic } from '@polkadot/api/types'; -import { DeriveCollectiveProposal } from '@polkadot/api-derive/types'; import { ProposalIndex } from '@polkadot/types/interfaces'; import React, { useEffect, useRef, useState } from 'react'; @@ -14,7 +13,6 @@ import { useApi, useToggle } from '@polkadot/react-hooks'; import { useTranslation } from '../translate'; interface Props { - councilProposals: DeriveCollectiveProposal[]; id: ProposalIndex; isDisabled: boolean; members: string[]; @@ -25,14 +23,13 @@ interface ProposalState { proposalLength: number; } -function Submission ({ councilProposals, id, isDisabled, members }: Props): React.ReactElement | null { +function Council ({ id, isDisabled, members }: Props): React.ReactElement | null { const { t } = useTranslation(); const { api } = useApi(); const [isOpen, toggleOpen] = useToggle(); const [accountId, setAccountId] = useState(null); const [councilType, setCouncilType] = useState('reject'); const [{ proposal, proposalLength }, setProposal] = useState({ proposalLength: 0 }); - const [hasProposals, setHasProposals] = useState(true); const threshold = Math.ceil((members?.length || 0) * getTreasuryThreshold(api)); @@ -41,15 +38,6 @@ function Submission ({ councilProposals, id, isDisabled, members }: Props): Reac { text: t('Rejection proposal to council'), value: 'reject' } ]); - useEffect((): void => { - setHasProposals( - !!councilProposals - .map(({ votes }) => votes ? votes.index.toNumber() : -1) - .filter((index) => index !== -1) - .length - ); - }, [councilProposals]); - useEffect((): void => { const proposal = councilType === 'reject' ? api.tx.treasury.rejectProposal(id) @@ -58,10 +46,6 @@ function Submission ({ councilProposals, id, isDisabled, members }: Props): Reac setProposal({ proposal, proposalLength: proposal.length }); }, [api, councilType, id]); - if (hasProposals) { - return null; - } - return ( <> {isOpen && ( @@ -127,4 +111,4 @@ function Submission ({ councilProposals, id, isDisabled, members }: Props): Reac ); } -export default React.memo(Submission); +export default React.memo(Council); diff --git a/packages/page-treasury/src/Overview/Proposal.tsx b/packages/page-treasury/src/Overview/Proposal.tsx index e3acaec2e8..162012270a 100644 --- a/packages/page-treasury/src/Overview/Proposal.tsx +++ b/packages/page-treasury/src/Overview/Proposal.tsx @@ -4,13 +4,13 @@ import { DeriveTreasuryProposal } from '@polkadot/api-derive/types'; -import React from 'react'; +import React, { useMemo } from 'react'; import { AddressMini, AddressSmall, LinkExternal } from '@polkadot/react-components'; import { FormatBalance } from '@polkadot/react-query'; import { formatNumber } from '@polkadot/util'; -import Submission from './Submission'; -import Voting from './Voting'; +import { useTranslation } from '../translate'; +import Council from './Council'; interface Props { className?: string; @@ -21,7 +21,17 @@ interface Props { withSend: boolean; } -function ProposalDisplay ({ className = '', isMember, members, proposal: { council, id, proposal }, withSend }: Props): React.ReactElement | null { +function ProposalDisplay ({ className = '', isMember, members, proposal: { council, id, proposal }, withSend }: Props): React.ReactElement { + const { t } = useTranslation(); + + const hasProposals = useMemo( + () => !!council + .map(({ votes }) => votes ? votes.index.toNumber() : -1) + .filter((index) => index !== -1) + .length, + [council] + ); + return ( @@ -39,22 +49,17 @@ function ProposalDisplay ({ className = '', isMember, members, proposal: { counc - - {withSend && ( - <> - + {hasProposals + ? {t('Voting')} + : withSend && ( + - - - )} + ) + } | null { - const { t } = useTranslation(); - const { hasAccounts } = useAccounts(); - const { api } = useApi(); - const bestNumber = useCall(api.derive.chain.bestNumber); - const [councilOpts, setCouncilOpts] = useState([]); - const [councilOptId, setCouncilOptId] = useState(0); - const [accountId, setAccountId] = useState(null); - const [{ councilHash, councilId }, setCouncilInfo] = useState({ councilHash: null, councilId: null }); - const [isOpen, toggleOpen] = useToggle(); - const [voteValue, setVoteValue] = useState(true); - - useEffect((): void => { - isOpen && setVoteValue(true); - }, [isOpen]); - - useEffect((): void => { - const available = councilProposals - .filter(({ votes }) => bestNumber && votes && (!votes.end || votes.end.gt(bestNumber))) - .map(({ proposal: { methodName, sectionName }, votes }): Option => ({ - text: `Council #${votes?.index.toNumber() || '-'}: ${sectionName}.${methodName} `, - value: votes ? votes?.index.toNumber() : -1 - })) - .filter(({ value }) => value !== -1); - - setCouncilOptId(available.length ? available[0].value : 0); - setCouncilOpts(available); - }, [bestNumber, councilProposals]); - - const _onChangeVote = useCallback( - (vote?: boolean) => setVoteValue(isBoolean(vote) ? vote : true), - [] - ); - - const _onChangeProposal = useCallback( - (optionId: number): void => { - const councilProp = councilProposals.find(({ votes }) => votes?.index.eq(optionId)); - - if (councilProp && councilProp.votes) { - setCouncilInfo({ councilHash: councilProp.hash, councilId: councilProp.votes.index }); - setCouncilOptId(councilOptId); - } else { - setCouncilInfo({ councilHash: null, councilId: null }); - } - }, - [councilOptId, councilProposals] - ); - - if (!hasAccounts || !councilOpts.length) { - return null; - } - - return ( - <> - {isOpen && ( - ('Vote on proposal')} - size='small' - > - - - - - - - - - ('The council proposal to make the vote on')} - label={t('council proposal')} - onChange={_onChangeProposal} - options={councilOpts} - value={councilOptId} - /> - ('The hash for the proposal this vote applies to')} - isDisabled - label={t('proposal hash')} - value={councilHash?.toString()} - /> - - -

{t('Multiple council proposals could exist, both approval and rejection. Apply your vote to the correct council proposal (also available on council motions page)')}

- - - - - - - - - - - )} -