diff --git a/packages/page-alliance/src/Overview/Join.tsx b/packages/page-alliance/src/Members/Join.tsx similarity index 100% rename from packages/page-alliance/src/Overview/Join.tsx rename to packages/page-alliance/src/Members/Join.tsx diff --git a/packages/page-alliance/src/Overview/Member.tsx b/packages/page-alliance/src/Members/Member.tsx similarity index 100% rename from packages/page-alliance/src/Overview/Member.tsx rename to packages/page-alliance/src/Members/Member.tsx diff --git a/packages/page-alliance/src/Overview/Summary.tsx b/packages/page-alliance/src/Members/Summary.tsx similarity index 100% rename from packages/page-alliance/src/Overview/Summary.tsx rename to packages/page-alliance/src/Members/Summary.tsx diff --git a/packages/page-alliance/src/Overview/index.tsx b/packages/page-alliance/src/Members/index.tsx similarity index 66% rename from packages/page-alliance/src/Overview/index.tsx rename to packages/page-alliance/src/Members/index.tsx index 8bc9535edf..135a91a0d9 100644 --- a/packages/page-alliance/src/Overview/index.tsx +++ b/packages/page-alliance/src/Members/index.tsx @@ -3,14 +3,14 @@ import type { Member as MemberType, Rule, Unscrupulous } from '../types'; -import React from 'react'; +import React, { useRef } from 'react'; -import { Button } from '@polkadot/react-components'; +import { Button, Table } from '@polkadot/react-components'; import { useToggle } from '@polkadot/react-hooks'; import { useTranslation } from '../translate'; import Join from './Join'; -import Members from './Members'; +import Member from './Member'; import Summary from './Summary'; interface Props { @@ -27,6 +27,13 @@ function Overview ({ className, members, prime, rule, unscrupulous, voters }: Pr const { t } = useTranslation(); const [isJoinOpen, toggleJoin] = useToggle(); + const hdrRef = useRef([ + [t('members'), 'start', 2], + [t('deposit'), 'number'], + [t('role'), 'number'], + [] + ]); + return (
)} - + ('No members')} + header={hdrRef.current} + > + {members && members.map((m) => ( + + ))} +
); } diff --git a/packages/page-alliance/src/Overview/Members.tsx b/packages/page-alliance/src/Overview/Members.tsx deleted file mode 100644 index e63f84a72b..0000000000 --- a/packages/page-alliance/src/Overview/Members.tsx +++ /dev/null @@ -1,49 +0,0 @@ -// Copyright 2017-2022 @polkadot/app-alliance authors & contributors -// SPDX-License-Identifier: Apache-2.0 - -import type { Member as MemberType } from '../types'; - -import React, { useRef } from 'react'; - -import { Table } from '@polkadot/react-components'; - -import { useTranslation } from '../translate'; -import Member from './Member'; - -interface Props { - className?: string; - members?: MemberType[]; - prime?: string | null; - voters?: string[]; -} - -function Members ({ className, members, prime, voters }: Props): React.ReactElement { - const { t } = useTranslation(); - - const hdrRef = useRef([ - [t('members'), 'start', 2], - [t('deposit'), 'number'], - [t('role'), 'number'], - [] - ]); - - return ( -
- ('No members')} - header={hdrRef.current} - > - {members && members.map((m) => ( - - ))} -
-
- ); -} - -export default React.memo(Members); diff --git a/packages/page-alliance/src/index.tsx b/packages/page-alliance/src/index.tsx index 919750639a..a7c21ef22c 100644 --- a/packages/page-alliance/src/index.tsx +++ b/packages/page-alliance/src/index.tsx @@ -11,7 +11,7 @@ import { Tabs } from '@polkadot/react-components'; import { useApi, useCall, useCollectiveMembers } from '@polkadot/react-hooks'; import Announcements from './Announcements'; -import Overview from './Overview'; +import Members from './Members'; import { useTranslation } from './translate'; import Unscrupulous from './Unscrupulous'; import useAnnoucements from './useAnnoucements'; @@ -88,7 +88,7 @@ function AllianceApp ({ basePath, className }: Props): React.ReactElement - { + const { t } = useTranslation(); + + return ( + + ('images')}> + {hashes === undefined + ? + : formatNumber(hashes.length) + } + + + ); +} + +export default React.memo(Summary); diff --git a/packages/page-preimages/src/Preimages/index.tsx b/packages/page-preimages/src/Preimages/index.tsx index d18e493815..f0a91d4cb5 100644 --- a/packages/page-preimages/src/Preimages/index.tsx +++ b/packages/page-preimages/src/Preimages/index.tsx @@ -11,6 +11,7 @@ import { useTranslation } from '../translate'; import usePreimages from '../usePreimages'; import Add from './Add'; import Preimage from './Preimage'; +import Summary from './Summary'; interface Props { className?: string; @@ -31,6 +32,7 @@ function Hashes ({ className }: Props): React.ReactElement { return (
+ diff --git a/packages/page-ranked/src/Members/Summary.tsx b/packages/page-ranked/src/Members/Summary.tsx index dbfeba1b63..0503ee1b71 100644 --- a/packages/page-ranked/src/Members/Summary.tsx +++ b/packages/page-ranked/src/Members/Summary.tsx @@ -20,7 +20,7 @@ function Summary ({ className, members }: Props): React.ReactElement { return ( - ('total')}> + ('members')}> {members === undefined ? : formatNumber(members.length) diff --git a/packages/page-referenda/src/Referenda/Summary.tsx b/packages/page-referenda/src/Referenda/Summary.tsx index dfabb84b9c..d301787aed 100644 --- a/packages/page-referenda/src/Referenda/Summary.tsx +++ b/packages/page-referenda/src/Referenda/Summary.tsx @@ -15,17 +15,25 @@ interface Props { summary: SummaryType; } -function Summary ({ className, summary: { refCount } }: Props): React.ReactElement { +function Summary ({ className, summary: { refActive, refCount } }: Props): React.ReactElement { const { t } = useTranslation(); return ( - ('total')}> - {refCount === undefined - ? - : formatNumber(refCount) - } - +
+ ('active')}> + {refActive === undefined + ? + : formatNumber(refActive) + } + + ('total')}> + {refCount === undefined + ? + : formatNumber(refCount) + } + +
); } diff --git a/packages/page-referenda/src/Referenda/index.tsx b/packages/page-referenda/src/Referenda/index.tsx index b3bb23bd11..dd104a7111 100644 --- a/packages/page-referenda/src/Referenda/index.tsx +++ b/packages/page-referenda/src/Referenda/index.tsx @@ -25,7 +25,7 @@ function Referenda ({ className, members, palletReferenda, palletVote }: Props): const { t } = useTranslation(); const { allAccounts } = useAccounts(); const referenda = useReferenda(palletReferenda); - const summary = useSummary(palletReferenda); + const summary = useSummary(palletReferenda, referenda); const isMember = useMemo( () => !members || allAccounts.some((a) => members.includes(a)), diff --git a/packages/page-referenda/src/types.ts b/packages/page-referenda/src/types.ts index 14b4d1ace5..c74cd582d1 100644 --- a/packages/page-referenda/src/types.ts +++ b/packages/page-referenda/src/types.ts @@ -25,5 +25,6 @@ export interface ReferendumProps { export interface Summary { deciding?: BN; + refActive?: number; refCount?: BN; } diff --git a/packages/page-referenda/src/useSummary.ts b/packages/page-referenda/src/useSummary.ts index d96a75d3cf..bf55abe3d1 100644 --- a/packages/page-referenda/src/useSummary.ts +++ b/packages/page-referenda/src/useSummary.ts @@ -2,20 +2,24 @@ // SPDX-License-Identifier: Apache-2.0 import type { u32 } from '@polkadot/types'; -import type { PalletReferenda, Summary } from './types'; +import type { PalletReferenda, Referendum, Summary } from './types'; import { useMemo } from 'react'; import { createNamedHook, useApi, useCall } from '@polkadot/react-hooks'; // TODO keep track of all tracks to get the number of deciding -function useSummaryImpl (palletReferenda: PalletReferenda): Summary { +function useSummaryImpl (palletReferenda: PalletReferenda, referenda?: Referendum[] | undefined): Summary { const { api } = useApi(); const refCount = useCall(api.query[palletReferenda].referendumCount); + const refActive = useMemo( + () => referenda && referenda.length, + [referenda] + ); return useMemo( - () => ({ refCount }), - [refCount] + () => ({ refActive, refCount }), + [refActive, refCount] ); } diff --git a/packages/page-whitelist/src/Hashes/Summary.tsx b/packages/page-whitelist/src/Hashes/Summary.tsx new file mode 100644 index 0000000000..00ea8c87e0 --- /dev/null +++ b/packages/page-whitelist/src/Hashes/Summary.tsx @@ -0,0 +1,31 @@ +// Copyright 2017-2022 @polkadot/app-whitelist authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import React from 'react'; + +import { CardSummary, Spinner, SummaryBox } from '@polkadot/react-components'; +import { formatNumber } from '@polkadot/util'; + +import { useTranslation } from '../translate'; + +interface Props { + className?: string; + hashes?: string[]; +} + +function Summary ({ className, hashes }: Props): React.ReactElement { + const { t } = useTranslation(); + + return ( + + ('hashes')}> + {hashes === undefined + ? + : formatNumber(hashes.length) + } + + + ); +} + +export default React.memo(Summary); diff --git a/packages/page-whitelist/src/Hashes/index.tsx b/packages/page-whitelist/src/Hashes/index.tsx index 6ea3ab1321..ced930e3d6 100644 --- a/packages/page-whitelist/src/Hashes/index.tsx +++ b/packages/page-whitelist/src/Hashes/index.tsx @@ -10,6 +10,7 @@ import { Table } from '@polkadot/react-components'; import { useTranslation } from '../translate'; import useHashes from '../useHashes'; import Hash from './Hash'; +import Summary from './Summary'; interface Props { className?: string; @@ -27,6 +28,7 @@ function Hashes ({ className }: Props): React.ReactElement { return (
+ ('No call hashes found')}