Add list footer with total summaries (free, bonded, payout) (#2600)

2020-04-22 11:18:49 +02:00 · 2020-04-22 11:18:49 +02:00 · 4e6ba0dacd
commit 4e6ba0dacd
parent 1569cce165
13 changed files with 220 additions and 84 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -2,6 +2,7 @@

 - Expand Treasury proposal inline in council (for approve/reject)
 - Expand external proposals in council (preimage lookups)
+- Add table summaries with totals for free, bonded & stash payouts

 # 0.41.1 Apr 20, 2020

--- a/package.json
+++ b/package.json
@ -8,10 +8,10 @@
    "packages/*"
  ],
  "resolutions": {
-    "@polkadot/api": "^1.11.1",
-    "@polkadot/api-contract": "^1.11.1",
+    "@polkadot/api": "^1.12.0-beta.2",
+    "@polkadot/api-contract": "^1.12.0-beta.2",
    "@polkadot/keyring": "^2.8.1",
-    "@polkadot/types": "^1.11.1",
+    "@polkadot/types": "^1.12.0-beta.2",
    "@polkadot/util": "^2.8.1",
    "@polkadot/util-crypto": "^2.8.1",
    "babel-core": "^7.0.0-bridge.0",
--- a/packages/page-accounts/src/Accounts/Account.tsx
+++ b/packages/page-accounts/src/Accounts/Account.tsx
@ -7,6 +7,7 @@ import { ActionStatus } from '@polkadot/react-components/Status/types';
 import { RecoveryConfig } from '@polkadot/types/interfaces';
 import { SortedAccount } from './types';

+import BN from 'bn.js';
 import React, { useCallback, useState, useEffect } from 'react';
 import styled from 'styled-components';
 import { AddressInfo, AddressMini, AddressSmall, Badge, Button, ChainLock, CryptoType, Forget, Icon, IdentityIcon, Input, InputTags, LinkExternal, Menu, Popup, Tag } from '@polkadot/react-components';
@ -27,6 +28,7 @@ import Transfer from './modals/Transfer';
 interface Props extends SortedAccount {
  className?: string;
  filter: string;
+  setBalance: (address: string, value: BN) => void;
  toggleFavorite: (address: string) => void;
 }

@ -42,7 +44,7 @@ function calcVisible (filter: string, name: string, tags: string[]): boolean {
  }, name.toLowerCase().includes(_filter));
 }

-function Account ({ account: { address, meta }, className, filter, isFavorite, toggleFavorite }: Props): React.ReactElement<Props> | null {
+function Account ({ account: { address, meta }, className, filter, isFavorite, setBalance, toggleFavorite }: Props): React.ReactElement<Props> | null {
  const { t } = useTranslation();
  const api = useApi();
  const info = useCall<DeriveAccountInfo>(api.api.derive.accounts.info, [address]);
@ -72,6 +74,10 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, t
    []
  );

+  useEffect((): void => {
+    balancesAll && setBalance(address, balancesAll.freeBalance);
+  }, [address, balancesAll, setBalance]);
+
  useEffect((): void => {
    const { identity, nickname } = info || {};

--- a/packages/page-accounts/src/Accounts/index.tsx
+++ b/packages/page-accounts/src/Accounts/index.tsx
@ -6,11 +6,13 @@ import { KeyringAddress } from '@polkadot/ui-keyring/types';
 import { ComponentProps as Props } from '../types';
 import { SortedAccount } from './types';

-import React, { useEffect, useState } from 'react';
+import BN from 'bn.js';
+import React, { useCallback, useEffect, useState } from 'react';
 import styled from 'styled-components';
 import keyring from '@polkadot/ui-keyring';
 import { getLedger, isLedger } from '@polkadot/react-api';
 import { useAccounts, useFavorites, useToggle } from '@polkadot/react-hooks';
+import { FormatBalance } from '@polkadot/react-query';
 import { Button, Input, Table } from '@polkadot/react-components';

 import { useTranslation } from '../translate';
@ -20,6 +22,11 @@ import QrModal from './modals/Qr';
 import Account from './Account';
 import Banner from './Banner';

+interface Balances {
+  accounts: Record<string, BN>;
+  balanceTotal?: BN;
+}
+
 const STORE_FAVS = 'accounts:favorites';

 // query the ledger for the address, adding it to the keyring
@ -89,6 +96,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
  const [isImportOpen, toggleImport] = useToggle();
  const [isQrOpen, toggleQr] = useToggle();
  const [favorites, toggleFavorite] = useFavorites(STORE_FAVS);
+  const [{ balanceTotal }, setBalances] = useState<Balances>({ accounts: {} });
  const [sortedAccounts, setSortedAccounts] = useState<SortedAccount[]>([]);
  const [filter, setFilter] = useState<string>('');

@ -98,6 +106,19 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
    );
  }, [allAccounts, favorites]);

+  const _setBalance = useCallback(
+    (account: string, balance: BN) =>
+      setBalances(({ accounts }: Balances): Balances => {
+        accounts[account] = balance;
+
+        return {
+          accounts,
+          balanceTotal: Object.values(accounts).reduce((total: BN, value: BN) => total.add(value), new BN(0))
+        };
+      }),
+    []
+  );
+
  return (
    <div className={className}>
      <Banner />
@ -161,6 +182,15 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
            />
          </div>
        }
+        footer={
+          <tr>
+            <td colSpan={7} />
+            <td className='number'>
+              {balanceTotal && <FormatBalance value={balanceTotal} />}
+            </td>
+            <td colSpan={2} />
+          </tr>
+        }
        header={[
          [t('accounts'), 'start', 3],
          [t('parent'), 'address'],
@ -177,6 +207,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
            filter={filter}
            isFavorite={isFavorite}
            key={account.address}
+            setBalance={_setBalance}
            toggleFavorite={toggleFavorite}
          />
        ))}
--- a/packages/page-contracts/package.json
+++ b/packages/page-contracts/package.json
@ -12,6 +12,6 @@
  "license": "Apache-2.0",
  "dependencies": {
    "@babel/runtime": "^7.9.2",
-    "@polkadot/api-contract": "^1.11.1"
+    "@polkadot/api-contract": "^1.12.0-beta.2"
  }
 }
--- a/packages/page-staking/src/Actions/Account/index.tsx
+++ b/packages/page-staking/src/Actions/Account/index.tsx
@ -6,6 +6,7 @@ import { DeriveBalancesAll, DeriveStakingAccount } from '@polkadot/api-derive/ty
 import { AccountId, EraIndex, Exposure, StakingLedger, ValidatorPrefs } from '@polkadot/types/interfaces';
 import { Codec, ITuple } from '@polkadot/types/types';

+import BN from 'bn.js';
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 import { AddressInfo, AddressMini, AddressSmall, Button, Expander, Menu, Popup, StakingBonded, StakingRedeemable, StakingUnbonding, TxButton } from '@polkadot/react-components';
@ -33,6 +34,7 @@ interface Props {
  isOwnStash: boolean;
  next?: string[];
  onUpdateType: (stashId: string, type: 'validator' | 'nominator' | 'started' | 'other') => void;
+  setBonded: (account: string, bonded: BN) => void;
  stashId: string;
  validators?: string[];
 }
@ -90,7 +92,7 @@ function getStakeState (allAccounts: string[], allStashes: string[] | undefined,
  };
 }

-function Account ({ allStashes, className, isDisabled, isOwnStash, next, onUpdateType, stashId, validators }: Props): React.ReactElement<Props> {
+function Account ({ allStashes, className, isDisabled, isOwnStash, next, onUpdateType, setBonded, stashId, validators }: Props): React.ReactElement<Props> {
  const { t } = useTranslation();
  const { api } = useApi();
  const { allAccounts } = useAccounts();
@ -114,6 +116,10 @@ function Account ({ allStashes, className, isDisabled, isOwnStash, next, onUpdat
    if (stakingAccount && validateInfo) {
      const state = getStakeState(allAccounts, allStashes, stakingAccount, stashId, validateInfo);

+      if (state.stakingLedger) {
+        setBonded(stashId, state.stakingLedger.total.unwrap());
+      }
+
      setStakeState(state);
      onUpdateType(
        stashId,
@ -124,7 +130,7 @@ function Account ({ allStashes, className, isDisabled, isOwnStash, next, onUpdat
            : 'other'
      );
    }
-  }, [allAccounts, allStashes, onUpdateType, stakingAccount, stashId, validateInfo]);
+  }, [allAccounts, allStashes, onUpdateType, stakingAccount, setBonded, stashId, validateInfo]);

  useEffect((): void => {
    nominating && setActiveNoms(
--- a/packages/page-staking/src/Actions/index.tsx
+++ b/packages/page-staking/src/Actions/index.tsx
@ -4,10 +4,11 @@

 import { ActiveEraInfo, EraIndex } from '@polkadot/types/interfaces';

+import BN from 'bn.js';
 import React, { useCallback, useEffect, useState } from 'react';
-import { Trans } from 'react-i18next';
 import { Table } from '@polkadot/react-components';
 import { useCall, useApi, useOwnStashes } from '@polkadot/react-hooks';
+import { FormatBalance } from '@polkadot/react-query';
 import { Option } from '@polkadot/types';

 import ElectionBanner from '../ElectionBanner';
@ -23,6 +24,11 @@ interface Props {
  validators?: string[];
 }

+interface Balances {
+  accounts: Record<string, BN>;
+  bondedTotal?: BN;
+}
+
 function Actions ({ allStashes, className, isInElection, next, validators }: Props): React.ReactElement<Props> {
  const { t } = useTranslation();
  const { api } = useApi();
@ -30,17 +36,29 @@ function Actions ({ allStashes, className, isInElection, next, validators }: Pro
    transform: (activeEra: Option<ActiveEraInfo>) => activeEra.unwrapOr({ index: undefined }).index
  });
  const ownStashes = useOwnStashes();
+  const [{ bondedTotal }, setBonded] = useState<Balances>({ accounts: {} });
  const [foundStashes, setFoundStashes] = useState<[string, boolean][] | null>(null);
  const [stashTypes, setStashTypes] = useState<Record<string, number>>({});

  useEffect((): void => {
    ownStashes && setFoundStashes(
-      ownStashes.sort((a, b): number =>
-        (stashTypes[a[0]] || 99) - (stashTypes[b[0]] || 99)
-      )
+      ownStashes.sort((a, b) => (stashTypes[a[0]] || 99) - (stashTypes[b[0]] || 99))
    );
  }, [ownStashes, stashTypes]);

+  const _setBonded = useCallback(
+    (account: string, bonded: BN) =>
+      setBonded(({ accounts }: Balances): Balances => {
+        accounts[account] = bonded;
+
+        return {
+          accounts,
+          bondedTotal: Object.values(accounts).reduce((total: BN, value: BN) => total.add(value), new BN(0))
+        };
+      }),
+    []
+  );
+
  const _onUpdateType = useCallback(
    (stashId: string, type: 'validator' | 'nominator' | 'started' | 'other'): void =>
      setStashTypes((stashTypes: Record<string, number>) => ({
@ -60,6 +78,15 @@ function Actions ({ allStashes, className, isInElection, next, validators }: Pro
      <ElectionBanner isInElection={isInElection} />
      <Table
        empty={t('No funds staked yet. Bond funds to validate or nominate a validator')}
+        footer={
+          <tr>
+            <td colSpan={3} />
+            <td className='number'>
+              {bondedTotal && <FormatBalance value={bondedTotal} />}
+            </td>
+            <td colSpan={2} />
+          </tr>
+        }
        header={[
          [t('stashes'), 'start'],
          [t('controller'), 'address'],
@ -77,14 +104,12 @@ function Actions ({ allStashes, className, isInElection, next, validators }: Pro
            key={stashId}
            next={next}
            onUpdateType={_onUpdateType}
+            setBonded={_setBonded}
            stashId={stashId}
            validators={validators}
          />
        ))}
      </Table>
-      {api.query.staking.activeEra && (
-        <Trans key='paymentMoved'>All applicable account payouts are now available on the <a href='#/staking/payout'>Payouts tab</a></Trans>
-      )}
    </div>
  );
 }
--- a/packages/page-staking/src/Payouts/index.tsx
+++ b/packages/page-staking/src/Payouts/index.tsx
@ -10,6 +10,7 @@ import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 import { Button, Table } from '@polkadot/react-components';
 import { useApi, useOwnEraRewards } from '@polkadot/react-hooks';
+import { FormatBalance } from '@polkadot/react-query';

 import ElectionBanner from '../ElectionBanner';
 import { useTranslation } from '../translate';
@ -25,6 +26,7 @@ interface Props {
 }

 interface Available {
+  stashTotal?: BN | null;
  stashes?: PayoutStash[];
  validators?: PayoutValidator[];
 }
@ -87,16 +89,24 @@ function extractStashes (allRewards: Record<string, DeriveStakerReward[]>): Payo

 function Payouts ({ className, isInElection }: Props): React.ReactElement<Props> {
  const { api } = useApi();
-  const [{ stashes, validators }, setPayouts] = useState<Available>({});
+  const [{ stashTotal, stashes, validators }, setPayouts] = useState<Available>({});
  const stakerPayoutsAfter = useStakerPayouts();
  const { allRewards } = useOwnEraRewards();
  const { t } = useTranslation();

  useEffect((): void => {
-    allRewards && setPayouts({
-      stashes: extractStashes(allRewards),
-      validators: groupByValidator(allRewards)
-    });
+    if (allRewards) {
+      const stashes = extractStashes(allRewards);
+      const stashTotal = stashes.length
+        ? stashes.reduce((total: BN, { available }) => total.add(available), new BN(0))
+        : null;
+
+      setPayouts({
+        stashTotal,
+        stashes,
+        validators: groupByValidator(allRewards)
+      });
+    }
  }, [allRewards]);

  return (
@ -113,6 +123,15 @@ function Payouts ({ className, isInElection }: Props): React.ReactElement<Props>
      <Table
        empty={stashes && t('No pending payouts for your stashes')}
        emptySpinner={t('Retrieving info for all applicable eras, this will take some time')}
+        footer={
+          <tr>
+            <td colSpan={2} />
+            <td className='number'>
+              {stashTotal && <FormatBalance value={stashTotal} />}
+            </td>
+            <td colSpan={4} />
+          </tr>
+        }
        header={[
          [t('payout/stash'), 'start'],
          [t('eras'), 'start'],
@ -137,7 +156,7 @@ function Payouts ({ className, isInElection }: Props): React.ReactElement<Props>
          header={[
            [t('payout/validator'), 'start'],
            [t('eras'), 'start'],
-            [t('total')],
+            [t('available')],
            [('remaining')],
            [undefined, undefined, 3]
          ]}
--- a/packages/react-api/package.json
+++ b/packages/react-api/package.json
@ -31,7 +31,7 @@
  "homepage": "https://github.com/polkadot-js/ui/tree/master/packages/ui-reactive#readme",
  "dependencies": {
    "@babel/runtime": "^7.9.2",
-    "@polkadot/api": "^1.11.1",
+    "@polkadot/api": "^1.12.0-beta.2",
    "@polkadot/extension-dapp": "^0.25.0-beta.1",
    "rxjs-compat": "^6.5.5"
  }
--- a/packages/react-components/src/LinkExternal.tsx
+++ b/packages/react-components/src/LinkExternal.tsx
@ -63,17 +63,19 @@ function genLinks (systemChain: string, { data, hash, type, withShort }: Props):
 function LinkExternal ({ className, data, hash, type, withShort }: Props): React.ReactElement<Props> | null {
  const { t } = useTranslation();
  const { systemChain } = useApi();
-  const links = useMemo((): React.ReactNode[] => {
-    return genLinks(systemChain, { data, hash, type, withShort });
-  }, [systemChain, data, hash, type, withShort]);
+  const links = useMemo(
+    () => genLinks(systemChain, { data, hash, type, withShort }),
+    [systemChain, data, hash, type, withShort]
+  );

  if (!links.length) {
    return null;
  }

  return (
-    <div className={`${className} ${withShort ? 'withShort' : ''}`}>
-      {!withShort && <div>{t('View this externally')}</div>}<div>{links.map((link, index) => <span key={index}>{link}</span>)}</div>
+    <div className={`${className} ${withShort && 'withShort'}`}>
+      {!withShort && <div>{t('View this externally')}</div>}
+      <div>{links.map((link, index) => <span key={index}>{link}</span>)}</div>
    </div>
  );
 }
--- a/packages/react-components/src/Table/Foot.tsx
+++ b/packages/react-components/src/Table/Foot.tsx
@ -0,0 +1,40 @@
+// Copyright 2017-2020 @polkadot/react-components authors & contributors
+// This software may be modified and distributed under the terms
+// of the Apache-2.0 license. See the LICENSE file for details.
+
+import React from 'react';
+import styled from 'styled-components';
+
+interface Props {
+  className?: string;
+  footer?: React.ReactNode;
+  isEmpty: boolean;
+}
+
+function Foot ({ className, footer, isEmpty }: Props): React.ReactElement<Props> | null {
+  if (!footer || isEmpty) {
+    return null;
+  }
+
+  return (
+    <tfoot className={className}>
+      {footer}
+    </tfoot>
+  );
+}
+
+export default React.memo(styled(Foot)`
+  td {
+    color: rgba(78, 78, 78, .66);
+    font-family: sans-serif;
+    font-weight: 100;
+    padding: 0.75rem 1rem 0.25rem;
+    text-align: right;
+    vertical-align: baseline;
+    white-space: nowrap;
+  }
+
+  tr {
+    background: transparent;
+  }
+`);
--- a/packages/react-components/src/Table/index.tsx
+++ b/packages/react-components/src/Table/index.tsx
@ -6,6 +6,7 @@ import React from 'react';
 import styled from 'styled-components';

 import Body from './Body';
+import Foot from './Foot';
 import Head from './Head';

 interface TableProps {
@ -14,6 +15,7 @@ interface TableProps {
  empty?: React.ReactNode;
  emptySpinner?: React.ReactNode;
  filter?: React.ReactNode;
+  footer?: React.ReactNode;
  header: [React.ReactNode?, string?, number?, (() => void)?][];
  isFixed?: boolean;
 }
@ -29,7 +31,7 @@ function extractKids (children: React.ReactNode): [boolean, React.ReactNode] {
  return [isEmpty, isEmpty ? null : kids];
 }

-function Table ({ children, className, empty, emptySpinner, filter, header, isFixed }: TableProps): React.ReactElement<TableProps> {
+function Table ({ children, className, empty, emptySpinner, filter, footer, header, isFixed }: TableProps): React.ReactElement<TableProps> {
  const [isEmpty, kids] = extractKids(children);

  return (
@ -46,6 +48,10 @@ function Table ({ children, className, empty, emptySpinner, filter, header, isFi
        >
          {kids}
        </Body>
+        <Foot
+          footer={footer}
+          isEmpty={isEmpty}
+        />
      </table>
    </div>
  );
--- a/yarn.lock
+++ b/yarn.lock
@ -2837,57 +2837,57 @@ __metadata:
  languageName: node
  linkType: hard

-"@polkadot/api-contract@npm:^1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/api-contract@npm:1.11.1"
+"@polkadot/api-contract@npm:^1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/api-contract@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/api": 1.11.1
-    "@polkadot/rpc-core": 1.11.1
-    "@polkadot/types": 1.11.1
+    "@polkadot/api": 1.12.0-beta.2
+    "@polkadot/rpc-core": 1.12.0-beta.2
+    "@polkadot/types": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    bn.js: ^5.1.1
    rxjs: ^6.5.5
-  checksum: 2/e00b43542c88e60afedb8c992bf1b591fee46fd45b715a8f550cf657319a1f0be310238884d7a49734e64550b7bfbcb183e83ef093a0e5194d077397adb90edf
+  checksum: 2/3b345015bb637d83c9fcd8a97cda35e9b5524dc534f5915568967ef2b35500e0519d1ab1db3f75b11e190f4e02943f3956a9da9a9d53742f7473f44c0b6b9215
  languageName: node
  linkType: hard

-"@polkadot/api-derive@npm:1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/api-derive@npm:1.11.1"
+"@polkadot/api-derive@npm:1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/api-derive@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/api": 1.11.1
-    "@polkadot/rpc-core": 1.11.1
-    "@polkadot/rpc-provider": 1.11.1
-    "@polkadot/types": 1.11.1
+    "@polkadot/api": 1.12.0-beta.2
+    "@polkadot/rpc-core": 1.12.0-beta.2
+    "@polkadot/rpc-provider": 1.12.0-beta.2
+    "@polkadot/types": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    "@polkadot/util-crypto": ^2.8.1
    bn.js: ^5.1.1
    memoizee: ^0.4.14
    rxjs: ^6.5.5
-  checksum: 2/923e15d847624d4dd0adf9277f551a8647634ae6498b6d899cbb301113b1ce40db20f31d47fab917b3e4fcc8bd7bcb86cf19a12769034f328e0edcd40aced7ac
+  checksum: 2/0be51df5cac00f02735e8c9862785e6bb911b7a68c2f28ab1c073de6ffd2ce1a332e939948858dd2b96746a625b9b422164359a123f8943880a3f4b807d73cb6
  languageName: node
  linkType: hard

-"@polkadot/api@npm:^1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/api@npm:1.11.1"
+"@polkadot/api@npm:^1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/api@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/api-derive": 1.11.1
+    "@polkadot/api-derive": 1.12.0-beta.2
    "@polkadot/keyring": ^2.8.1
-    "@polkadot/metadata": 1.11.1
-    "@polkadot/rpc-core": 1.11.1
-    "@polkadot/rpc-provider": 1.11.1
-    "@polkadot/types": 1.11.1
-    "@polkadot/types-known": 1.11.1
+    "@polkadot/metadata": 1.12.0-beta.2
+    "@polkadot/rpc-core": 1.12.0-beta.2
+    "@polkadot/rpc-provider": 1.12.0-beta.2
+    "@polkadot/types": 1.12.0-beta.2
+    "@polkadot/types-known": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    "@polkadot/util-crypto": ^2.8.1
    bn.js: ^5.1.1
    eventemitter3: ^4.0.0
    rxjs: ^6.5.5
-  checksum: 2/47e27c499ec4e9f07ca0c96def217fae046f98b5e778e6bc12e7f9fea76311d4a1a922dd42c151f6a508109c1ff6dfbaf21844c6f190ec4fca44b7f6c1446c4a
+  checksum: 2/159a9da32db847aea6b5b83d4c5a1672356058ea2ea379f648234a2394e3be65b2f3bd60edcfb047bc314ddecc5b9ba1d0ef1e33b6bbbea92ebaf50e5fb6a975
  languageName: node
  linkType: hard

@ -2928,7 +2928,7 @@ __metadata:
  resolution: "@polkadot/app-contracts@workspace:packages/page-contracts"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/api-contract": ^1.11.1
+    "@polkadot/api-contract": ^1.12.0-beta.2
  languageName: unknown
  linkType: soft

@ -3253,17 +3253,17 @@ __metadata:
  languageName: node
  linkType: hard

-"@polkadot/metadata@npm:1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/metadata@npm:1.11.1"
+"@polkadot/metadata@npm:1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/metadata@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/types": 1.11.1
-    "@polkadot/types-known": 1.11.1
+    "@polkadot/types": 1.12.0-beta.2
+    "@polkadot/types-known": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    "@polkadot/util-crypto": ^2.8.1
    bn.js: ^5.1.1
-  checksum: 2/96b617d0a78de159da2760e27fd1181b1025297bb932ae151bea760f24170e01e561f941532f39733c8e7322b935fde2aae1f3e25d664ae2631157618219f241
+  checksum: 2/827ba9e770c83e39475bf8c05ff4ea5e5a3204f4be5ac129084a3097259b846673f99a1ca561050cbf33dfbf99d209c1b3b35af48168728c2e89ef3066d0a502
  languageName: node
  linkType: hard

@ -3272,7 +3272,7 @@ __metadata:
  resolution: "@polkadot/react-api@workspace:packages/react-api"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/api": ^1.11.1
+    "@polkadot/api": ^1.12.0-beta.2
    "@polkadot/extension-dapp": ^0.25.0-beta.1
    rxjs-compat: ^6.5.5
  languageName: unknown
@ -3389,35 +3389,35 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@polkadot/rpc-core@npm:1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/rpc-core@npm:1.11.1"
+"@polkadot/rpc-core@npm:1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/rpc-core@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/metadata": 1.11.1
-    "@polkadot/rpc-provider": 1.11.1
-    "@polkadot/types": 1.11.1
+    "@polkadot/metadata": 1.12.0-beta.2
+    "@polkadot/rpc-provider": 1.12.0-beta.2
+    "@polkadot/types": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    memoizee: ^0.4.14
    rxjs: ^6.5.5
-  checksum: 2/8fd25563c1dc776c12b82632428dbd636f7b8d80b7a854e7b54dd4dc7938ea8b90f4dc7038256ab6f4e13a6e8d50d83bca2444f5d157cbd032bf985e3bf38a37
+  checksum: 2/e6777718ade3d29d9b96a7d4214abf9f8d74e429ef4f52a60ed16fb2df2470081e9172bda7d0c1ed78af872656736aada5e3eea25230d57fddc16dcd65b375cd
  languageName: node
  linkType: hard

-"@polkadot/rpc-provider@npm:1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/rpc-provider@npm:1.11.1"
+"@polkadot/rpc-provider@npm:1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/rpc-provider@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/metadata": 1.11.1
-    "@polkadot/types": 1.11.1
+    "@polkadot/metadata": 1.12.0-beta.2
+    "@polkadot/types": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    "@polkadot/util-crypto": ^2.8.1
    bn.js: ^5.1.1
    eventemitter3: ^4.0.0
    isomorphic-fetch: ^2.2.1
    websocket: ^1.0.31
-  checksum: 2/430e915c23ce3a7e0bb267c9cfdd4aa9822637d8f38ff5b2141354bf0ab6044a01d252f07509c272d2f73d624efc01eacc8307d9378e5fc4260a8300aacc52b9
+  checksum: 2/b37dbba35d4b7d4ec51893177223b869b9e17c4b7e9d3a2c6534c558fb431cacfecd6585de4875b5e9bf00d562652b5f4460a1cb8202aeee6fefae6916cf321e
  languageName: node
  linkType: hard

@ -3430,31 +3430,31 @@ __metadata:
  languageName: node
  linkType: hard

-"@polkadot/types-known@npm:1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/types-known@npm:1.11.1"
+"@polkadot/types-known@npm:1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/types-known@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/types": 1.11.1
+    "@polkadot/types": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    bn.js: ^5.1.1
-  checksum: 2/5f69055f81175f2dee4232efef009565b490f66c1d882b15600e32521790c126e295b0a45cfa811d77dfbcf2b9ef0aba137c82e2d3180bfc02f6f0341f74b9d4
+  checksum: 2/8142bbc9760a026552b57e5faa41765af47c669e59e6de5e617a80b5d1cfc3f0e438514dcb4ffe3e6a574a6d36e102fd2c9be9769f0d631be9db12bf9c884d6b
  languageName: node
  linkType: hard

-"@polkadot/types@npm:^1.11.1":
-  version: 1.11.1
-  resolution: "@polkadot/types@npm:1.11.1"
+"@polkadot/types@npm:^1.12.0-beta.2":
+  version: 1.12.0-beta.2
+  resolution: "@polkadot/types@npm:1.12.0-beta.2"
  dependencies:
    "@babel/runtime": ^7.9.2
-    "@polkadot/metadata": 1.11.1
+    "@polkadot/metadata": 1.12.0-beta.2
    "@polkadot/util": ^2.8.1
    "@polkadot/util-crypto": ^2.8.1
    "@types/bn.js": ^4.11.6
    bn.js: ^5.1.1
    memoizee: ^0.4.14
    rxjs: ^6.5.5
-  checksum: 2/bb6a36707a2d5f07ad7c0961f790272d4e51a2fef4284493fe0a025280b27fcfb9ef0e1e4725f23945d04cd4d2bbc7df0ac965fb8642853e204b3c140c8024b7
+  checksum: 2/23f7396efb161c80ecfb5ec9cab92702280a988be303de9fa74155dd4eea2439360cd56b5e8b11cdb4058775ae702607d104eaa287ba386ea8d6f3d75ed6dd1b
  languageName: node
  linkType: hard