diff --git a/packages/page-council/src/Overview/Candidate.tsx b/packages/page-council/src/Overview/Candidate.tsx
index 4f198f56b6..79570d2442 100644
--- a/packages/page-council/src/Overview/Candidate.tsx
+++ b/packages/page-council/src/Overview/Candidate.tsx
@@ -35,12 +35,10 @@ function Candidate ({ address, balance, className = '', isPrime, voters }: Props
/>
)}
-
-
- |
+
);
}
diff --git a/packages/page-council/src/Overview/Candidates.tsx b/packages/page-council/src/Overview/Candidates.tsx
index 9538480cf2..80e5872e5c 100644
--- a/packages/page-council/src/Overview/Candidates.tsx
+++ b/packages/page-council/src/Overview/Candidates.tsx
@@ -22,12 +22,14 @@ function Candidates ({ allVotes = {}, electionsInfo }: Props): React.ReactElemen
const headerCandidates = useMemo(() => [
[t('candidates'), 'start', 2],
+ [],
[]
], [t]);
const headerRunners = useMemo(() => [
[t('runners up'), 'start', 2],
- [t('backing')]
+ [t('backing')],
+ [t('votes')]
], [t]);
return (
diff --git a/packages/page-council/src/Overview/Members.tsx b/packages/page-council/src/Overview/Members.tsx
index ccef9df615..5a7c534ea9 100644
--- a/packages/page-council/src/Overview/Members.tsx
+++ b/packages/page-council/src/Overview/Members.tsx
@@ -23,7 +23,8 @@ function Members ({ allVotes = {}, className = '', electionsInfo, prime }: Props
const header = useMemo(() => [
[t('members'), 'start', 2],
- [t('backing')]
+ [t('backing')],
+ [t('votes')]
], [t]);
return (
diff --git a/packages/page-council/src/Overview/Voters.tsx b/packages/page-council/src/Overview/Voters.tsx
index 60e8fe7c66..0eaa570aa2 100644
--- a/packages/page-council/src/Overview/Voters.tsx
+++ b/packages/page-council/src/Overview/Voters.tsx
@@ -7,34 +7,35 @@ import { AccountId, Balance } from '@polkadot/types/interfaces';
import React from 'react';
import { AddressMini, Expander } from '@polkadot/react-components';
import { FormatBalance } from '@polkadot/react-query';
+import { formatNumber } from '@polkadot/util';
interface Props {
balance?: Balance;
voters?: AccountId[];
}
-function Voters ({ balance, voters }: Props): React.ReactElement | null {
+function Voters ({ balance, voters }: Props): React.ReactElement {
if (!balance || !voters || !voters.length) {
- return null;
+ return <> | | >;
}
return (
-
- }
- >
- {voters.map((who): React.ReactNode =>
-
- )}
-
+ <>
+
+ } >
+ {voters.map((who): React.ReactNode =>
+
+ )}
+
+ |
+
+ {formatNumber(voters.length)}
+ |
+ >
);
}