From c0103be63eb70acd79cd7d4e0c02cfa21fa1eb36 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Wed, 19 Aug 2020 13:01:34 +0200 Subject: [PATCH] Add Tabs for missing apps (#3445) --- .../page-accounts/src/Accounts/BannerDOT.tsx | 4 ++-- packages/page-claims/src/index.tsx | 20 +++++++++++++++---- packages/page-poll/src/index.tsx | 19 +++++++++++++++--- 3 files changed, 34 insertions(+), 9 deletions(-) diff --git a/packages/page-accounts/src/Accounts/BannerDOT.tsx b/packages/page-accounts/src/Accounts/BannerDOT.tsx index 05d7ce9065..5275d36c0c 100644 --- a/packages/page-accounts/src/Accounts/BannerDOT.tsx +++ b/packages/page-accounts/src/Accounts/BannerDOT.tsx @@ -37,8 +37,8 @@ function BannerDOT (): React.ReactElement | null { ? On approximately {endDate} (block number {formatNumber(POLKADOT_DENOM_BLOCK)} in ), the DOT token will undergo a redenomination from its original sale. - : At block number {formatNumber(POLKADOT_DENOM_BLOCK)} the DOT token underwent a redenomination from its original sale. + />), the DOT token will undergo a redenomination from its original sale. + : At block number {formatNumber(POLKADOT_DENOM_BLOCK)} the DOT token underwent a redenomination from its original sale. }

{ endDate diff --git a/packages/page-claims/src/index.tsx b/packages/page-claims/src/index.tsx index 86ebd083b2..67e44425a5 100644 --- a/packages/page-claims/src/index.tsx +++ b/packages/page-claims/src/index.tsx @@ -2,14 +2,15 @@ // This software may be modified and distributed under the terms // of the Apache-2.0 license. See the LICENSE file for details. +import { AppProps as Props } from '@polkadot/react-components/types'; import { Option } from '@polkadot/types'; import { EcdsaSignature, EthereumAddress, StatementKind } from '@polkadot/types/interfaces'; -import React, { useState, useCallback, useEffect } from 'react'; +import React, { useState, useCallback, useEffect, useRef } from 'react'; import { Trans } from 'react-i18next'; import styled from 'styled-components'; import CopyToClipboard from 'react-copy-to-clipboard'; -import { Button, Card, Columar, Column, Input, InputAddress, Tooltip } from '@polkadot/react-components'; +import { Button, Card, Columar, Column, Input, InputAddress, Tabs, Tooltip } from '@polkadot/react-components'; import { useApi, useCall } from '@polkadot/react-hooks'; import { TokenUnit } from '@polkadot/react-components/InputNumber'; import { u8aToHex, u8aToString } from '@polkadot/util'; @@ -72,7 +73,7 @@ const transformStatement = { transform: (option: Option) => option.unwrapOr(null) }; -function ClaimsApp (): React.ReactElement { +function ClaimsApp ({ basePath }: Props): React.ReactElement { const [didCopy, setDidCopy] = useState(false); const [ethereumAddress, setEthereumAddress] = useState(null); const [signature, setSignature] = useState(null); @@ -88,6 +89,12 @@ function ClaimsApp (): React.ReactElement { const [preclaimEthereumAddress, setPreclaimEthereumAddress] = useState(PRECLAIMS_LOADING); const isPreclaimed = !!preclaimEthereumAddress && preclaimEthereumAddress !== PRECLAIMS_LOADING; + const itemsRef = useRef([{ + isRoot: true, + name: 'create', + text: t('Claim tokens') + }]); + // Everytime we change account, reset everything, and check if the accountId // has a preclaim. useEffect(() => { @@ -180,7 +187,12 @@ function ClaimsApp (): React.ReactElement { return (

-
+
+ +
{!isOldClaimProcess && }

Claim your {TokenUnit.abbr} tokens diff --git a/packages/page-poll/src/index.tsx b/packages/page-poll/src/index.tsx index 6bfc6bd315..7bbc70b18c 100644 --- a/packages/page-poll/src/index.tsx +++ b/packages/page-poll/src/index.tsx @@ -6,10 +6,10 @@ import { Approvals, Balance, BlockNumber } from '@polkadot/types/interfaces'; import { ITuple } from '@polkadot/types/types'; import BN from 'bn.js'; -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { Trans } from 'react-i18next'; import styled from 'styled-components'; -import { Button, Columar, InputAddress, Progress, Spinner, Toggle, TxButton } from '@polkadot/react-components'; +import { Button, Columar, InputAddress, Progress, Spinner, Tabs, Toggle, TxButton } from '@polkadot/react-components'; import { useApi, useCall } from '@polkadot/react-hooks'; import { FormatBalance, BlockToTime } from '@polkadot/react-query'; import { BN_ONE, BN_ZERO, bnMax, formatBalance, formatNumber } from '@polkadot/util'; @@ -17,6 +17,7 @@ import { BN_ONE, BN_ZERO, bnMax, formatBalance, formatNumber } from '@polkadot/u import { useTranslation } from './translate'; interface Props { + basePath: string; className?: string; } @@ -27,7 +28,7 @@ interface Turnout { const DIV = new BN(1_000_000); -function PollApp ({ className }: Props): React.ReactElement { +function PollApp ({ basePath, className }: Props): React.ReactElement { const { t } = useTranslation(); const { api } = useApi(); const totals = useCall>(api.query.poll.totals); @@ -41,6 +42,12 @@ function PollApp ({ className }: Props): React.ReactElement { const [opt10b, setOpt10b] = useState(false); const [progress, setProgress] = useState(); + const itemsRef = useRef([{ + isRoot: true, + name: 'poll', + text: t('Denomination poll') + }]); + useEffect((): void => { if (totalIssuance && totals) { const max = bnMax(BN_ONE, ...totals); @@ -83,6 +90,12 @@ function PollApp ({ className }: Props): React.ReactElement { return (
+
+ +

{t('denomination vote')}