diff --git a/packages/page-staking/src/Targets/Validator.tsx b/packages/page-staking/src/Targets/Validator.tsx index 21fccb3d2c..2f75ae3482 100644 --- a/packages/page-staking/src/Targets/Validator.tsx +++ b/packages/page-staking/src/Targets/Validator.tsx @@ -149,7 +149,7 @@ function Validator ({ allSlashes, canSelect, filterName, info, isNominated, isSe {!bondOwn.isZero() && } {!bondOther.isZero() && } {!rewardPayout.isZero() && } - + {(canSelect || isSelected) && ( _sort(header as 'rankComm') ]), + [undefined, 'badge'], [] ], [_sort, labels, sortBy, sorted, sortFromMax, t]); diff --git a/packages/page-treasury/src/Tips/Tip.tsx b/packages/page-treasury/src/Tips/Tip.tsx index 1c017cc2e6..16d385f6fb 100644 --- a/packages/page-treasury/src/Tips/Tip.tsx +++ b/packages/page-treasury/src/Tips/Tip.tsx @@ -5,9 +5,9 @@ import { AccountId, Balance, BlockNumber, OpenTip, OpenTipTo225 } from '@polkadot/types/interfaces'; import BN from 'bn.js'; -import React, { useMemo } from 'react'; +import React, { useEffect, useMemo, useState } from 'react'; import styled from 'styled-components'; -import { AddressSmall, AddressMini, Expander, Icon, LinkExternal, TxButton } from '@polkadot/react-components'; +import { AddressSmall, AddressMini, Checkbox, Expander, Icon, LinkExternal, TxButton } from '@polkadot/react-components'; import { useAccounts } from '@polkadot/react-hooks'; import { BlockToTime, FormatBalance } from '@polkadot/react-query'; import { BN_ZERO, formatNumber } from '@polkadot/util'; @@ -20,9 +20,11 @@ import TipReason from './TipReason'; interface Props { bestNumber?: BlockNumber; className?: string; + defaultId: string | null; hash: string; isMember: boolean; members: string[]; + onSelect: (hash: string, isSelected: boolean, value: BN) => void, tip: OpenTip | OpenTipTo225; } @@ -74,7 +76,7 @@ function extractTipState (tip: OpenTip | OpenTipTo225, hash: string, allAccounts }; } -function Tip ({ bestNumber, className = '', hash, isMember, members, tip }: Props): React.ReactElement | null { +function Tip ({ bestNumber, className = '', defaultId, hash, isMember, members, onSelect, tip }: Props): React.ReactElement | null { const { t } = useTranslation(); const { allAccounts } = useAccounts(); @@ -83,6 +85,16 @@ function Tip ({ bestNumber, className = '', hash, isMember, members, tip }: Prop [allAccounts, hash, tip] ); + const [isMedianSelected, setMedianTip] = useState(false); + + useEffect((): void => { + onSelect(hash, isMedianSelected, median); + }, [hash, isMedianSelected, median, onSelect]); + + useEffect((): void => { + setMedianTip(isMember && !isTipper); + }, [isMember, isTipper]); + const { reason, tips, who } = tip; return ( @@ -135,6 +147,7 @@ function Tip ({ bestNumber, className = '', hash, isMember, members, tip }: Prop {(!closesAt || !bestNumber || closesAt.gt(bestNumber)) ? ( )} + + + { +function TipEndorse ({ defaultId, hash, isMember, isTipped, median, members }: Props): React.ReactElement { const { t } = useTranslation(); const [isOpen, toggleOpen] = useToggle(); - const { allAccounts } = useAccounts(); - const [accountId, setAccountId] = useState(null); - const [defaultId, setDefaultId] = useState(null); + const [accountId, setAccountId] = useState(defaultId); const [value, setValue] = useState(); - useEffect((): void => { - setDefaultId( - members.find((memberId) => allAccounts.includes(memberId)) || null - ); - }, [allAccounts, members]); - return ( <>