diff --git a/packages/page-council/src/Overview/Candidate.tsx b/packages/page-council/src/Overview/Candidate.tsx index 3986ccba9e..5c05014f2e 100644 --- a/packages/page-council/src/Overview/Candidate.tsx +++ b/packages/page-council/src/Overview/Candidate.tsx @@ -6,6 +6,7 @@ import type { AccountId, Balance } from '@polkadot/types/interfaces'; import React from 'react'; import { AddressSmall, Tag } from '@polkadot/react-components'; +import { formatNumber } from '@polkadot/util'; import { useTranslation } from '../translate'; import Voters from './Voters'; @@ -14,31 +15,38 @@ interface Props { className?: string; address: AccountId; balance?: Balance; + hasElections: boolean; isPrime?: boolean; voters?: AccountId[]; } -function Candidate ({ address, balance, className = '', isPrime, voters }: Props): React.ReactElement { +function Candidate ({ address, balance, className = '', hasElections, isPrime, voters }: Props): React.ReactElement { const { t } = useTranslation(); return ( - - - - {isPrime && ( - ('Current prime member, default voting')} - label={t('prime voter')} - /> - )} - - - + <> + + + + {isPrime && ( + ('prime')} + /> + )} + + + {voters && formatNumber(voters.length)} + + + {hasElections && ( + + )} + ); } diff --git a/packages/page-council/src/Overview/Candidates.tsx b/packages/page-council/src/Overview/Candidates.tsx index c8dbea70bd..4019ebaf5e 100644 --- a/packages/page-council/src/Overview/Candidates.tsx +++ b/packages/page-council/src/Overview/Candidates.tsx @@ -15,21 +15,18 @@ interface Props { allVotes?: Record; className?: string; electionsInfo?: DeriveElectionsInfo; + hasElections: boolean; } -function Candidates ({ allVotes = {}, electionsInfo }: Props): React.ReactElement { +function Candidates ({ allVotes = {}, electionsInfo, hasElections }: Props): React.ReactElement { const { t } = useTranslation(); const headerCandidatesRef = useRef<([React.ReactNode?, string?, number?] | false)[]>([ - [t('candidates'), 'start'], - [], - [] + [t('candidates'), 'start', 2] ]); const headerRunnersRef = useRef<([React.ReactNode?, string?, number?] | false)[]>([ - [t('runners up'), 'start'], - [t('backing'), 'expand'], - [t('votes')] + [t('runners up'), 'start', 2] ]); return ( @@ -37,11 +34,13 @@ function Candidates ({ allVotes = {}, electionsInfo }: Props): React.ReactElemen ('No runners up found')} header={headerRunnersRef.current} + isSplit > {electionsInfo?.runnersUp.map(([accountId, balance]): React.ReactNode => ( @@ -50,10 +49,12 @@ function Candidates ({ allVotes = {}, electionsInfo }: Props): React.ReactElemen
('No candidates found')} header={headerCandidatesRef.current} + isSplit > {electionsInfo?.candidates.map((accountId): React.ReactNode => ( diff --git a/packages/page-council/src/Overview/Members.tsx b/packages/page-council/src/Overview/Members.tsx index 1a97009a72..1442aab2e8 100644 --- a/packages/page-council/src/Overview/Members.tsx +++ b/packages/page-council/src/Overview/Members.tsx @@ -23,9 +23,7 @@ function Members ({ allVotes = {}, className = '', electionsInfo, hasElections, const { t } = useTranslation(); const headerRef = useRef<([React.ReactNode?, string?, number?] | false)[]>([ - [t('members'), 'start'], - [hasElections ? t('backing') : undefined, 'expand'], - [hasElections ? t('votes') : undefined] + [t('members'), 'start', 2] ]); return ( @@ -33,11 +31,13 @@ function Members ({ allVotes = {}, className = '', electionsInfo, hasElections, className={className} empty={electionsInfo && t('No members found')} header={headerRef.current} + isSplit > {electionsInfo?.members.map(([accountId, balance]): React.ReactNode => ( { ); return ( - <> - {voters - ? ( - <> - - - - ) - : + + ); } diff --git a/packages/page-council/src/Overview/index.tsx b/packages/page-council/src/Overview/index.tsx index 1c556cc01b..ecb9864f34 100644 --- a/packages/page-council/src/Overview/index.tsx +++ b/packages/page-council/src/Overview/index.tsx @@ -69,6 +69,7 @@ function Overview ({ className = '', prime }: Props): React.ReactElement )} diff --git a/packages/page-referenda/src/Referenda/RefKilled.tsx b/packages/page-referenda/src/Referenda/RefKilled.tsx index b6bbef8887..503db6f814 100644 --- a/packages/page-referenda/src/Referenda/RefKilled.tsx +++ b/packages/page-referenda/src/Referenda/RefKilled.tsx @@ -17,16 +17,14 @@ function RefOther ({ value: { info } }: Props): React.ReactElement { return ( <> - diff --git a/packages/react-components/src/Table/index.tsx b/packages/react-components/src/Table/index.tsx index e2910ea24a..bab7a084a3 100644 --- a/packages/react-components/src/Table/index.tsx +++ b/packages/react-components/src/Table/index.tsx @@ -367,6 +367,10 @@ const StyledDiv = styled.div` padding-top: 0.125rem; } + &.no-pad { + padding: 0; + } + &.number { font-variant-numeric: tabular-nums; text-align: right;
- } - /> - - {voters - ? formatNumber(voters.length) - : 123 - } - - } - +
+ + } + /> +
- + - ); } diff --git a/packages/page-referenda/src/Referenda/RefTuple.tsx b/packages/page-referenda/src/Referenda/RefTuple.tsx index 3f38f67895..dfd8520a4e 100644 --- a/packages/page-referenda/src/Referenda/RefTuple.tsx +++ b/packages/page-referenda/src/Referenda/RefTuple.tsx @@ -50,11 +50,12 @@ function Tuple ({ palletReferenda, value: { id, info, track } }: Props): React.R return ( <> ('No members found')} header={headerRef.current} + isSplit > {members?.map((accountId): React.ReactNode => (