Multisig final detection (#2900)

packages/page-staking/src/Payouts/PayButton.tsx

@@ -12,6 +12,8 @@ import { useApi, useToggle } from '@polkadot/react-hooks';
 
 import { useTranslation } from '../translate';
 
+const MAX_BATCH_SIZE = 40;
+
 interface Props {
   isAll?: boolean;
   isDisabled?: boolean;
@@ -29,7 +31,7 @@ function createExtrinsic (api: ApiPromise, payout: PayoutValidator | PayoutValid
         calls.concat(
           ...eras.map(({ era }) => api.tx.staking.payoutStakers(validatorId, era))
         ), []
-      ).filter((_, index) => index < 40)
+      ).filter((_, index) => index < MAX_BATCH_SIZE)
     );
   }
 
@@ -38,7 +40,9 @@ function createExtrinsic (api: ApiPromise, payout: PayoutValidator | PayoutValid
   return eras.length === 1
     ? api.tx.staking.payoutStakers(validatorId, eras[0].era)
     : api.tx.utility.batch(
-      eras.map(({ era }) => api.tx.staking.payoutStakers(validatorId, era))
+      eras
+        .map(({ era }) => api.tx.staking.payoutStakers(validatorId, era))
+        .filter((_, index) => index < MAX_BATCH_SIZE)
     );
 }
 
@@ -105,6 +109,7 @@ function PayButton ({ isAll, isDisabled, payout }: Props): React.ReactElement<Pr
               </Modal.Column>
               <Modal.Column>
                 <p>{t<string>('All the listed validators and all their nominators will receive their rewards.')}</p>
+                <p>{t<string>('The UI puts a limit of 40 payouts at a time, where each payout is a single validator for a single era.')}</p>
               </Modal.Column>
             </Modal.Columns>
           </Modal.Content>

packages/react-api/src/Api.tsx

@@ -37,6 +37,7 @@ interface InjectedAccountExt {
   meta: {
     name: string;
     source: string;
+    whenCreated: number;
   };
 }
 
@@ -73,11 +74,12 @@ async function retrieve (api: ApiPromise): Promise<ChainData> {
     api.rpc.system.version(),
     injectedPromise
       .then(() => web3Accounts())
-      .then((accounts) => accounts.map(({ address, meta }): InjectedAccountExt => ({
+      .then((accounts) => accounts.map(({ address, meta }, whenCreated): InjectedAccountExt => ({
         address,
         meta: {
           ...meta,
-          name: `${meta.name || 'unknown'} (${meta.source === 'polkadot-js' ? 'extension' : meta.source})`
+          name: `${meta.name || 'unknown'} (${meta.source === 'polkadot-js' ? 'extension' : meta.source})`,
+          whenCreated
         }
       })))
       .catch((error): InjectedAccountExt[] => {

packages/react-signer/src/Modal.tsx

@@ -170,14 +170,24 @@ class Signer extends React.PureComponent<Props, State> {
   }
 
   public async componentDidUpdate (): Promise<void> {
-    const { accountNonce, currentItem, isSubmit } = this.state;
+    const { accountNonce, currentItem, isSendable, isSubmit } = this.state;
 
     if (currentItem && currentItem.status === 'queued' && !(currentItem.extrinsic || currentItem.payload)) {
       return this.sendRpc(currentItem);
     }
 
-    if (!isSubmit && currentItem?.accountId && accountNonce == null) {
-      this.updateNonce().catch(console.error);
+    if (currentItem?.accountId) {
+      if (!isSubmit && accountNonce == null) {
+        this.updateNonce().catch(console.error);
+      }
+
+      if (isSendable) {
+        const { isMultisig } = extractExternal(currentItem.accountId);
+
+        if (isMultisig) {
+          this.checkMultisig().catch(console.error);
+        }
+      }
     }
   }
 
@@ -617,6 +627,22 @@ class Signer extends React.PureComponent<Props, State> {
     this.setState({ accountNonce, nonce: accountNonce });
   };
 
+  private checkMultisig = async (): Promise<void> => {
+    const { api } = this.props;
+    const { currentItem } = this.state;
+
+    if (currentItem?.accountId && currentItem?.extrinsic) {
+      const multiModule = api.tx.multisig ? 'multisig' : 'utility';
+      const { threshold } = extractExternal(currentItem.accountId);
+      const optMulti = await api.query[multiModule].multisigs<Option<Multisig>>(currentItem.accountId, currentItem.extrinsic.method.hash);
+      const multi = optMulti.unwrapOr(null);
+
+      if (multi && ((multi.approvals.length + 1) >= threshold)) {
+        this.setState({ multiCall: true });
+      }
+    }
+  }
+
   private signQrPayload = (payload: SignerPayloadJSON): Promise<SignerResult> => {
     return new Promise((resolve, reject): void => {
       // limit size of the transaction