diff --git a/packages/app-democracy/src/Proposal.tsx b/packages/app-democracy/src/Proposal.tsx
index fd809cd214..e34aa33f7a 100644
--- a/packages/app-democracy/src/Proposal.tsx
+++ b/packages/app-democracy/src/Proposal.tsx
@@ -8,7 +8,7 @@ import BN from 'bn.js';
 import React from 'react';
 import { AccountId, Balance, Option, Proposal, Tuple, Vector } from '@polkadot/types';
 import { AddressMini, Labelled, Static } from '@polkadot/ui-app';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { formatBalance } from '@polkadot/util';
 
 import Item from './Item';
@@ -68,5 +68,7 @@ class ProposalDisplay extends React.PureComponent<Props> {
 export default withMulti(
   ProposalDisplay,
   translate,
-  withCall('query.democracy.depositOf', { paramName: 'idNumber' })
+  withCalls<Props>(
+    ['query.democracy.depositOf', { paramName: 'idNumber' }]
+  )
 );
diff --git a/packages/app-democracy/src/Proposals.tsx b/packages/app-democracy/src/Proposals.tsx
index c017518eca..2130685c6c 100644
--- a/packages/app-democracy/src/Proposals.tsx
+++ b/packages/app-democracy/src/Proposals.tsx
@@ -6,7 +6,7 @@ import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 import { Tuple } from '@polkadot/types';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 
 import Proposal from './Proposal';
 import translate from './translate';
@@ -51,5 +51,5 @@ class Proposals extends React.PureComponent<Props> {
 export default withMulti(
   Proposals,
   translate,
-  withCall('query.democracy.publicProps')
+  withCalls<Props>('query.democracy.publicProps')
 );
diff --git a/packages/app-explorer/src/BestHash.tsx b/packages/app-explorer/src/BestHash.tsx
index e1365f57ec..33cb1805f7 100644
--- a/packages/app-explorer/src/BestHash.tsx
+++ b/packages/app-explorer/src/BestHash.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Header } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 type Props = BareProps & CallProps & {
   label?: string,
@@ -32,4 +32,4 @@ class BestHash extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('rpc.chain.subscribeNewHead')(BestHash);
+export default withCalls<Props>('rpc.chain.subscribeNewHead')(BestHash);
diff --git a/packages/app-explorer/src/BlockHeaders.tsx b/packages/app-explorer/src/BlockHeaders.tsx
index 6301119135..4fd90dbdf4 100644
--- a/packages/app-explorer/src/BlockHeaders.tsx
+++ b/packages/app-explorer/src/BlockHeaders.tsx
@@ -6,7 +6,7 @@ import { CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { HeaderExtended } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 import BlockHeader from './BlockHeader';
 
@@ -58,7 +58,7 @@ class BlockHeaders extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('derive.chain.subscribeNewHead', {
+export default withCalls<Props>(['derive.chain.subscribeNewHead', {
   propName: 'headers',
   transform
-})(BlockHeaders);
+}])(BlockHeaders);
diff --git a/packages/app-explorer/src/BlockQuery/index.tsx b/packages/app-explorer/src/BlockQuery/index.tsx
index 94c459828f..c6fa3a3f94 100644
--- a/packages/app-explorer/src/BlockQuery/index.tsx
+++ b/packages/app-explorer/src/BlockQuery/index.tsx
@@ -5,7 +5,7 @@
 import { BareProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { isHex } from '@polkadot/util';
 import { BlockNumber } from '@polkadot/types';
 
@@ -83,5 +83,5 @@ class Entry extends React.Component<Props, State> {
 
 export default withMulti(
   Entry,
-  withCall('derive.chain.bestNumber')
+  withCalls<Props>('derive.chain.bestNumber')
 );
diff --git a/packages/app-explorer/src/EventsRecent.tsx b/packages/app-explorer/src/EventsRecent.tsx
index 025a3f69a3..e1b6b7f279 100644
--- a/packages/app-explorer/src/EventsRecent.tsx
+++ b/packages/app-explorer/src/EventsRecent.tsx
@@ -6,7 +6,7 @@ import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 import { EventRecord } from '@polkadot/types';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { stringToU8a } from '@polkadot/util';
 import { xxhashAsHex } from '@polkadot/util-crypto';
 
@@ -66,5 +66,5 @@ class EventsRecent extends React.PureComponent<Props, State> {
 export default withMulti(
   EventsRecent,
   translate,
-  withCall('query.system.events')
+  withCalls<Props>('query.system.events')
 );
diff --git a/packages/app-extrinsics/src/Balance.tsx b/packages/app-extrinsics/src/Balance.tsx
index 930d2741f7..319efd9351 100644
--- a/packages/app-extrinsics/src/Balance.tsx
+++ b/packages/app-extrinsics/src/Balance.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Balance } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { InputBalance } from '@polkadot/ui-app';
 
 type Props = BareProps & CallProps & {
@@ -30,4 +30,9 @@ class BalanceDisplay extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('query.balances.freeBalance', { paramName: 'params' })(BalanceDisplay);
+export default withMulti(
+  BalanceDisplay,
+  withCalls<Props>(
+    ['query.balances.freeBalance', { paramName: 'params' }]
+  )
+);
diff --git a/packages/app-staking/src/Account/UnnominateButton.tsx b/packages/app-staking/src/Account/UnnominateButton.tsx
index f429a28425..93bdd7badf 100644
--- a/packages/app-staking/src/Account/UnnominateButton.tsx
+++ b/packages/app-staking/src/Account/UnnominateButton.tsx
@@ -6,7 +6,7 @@ import { I18nProps } from '@polkadot/ui-app/types';
 
 import React from 'react';
 import { Button } from '@polkadot/ui-app';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { AccountId, Vector } from '@polkadot/types';
 
 import translate from '../translate';
@@ -50,5 +50,7 @@ class UnnominateButton extends React.Component<Props> {
 export default withMulti(
   UnnominateButton,
   translate,
-  withCall('query.staking.nominatorsFor', { paramName: 'nominating' })
+  withCalls<Props>(
+    ['query.staking.nominatorsFor', { paramName: 'nominating' }]
+  )
 );
diff --git a/packages/app-staking/src/Overview/Summary.tsx b/packages/app-staking/src/Overview/Summary.tsx
index 0d1ce52e88..8ef69dd049 100644
--- a/packages/app-staking/src/Overview/Summary.tsx
+++ b/packages/app-staking/src/Overview/Summary.tsx
@@ -9,7 +9,7 @@ import BN from 'bn.js';
 import React from 'react';
 import SummarySession from '@polkadot/app-explorer/SummarySession';
 import { AddressMini, SummaryBox, CardSummary } from '@polkadot/ui-app';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 
 import translate from '../translate';
 
@@ -67,5 +67,5 @@ class Summary extends React.PureComponent<Props> {
 export default withMulti(
   Summary,
   translate,
-  withCall('query.staking.validatorCount')
+  withCalls<Props>('query.staking.validatorCount')
 );
diff --git a/packages/app-transfer/src/Submit.tsx b/packages/app-transfer/src/Submit.tsx
index 07a40f5351..d6b9bce125 100644
--- a/packages/app-transfer/src/Submit.tsx
+++ b/packages/app-transfer/src/Submit.tsx
@@ -9,7 +9,7 @@ import { QueueTx$Extrinsic, QueueTx$ExtrinsicAdd } from '@polkadot/ui-app/Status
 import React from 'react';
 import { Index } from '@polkadot/types';
 import Button from '@polkadot/ui-app/Button';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 
 import translate from './translate';
 
@@ -55,5 +55,7 @@ class Submit extends React.PureComponent<Props> {
 export default withMulti(
   Submit,
   translate,
-  withCall('query.system.accountNonce', { paramName: 'accountId' })
+  withCalls<Props>(
+    ['query.system.accountNonce', { paramName: 'accountId' }]
+  )
 );
diff --git a/packages/apps/src/Content/Status.tsx b/packages/apps/src/Content/Status.tsx
index a2d1b113d8..fe355639e8 100644
--- a/packages/apps/src/Content/Status.tsx
+++ b/packages/apps/src/Content/Status.tsx
@@ -10,7 +10,7 @@ import React from 'react';
 import keyringOption from '@polkadot/ui-keyring/options';
 import { EventRecord } from '@polkadot/types';
 import { Status as StatusDisplay } from '@polkadot/ui-app';
-import { withCall, withMulti, withObservable } from '@polkadot/ui-api';
+import { withCalls, withMulti, withObservable } from '@polkadot/ui-api';
 import { stringToU8a } from '@polkadot/util';
 import { xxhashAsHex } from '@polkadot/util-crypto';
 
@@ -81,6 +81,6 @@ class Status extends React.PureComponent<Props> {
 export default withMulti(
   Status,
   translate,
-  withCall('query.system.events'),
+  withCalls<Props>('query.system.events'),
   withObservable(keyringOption.optionsSubject, { propName: 'optionsAll' })
 );
diff --git a/packages/ui-reactive/src/AccountIndex.tsx b/packages/ui-reactive/src/AccountIndex.tsx
index 7e6c0e7a11..0f162678ef 100644
--- a/packages/ui-reactive/src/AccountIndex.tsx
+++ b/packages/ui-reactive/src/AccountIndex.tsx
@@ -6,11 +6,12 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { AccountId, AccountIndex } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 type Props = BareProps & CallProps & {
   children?: React.ReactNode,
   label?: string,
+  params?: string,
   accounts_idAndIndex?: [AccountId?, AccountIndex?]
 };
 
@@ -34,4 +35,6 @@ export class AccountIndexDisplay extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('derive.accounts.idAndIndex', { paramName: 'params' })(AccountIndexDisplay);
+export default withCalls<Props>(
+  ['derive.accounts.idAndIndex', { paramName: 'params' }]
+)(AccountIndexDisplay);
diff --git a/packages/ui-reactive/src/Balance.tsx b/packages/ui-reactive/src/Balance.tsx
index fb1aa6ace5..f411f4bbf5 100644
--- a/packages/ui-reactive/src/Balance.tsx
+++ b/packages/ui-reactive/src/Balance.tsx
@@ -5,13 +5,14 @@
 import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
-import { Balance } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { AccountId, AccountIndex, Address, Balance } from '@polkadot/types';
+import { withCalls } from '@polkadot/ui-api';
 import { formatBalance } from '@polkadot/util';
 
 type Props = BareProps & CallProps & {
   children?: React.ReactNode,
   label?: string,
+  params?: AccountId | AccountIndex | Address | string | Uint8Array | null,
   balances_freeBalance?: Balance
 };
 
@@ -34,4 +35,6 @@ export class BalanceDisplay extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('query.balances.freeBalance', { paramName: 'params' })(BalanceDisplay);
+export default withCalls<Props>(
+  ['query.balances.freeBalance', { paramName: 'params' }]
+)(BalanceDisplay);
diff --git a/packages/ui-reactive/src/BestFinalized.tsx b/packages/ui-reactive/src/BestFinalized.tsx
index ed37c1d3c1..260f0f0263 100644
--- a/packages/ui-reactive/src/BestFinalized.tsx
+++ b/packages/ui-reactive/src/BestFinalized.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { BlockNumber } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 import { formatNumber } from '@polkadot/util';
 
 type Props = BareProps & CallProps & {
@@ -34,4 +34,4 @@ export class BestFinalized extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('derive.chain.bestNumberFinalized')(BestFinalized);
+export default withCalls<Props>('derive.chain.bestNumberFinalized')(BestFinalized);
diff --git a/packages/ui-reactive/src/BestNumber.tsx b/packages/ui-reactive/src/BestNumber.tsx
index 691810afb4..379e90f35a 100644
--- a/packages/ui-reactive/src/BestNumber.tsx
+++ b/packages/ui-reactive/src/BestNumber.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { BlockNumber } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 import { formatNumber } from '@polkadot/util';
 
 type Props = BareProps & CallProps & {
@@ -34,4 +34,4 @@ export class BestNumber extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('derive.chain.bestNumber')(BestNumber);
+export default withCalls<Props>('derive.chain.bestNumber')(BestNumber);
diff --git a/packages/ui-reactive/src/Chain.tsx b/packages/ui-reactive/src/Chain.tsx
index e7e8041e48..2d98677b7f 100644
--- a/packages/ui-reactive/src/Chain.tsx
+++ b/packages/ui-reactive/src/Chain.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Text } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 type Props = BareProps & CallProps & {
   children?: React.ReactNode,
@@ -29,4 +29,4 @@ export class Chain extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('rpc.system.chain')(Chain);
+export default withCalls<Props>('rpc.system.chain')(Chain);
diff --git a/packages/ui-reactive/src/NodeName.tsx b/packages/ui-reactive/src/NodeName.tsx
index a93ba4d41c..84cf51e12f 100644
--- a/packages/ui-reactive/src/NodeName.tsx
+++ b/packages/ui-reactive/src/NodeName.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Text } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 type Props = BareProps & CallProps & {
   children?: React.ReactNode,
@@ -29,4 +29,4 @@ export class NodeName extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('rpc.system.name')(NodeName);
+export default withCalls<Props>('rpc.system.name')(NodeName);
diff --git a/packages/ui-reactive/src/NodeVersion.tsx b/packages/ui-reactive/src/NodeVersion.tsx
index 1339e0bdea..437b2a0a20 100644
--- a/packages/ui-reactive/src/NodeVersion.tsx
+++ b/packages/ui-reactive/src/NodeVersion.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Text } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 type Props = BareProps & CallProps & {
   children?: React.ReactNode,
@@ -29,4 +29,4 @@ export class NodeVersion extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('rpc.system.version')(NodeVersion);
+export default withCalls<Props>('rpc.system.version')(NodeVersion);
diff --git a/packages/ui-reactive/src/Nonce.tsx b/packages/ui-reactive/src/Nonce.tsx
index c1e8063099..0d1a069e7c 100644
--- a/packages/ui-reactive/src/Nonce.tsx
+++ b/packages/ui-reactive/src/Nonce.tsx
@@ -4,14 +4,17 @@
 
 import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
+import BN from 'bn.js';
 import React from 'react';
 import { Index } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 import { formatNumber } from '@polkadot/util';
 
 type Props = BareProps & CallProps & {
+  callOnResult?: (accountNonce: BN) => void,
   children?: React.ReactNode,
   label?: string,
+  params?: string,
   system_accountNonce?: Index
 };
 
@@ -34,4 +37,6 @@ export class Nonce extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('query.system.accountNonce', { paramName: 'params' })(Nonce);
+export default withCalls<Props>(
+  ['query.system.accountNonce', { paramName: 'params' }]
+)(Nonce);
diff --git a/packages/ui-reactive/src/TimeNow.tsx b/packages/ui-reactive/src/TimeNow.tsx
index b505a6449a..c7c9994803 100644
--- a/packages/ui-reactive/src/TimeNow.tsx
+++ b/packages/ui-reactive/src/TimeNow.tsx
@@ -6,7 +6,7 @@ import { BareProps, CallProps } from '@polkadot/ui-api/types';
 
 import React from 'react';
 import { Moment } from '@polkadot/types';
-import { withCall } from '@polkadot/ui-api';
+import { withCalls } from '@polkadot/ui-api';
 
 import Elapsed from './Elapsed';
 
@@ -33,4 +33,4 @@ export class TimeNow extends React.PureComponent<Props> {
   }
 }
 
-export default withCall('query.timestamp.now')(TimeNow);
+export default withCalls<Props>('query.timestamp.now')(TimeNow);
diff --git a/packages/ui-signer/src/Checks/Proposal.tsx b/packages/ui-signer/src/Checks/Proposal.tsx
index a271e84022..8b4daa5b97 100644
--- a/packages/ui-signer/src/Checks/Proposal.tsx
+++ b/packages/ui-signer/src/Checks/Proposal.tsx
@@ -9,7 +9,7 @@ import { ExtraFees } from './types';
 import BN from 'bn.js';
 import React from 'react';
 import { Compact } from '@polkadot/types';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { Icon } from '@polkadot/ui-app';
 import { formatBalance } from '@polkadot/util';
 
@@ -85,5 +85,5 @@ export class Proposal extends React.PureComponent<Props, State> {
 export default withMulti(
   Proposal,
   translate,
-  withCall('query.democracy.minimumDeposit')
+  withCalls<Props>('query.democracy.minimumDeposit')
 );
diff --git a/packages/ui-signer/src/Checks/Transfer.tsx b/packages/ui-signer/src/Checks/Transfer.tsx
index dd377c2f90..6c1a563af1 100644
--- a/packages/ui-signer/src/Checks/Transfer.tsx
+++ b/packages/ui-signer/src/Checks/Transfer.tsx
@@ -9,7 +9,7 @@ import { ExtraFees } from './types';
 import BN from 'bn.js';
 import React from 'react';
 import { Compact } from '@polkadot/types';
-import { withCall, withMulti } from '@polkadot/ui-api';
+import { withCalls, withMulti } from '@polkadot/ui-api';
 import { Icon } from '@polkadot/ui-app';
 import { formatBalance } from '@polkadot/util';
 
@@ -92,5 +92,7 @@ export class Transfer extends React.PureComponent<Props, State> {
 export default withMulti(
   Transfer,
   translate,
-  withCall('derive.balances.votingBalance', { paramName: 'recipientId' })
+  withCalls<Props>(
+    ['derive.balances.votingBalance', { paramName: 'recipientId' }]
+  )
 );