Bump API (incl. staking ledger fixes) (polkadot-js#2156)

* Bump API (incl. staking ledger fixes)

* Api context

* Replace counter

* Linting

* Swap t -> useTranslation

* Cleanup unwrap

* Rebuild i18n (& make auto-config)

* Remove old eslint override

i18next-scanner.config.js

@@ -1,7 +1,38 @@
+// Copyright 2017-2020 @polkadot/apps authors & contributors
+// This software may be modified and distributed under the terms
+// of the Apache-2.0 license. See the LICENSE file for details.
+
 const fs = require('fs');
 const path = require('path');
 const typescript = require('typescript');
 
+const findPackages = require('./scripts/findPackages');
+
+function transform (file, enc, done) {
+  const { ext } = path.parse(file.path);
+
+  if (ext === '.tsx') {
+    const content = fs.readFileSync(file.path, enc);
+
+    const { outputText } = typescript.transpileModule(content, {
+      compilerOptions: {
+        target: 'es2018'
+      },
+      fileName: path.basename(file.path)
+    });
+
+    const parserHandler = (key, options) => {
+      options.defaultValue = key;
+      options.ns = /packages\/(.*?)\/src/g.exec(file.path)[1];
+      this.parser.set(key, options);
+    };
+
+    this.parser.parseFuncFromString(outputText, parserHandler);
+  }
+
+  done();
+}
+
 module.exports = {
   input: [
     'packages/*/src/**/*.{ts,tsx}',
@@ -22,38 +53,7 @@ module.exports = {
     },
     lngs: ['en'],
     defaultLng: 'en',
-    ns: [
-      'app-123code',
-      'app-accounts',
-      'app-address-book',
-      'app-claims',
-      'app-contracts',
-      'app-council',
-      'app-dashboard',
-      'app-democracy',
-      'app-explorer',
-      'app-extrinsics',
-      'app-generic-asset',
-      'app-js',
-      'app-parachains',
-      'app-settings',
-      'app-society',
-      'app-staking',
-      'app-storage',
-      'app-sudo',
-      'app-tech-comm',
-      'app-toolbox',
-      'app-transfer',
-      'app-treasury',
-      'apps',
-      'apps-routing',
-      'react-api',
-      'react-components',
-      'react-params',
-      'react-query',
-      'react-signer',
-      'ui'
-    ],
+    ns: findPackages().map(({ dir }) => dir),
     defaultNs: 'ui',
     resource: {
       loadPath: 'packages/apps/public/locales/{{lng}}/{{ns}}.json',
@@ -64,28 +64,5 @@ module.exports = {
     nsSeparator: false, // namespace separator
     keySeparator: false // key separator
   },
-  transform: function transform (file, enc, done) {
-    const { ext } = path.parse(file.path);
-
-    if (ext === '.tsx') {
-      const content = fs.readFileSync(file.path, enc);
-
-      const { outputText } = typescript.transpileModule(content, {
-        compilerOptions: {
-          target: 'es2018'
-        },
-        fileName: path.basename(file.path)
-      });
-
-      const parserHandler = (key, options) => {
-        options.defaultValue = key;
-        options.ns = /packages\/(.*?)\/src/g.exec(file.path)[1];
-        this.parser.set(key, options);
-      };
-
-      this.parser.parseFuncFromString(outputText, parserHandler);
-    }
-
-    done();
-  }
+  transform
 };

package.json

@@ -10,10 +10,10 @@
     "packages/*"
   ],
   "resolutions": {
-    "@polkadot/api": "^1.0.0-beta.12",
-    "@polkadot/api-contract": "^1.0.0-beta.12",
+    "@polkadot/api": "^1.0.0-beta.13",
+    "@polkadot/api-contract": "^1.0.0-beta.13",
     "@polkadot/keyring": "^2.0.0-beta.4",
-    "@polkadot/types": "^1.0.0-beta.12",
+    "@polkadot/types": "^1.0.0-beta.13",
     "@polkadot/util": "^2.0.0-beta.4",
     "@polkadot/util-crypto": "^2.0.0-beta.4",
     "babel-core": "^7.0.0-bridge.0",

packages/app-contracts/package.json

@@ -11,6 +11,6 @@
   "license": "Apache-2.0",
   "dependencies": {
     "@babel/runtime": "^7.7.7",
-    "@polkadot/api-contract": "^1.0.0-beta.12"
+    "@polkadot/api-contract": "^1.0.0-beta.13"
   }
 }

packages/app-society/src/index.tsx

@@ -7,12 +7,9 @@ import { AppProps, BareProps } from '@polkadot/react-components/types';
 import React from 'react';
 import { Tabs } from '@polkadot/react-components';
 
-import useCheck from './useCheck';
 import Overview from './Overview';
 import { useTranslation } from './translate';
 
-export { useCheck };
-
 interface Props extends AppProps, BareProps {}
 
 export default function SocietyApp ({ basePath, className }: Props): React.ReactElement<Props> {

packages/app-staking/src/Actions/Account/InputValidationController.tsx

@@ -2,17 +2,16 @@
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
 
-import { I18nProps } from '@polkadot/react-components/types';
 import { AccountId, StakingLedger } from '@polkadot/types/interfaces';
 
 import React, { useEffect, useState } from 'react';
 import { Icon } from '@polkadot/react-components';
 import { Option } from '@polkadot/types';
 import { useApi, useCall } from '@polkadot/react-hooks';
 
-import translate from '../../translate';
+import { useTranslation } from '../../translate';
 
-interface Props extends I18nProps {
+interface Props {
   accountId: string | null;
   controllerId: string | null;
   defaultController?: string;
@@ -22,25 +21,20 @@ interface Props extends I18nProps {
 
 const DISTINCT = 'Distinct stash and controller accounts are recommended to ensure fund security.';
 
-function ValidateController ({ accountId, controllerId, defaultController, isUnsafeChain, onError, t }: Props): React.ReactElement<Props> | null {
+export default function ValidateController ({ accountId, controllerId, defaultController, isUnsafeChain, onError }: Props): React.ReactElement<Props> | null {
+  const { t } = useTranslation();
   const { api } = useApi();
   const bondedId = useCall<string | null>(api.query.staking.bonded, [controllerId], {
-    transform: (value: Option<AccountId>): string | null => {
-      const extracted = value.unwrapOr(null);
-
-      return extracted
-        ? extracted.toString()
-        : null;
-    }
+    transform: (value: Option<AccountId>): string | null =>
+      value.isSome
+        ? value.unwrap().toString()
+        : null
   });
-  const stashId = useCall<string | null>(api.query.staking.ledger, [controllerId], {
-    transform: (value: Option<StakingLedger>): string | null => {
-      const extracted = value.unwrapOr({ stash: null }).stash;
-
-      return extracted
-        ? extracted.toString()
-        : null;
-    }
+  const stashId = useCall<string | null>(controllerId ? api.query.staking.ledger : null, [controllerId], {
+    transform: (value: Option<StakingLedger>): string | null =>
+      value.isSome
+        ? value.unwrap().stash.toString()
+        : null
   });
   const [error, setError] = useState<string | null>(null);
 
@@ -77,5 +71,3 @@ function ValidateController ({ accountId, controllerId, defaultController, isUns
     </article>
   );
 }
-
-export default translate(ValidateController);

packages/apps-routing/src/society.ts

@@ -4,12 +4,11 @@
 
 import { Routes } from './types';
 
-import Society, { useCheck } from '@polkadot/app-society';
+import Society from '@polkadot/app-society';
 
 export default ([
   {
     Component: Society,
-    useCheck,
     display: {
       needsApi: [
         'query.society.pot'

packages/apps/public/locales/en/react-hooks.json

@@ -0,0 +1 @@
+{}

packages/apps/src/SideBar/Item.tsx

@@ -15,7 +15,6 @@ import { isFunction } from '@polkadot/util';
 
 import { useTranslation } from '../translate';
 
-const DUMMY_CHECK = (): boolean => true;
 const DUMMY_COUNTER = (): number => 0;
 
 interface Props {
@@ -74,23 +73,22 @@ function checkVisible (name: string, { api, isApiReady, isApiConnected }: ApiPro
   return notFound.length === 0;
 }
 
-export default function Item ({ route: { Modal, useCheck = DUMMY_CHECK, useCounter = DUMMY_COUNTER, display, i18n, icon, name }, isCollapsed, onClick }: Props): React.ReactElement<Props> | null {
+export default function Item ({ route: { Modal, useCounter = DUMMY_COUNTER, display, i18n, icon, name }, isCollapsed, onClick }: Props): React.ReactElement<Props> | null {
   const { t } = useTranslation();
   const { allAccounts, hasAccounts } = useAccounts();
   const apiProps = useApi();
   const sudoKey = useCall<AccountId>(apiProps.isApiReady ? apiProps.api.query.sudo?.key : undefined, []);
   const [hasSudo, setHasSudo] = useState(false);
   const [isVisible, setIsVisible] = useState(false);
-  const checkState = useCheck();
   const count = useCounter();
 
   useEffect((): void => {
     setHasSudo(!!sudoKey && allAccounts.some((address): boolean => sudoKey.eq(address)));
   }, [allAccounts, sudoKey]);
 
   useEffect((): void => {
-    setIsVisible(checkState && checkVisible(name, apiProps, hasAccounts, hasSudo, display));
-  }, [apiProps, checkState, hasAccounts, hasSudo]);
+    setIsVisible(checkVisible(name, apiProps, hasAccounts, hasSudo, display));
+  }, [apiProps, hasAccounts, hasSudo]);
 
   if (!isVisible) {
     return null;

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.7.6",
-    "@polkadot/api": "^1.0.0-beta.12",
+    "@polkadot/api": "^1.0.0-beta.13",
     "@polkadot/extension-dapp": "^0.15.0-beta.1",
     "edgeware-node-types": "^1.0.10",
     "rxjs-compat": "^6.5.3"

packages/react-api/src/Api.tsx

@@ -140,11 +140,13 @@ export default function Api ({ children, queuePayload, queueSetTxStatus, url }:
     setIsApiLoading(false);
   }, []);
 
-  return api
-    ? (
-      <ApiContext.Provider value={{ ...state, api, isApiConnected, isApiLoading, isWaitingInjected }}>
-        {children}
-      </ApiContext.Provider>
-    )
-    : null;
+  if (isApiLoading) {
+    return null;
+  }
+
+  return (
+    <ApiContext.Provider value={{ ...state, api, isApiConnected, isWaitingInjected }}>
+      {children}
+    </ApiContext.Provider>
+  );
 }

packages/react-api/src/types.ts

@@ -30,7 +30,6 @@ export interface ApiProps extends ApiState {
   api: ApiPromise;
   isWaitingInjected: boolean;
   isApiConnected: boolean;
-  isApiLoading: boolean;
 }
 
 export interface OnChangeCbObs {

packages/react-hooks/src/useCall.tsx

@@ -98,7 +98,7 @@ function subscribe <T> (mounted: MountedRef, tracker: TrackerRef, fn: TrackFn |
 //  - returns a promise with an unsubscribe function
 //  - has a callback to set the value
 // FIXME The typings here need some serious TLC
-export default function useCall <T> (fn: TrackFn | undefined, params: CallParams, options: CallOptions<T> = {}): T | undefined {
+export default function useCall <T> (fn: TrackFn | undefined | null, params: CallParams, options: CallOptions<T> = {}): T | undefined {
   const mounted = useIsMountedRef();
   const tracker = useRef<Tracker>({ isActive: false, count: 0, serialized: null, subscriber: null });
   const [value, setValue] = useState<T | undefined>(options.defaultValue);

packages/react-query/src/Bonded.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable @typescript-eslint/camelcase */
 // Copyright 2017-2020 @polkadot/react-query authors & contributors
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
@@ -23,7 +22,7 @@ export default function BondedDisplay ({ children, className, label, params }: P
     transform: (value): AccountId | null =>
       value.unwrapOr(null)
   });
-  const stakingLedger = useCall<StakingLedger | null>(api.query.staking.ledger, [controllerId], {
+  const stakingLedger = useCall<StakingLedger | null>(controllerId && api.query.staking.ledger, [controllerId], {
     transform: (value): StakingLedger | null =>
       value.unwrapOr(null)
   });