Ek extract type only imports into separate group (#4168)

* Plug new beta of eslint plugin simple import sort

* Apply new configuration to existing imports

.eslintrc.js

@@ -32,7 +32,9 @@ module.exports = {
       'error',
       { 
         groups: [ 
-            ['^[^\/\\.]'],
+            ['^\u0000'],
+            ['^[^/\\.].*\u0000$', '^@polkadot.*\u0000$', '^\\..*\u0000$'],
+            ['^[^/\\.]'],
             ['^@polkadot'],
             ['^\\.']
         ],

package.json

@@ -54,7 +54,6 @@
     "lint:css": "stylelint './packages/**/src/**/*.tsx'",
     "postinstall": "polkadot-dev-yarn-only",
     "postinstall:electron": "electron-builder install-app-deps",
-    "prepare": "patch-package",
     "test": "polkadot-dev-run-test --selectProjects=fast-tests --silent --testPathIgnorePatterns slow --testNamePattern='^((?!--SLOW--).)*$'",
     "test:all": "polkadot-dev-run-test --selectProjects=all-tests --silent",
     "test:one": "polkadot-dev-run-test",
@@ -85,10 +84,8 @@
     "electron": "^10.1.6",
     "electron-builder": "^22.9.1",
     "electron-builder-notarize": "^1.2.0",
-    "eslint-plugin-simple-import-sort": "^6.0.1",
+    "eslint-plugin-simple-import-sort": "7.0.0-beta.1",
     "i18next-scanner": "^2.11.0",
-    "patch-package": "^6.2.2",
-    "postinstall-prepare": "^1.0.1",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-is": "^17.0.1",

packages/apps-config/src/api/bundle/spec/acala.ts

@@ -1,8 +1,8 @@
 // Copyright 2017-2020 @polkadot/apps-config authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { typesBundleForPolkadot } from '@acala-network/type-definitions';
-
 import type { OverrideBundleDefinition } from '@polkadot/types/types';
 
+import { typesBundleForPolkadot } from '@acala-network/type-definitions';
+
 export default typesBundleForPolkadot.spec.acala as OverrideBundleDefinition;

packages/apps-config/src/api/bundle/spec/laminar.ts

@@ -1,8 +1,8 @@
 // Copyright 2017-2020 @polkadot/apps-config authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { typesBundleForPolkadot } from '@laminar/type-definitions';
-
 import type { OverrideBundleDefinition } from '@polkadot/types/types';
 
+import { typesBundleForPolkadot } from '@laminar/type-definitions';
+
 export default typesBundleForPolkadot.spec.acala as OverrideBundleDefinition;

packages/apps-config/src/links/index.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { ExternalDef } from './types';
+
 import Commonwealth from './commonwealth';
 import Polkascan from './polkascan';
 import Polkassembly from './polkassembly';

packages/apps-config/src/settings/endpoints.ts

@@ -2,8 +2,8 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
-
 import type { LinkOption } from './types';
+
 import { CUSTOM_ENDPOINT_KEY } from './constants';
 
 interface EnvWindow {

packages/apps-config/src/settings/languages.ts

@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
-
 import type { Option } from './types';
 
 export function createLanguages (t: TFunction): Option[] {

packages/apps-config/src/settings/ss58.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Option } from './types';
 
 import known from '@polkadot/networks';
 
-import type { Option } from './types';
-
 // Definitions here are with the following values -
 //   info: the name of a logo as defined in ../logos, specifically in namedLogos
 //   text: The text you wish to display in the dropdown

packages/apps-config/src/ui/logos/index.ts

@@ -8,10 +8,10 @@
 // alphabetical
 import chainDusty from './chains/dusty.png';
 import chainKusama from './chains/kusama-128.gif';
+import chainRococo from './chains/rococo.svg';
 import chainRococoTick from './chains/rococo-tick.svg';
 import chainRococoTrack from './chains/rococo-track.svg';
 import chainRococoTrick from './chains/rococo-trick.svg';
-import chainRococo from './chains/rococo.svg';
 // last-resort fallback, just something empty
 import emptyLogo from './empty.svg';
 // extensions

packages/apps-electron/src/index.tsx

@@ -5,6 +5,7 @@
 import '@polkadot/apps/initSettings';
 import 'semantic-ui-css/semantic.min.css';
 import '@polkadot/react-components/i18n';
+
 import React from 'react';
 import ReactDOM from 'react-dom';
 

packages/apps-electron/src/main/account-store.spec.ts

@@ -1,9 +1,10 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeyringJson } from '@polkadot/ui-keyring/types';
+
 import * as tmp from 'tmp';
 
-import type { KeyringJson } from '@polkadot/ui-keyring/types';
 import { FileStore } from '@polkadot/ui-keyring/stores';
 
 import { accountStoreIpcHandler } from './account-store';

packages/apps-electron/src/main/account-store.ts

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeyringJson } from '@polkadot/ui-keyring/types';
+
 import { app } from 'electron';
 import path from 'path';
 
-import type { KeyringJson } from '@polkadot/ui-keyring/types';
 import { FileStore } from '@polkadot/ui-keyring/stores';
 
 import { IpcMainHandler } from './ipc-main-handler';

packages/apps-electron/src/preload.ts

@@ -1,10 +1,10 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { contextBridge, ipcRenderer } from 'electron';
-
 import type { KeyringJson } from '@polkadot/ui-keyring/types';
 
+import { contextBridge, ipcRenderer } from 'electron';
+
 contextBridge.exposeInMainWorld('ElectronMain', {
   accountStore: {
     all: () => ipcRenderer.invoke('account-store-all'),

packages/apps-routing/src/accounts.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-accounts';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/addresses.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-addresses';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/bounties.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-bounties';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/calendar.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-calendar';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/claims.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-claims';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/contracts.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-contracts';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/council.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-council';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/democracy.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-democracy';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/explorer.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-explorer';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/extrinsics.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-extrinsics';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/generic-asset.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-generic-asset';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/index.ts

@@ -2,8 +2,8 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
-
 import type { Routes } from './types';
+
 import accounts from './accounts';
 import addresses from './addresses';
 import bounties from './bounties';

packages/apps-routing/src/js.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-js';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/parachains.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-parachains';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/poll.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-poll';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/rpc.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-rpc';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/settings.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-settings';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/signing.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-signing';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/society.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-society';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/staking.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-staking';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/storage.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-storage';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/sudo.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component from '@polkadot/app-sudo';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/techcomm.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-tech-comm';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/transfer.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Modal from '@polkadot/app-accounts/modals/Transfer';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component: Modal,

packages/apps-routing/src/treasury.ts

@@ -2,11 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { TFunction } from 'i18next';
+import type { Route } from './types';
 
 import Component, { useCounter } from '@polkadot/app-treasury';
 
-import type { Route } from './types';
-
 export default function create (t: TFunction): Route {
   return {
     Component,

packages/apps-routing/src/types.ts

@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { IconName } from '@fortawesome/fontawesome-svg-core';
-
 import type { AppProps, BareProps } from '@polkadot/react-components/types';
 
 export type RouteGroup = 'accounts' | 'developer' | 'governance' | 'network' | 'settings';

packages/apps/src/Apps.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { BareProps as Props, ThemeDef, ThemeProps } from '@polkadot/react-components/types';
+
 import React, { useContext, useMemo } from 'react';
 import styled, { ThemeContext } from 'styled-components';
 
-import type { BareProps as Props, ThemeDef, ThemeProps } from '@polkadot/react-components/types';
 import AccountSidebar from '@polkadot/app-accounts/Sidebar';
 import { getSystemChainColor } from '@polkadot/apps-config';
 import GlobalStyle from '@polkadot/react-components/styles';

packages/apps/src/Content/NotFound.tsx

@@ -1,11 +1,11 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { RouteProps } from '@polkadot/apps-routing/types';
+
 import React from 'react';
 import { Redirect } from 'react-router';
 
-import type { RouteProps } from '@polkadot/apps-routing/types';
-
 interface Props extends RouteProps {
   missingApis?: (string | string[])[];
 }

packages/apps/src/Content/Status.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useContext, useEffect } from 'react';
-
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { EventRecord } from '@polkadot/types/interfaces';
 import type { KeyringOptions } from '@polkadot/ui-keyring/options/types';
+
+import React, { useContext, useEffect } from 'react';
+
 import { Status as StatusDisplay, StatusContext } from '@polkadot/react-components';
 import { useAccounts, useApi, useCall } from '@polkadot/react-hooks';
 import { stringToU8a } from '@polkadot/util';

packages/apps/src/Content/index.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { Route } from '@polkadot/apps-routing/types';
+
 import React, { Suspense, useContext, useMemo } from 'react';
 import { useLocation } from 'react-router-dom';
 import styled from 'styled-components';
 
-import type { Route } from '@polkadot/apps-routing/types';
 import createRoutes from '@polkadot/apps-routing';
 import { ErrorBoundary, Spinner, StatusContext } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';

packages/apps/src/Endpoints/Group.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
+import type { Group } from './types';
+
 import React, { useCallback } from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { Icon } from '@polkadot/react-components';
 
-import type { Group } from './types';
 import Network from './Network';
 
 interface Props {

packages/apps/src/Endpoints/Network.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
+import type { Network } from './types';
+
 import React, { useCallback, useMemo } from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { ChainImg } from '@polkadot/react-components';
 
-import type { Network } from './types';
 import Url from './Url';
 
 interface Props {

packages/apps/src/Endpoints/index.tsx

@@ -1,6 +1,10 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { LinkOption } from '@polkadot/apps-config/settings/types';
+import type { ThemeProps } from '@polkadot/react-components/types';
+import type { Group } from './types';
+
 // ok, this seems to be an eslint bug, this _is_ a package import
 /* eslint-disable-next-line node/no-deprecated-api */
 import punycode from 'punycode';
@@ -8,14 +12,11 @@ import React, { useCallback, useMemo, useState } from 'react';
 import store from 'store';
 import styled from 'styled-components';
 
-import type { LinkOption } from '@polkadot/apps-config/settings/types';
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { createWsEndpoints, CUSTOM_ENDPOINT_KEY } from '@polkadot/apps-config';
 import { Button, Input, Sidebar } from '@polkadot/react-components';
 import uiSettings from '@polkadot/ui-settings';
 import { isAscii } from '@polkadot/util';
 
-import type { Group } from './types';
 import { useTranslation } from '../translate';
 import GroupDisplay from './Group';
 

packages/apps/src/Menu/ChainInfo.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { RuntimeVersion } from '@polkadot/types/interfaces';
+
 import React from 'react';
 import styled from 'styled-components';
 
-import type { RuntimeVersion } from '@polkadot/types/interfaces';
 import { ChainImg, Icon } from '@polkadot/react-components';
 import { useApi, useCall, useIpfs, useToggle } from '@polkadot/react-hooks';
 import { BestNumber, Chain } from '@polkadot/react-query';

packages/apps/src/Menu/Grouping.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
+import type { Group } from './types';
+
 import React from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { Icon } from '@polkadot/react-components';
 
-import type { Group } from './types';
 import Item from './Item';
 
 interface Props extends Group {

packages/apps/src/Menu/Item.tsx

@@ -1,14 +1,14 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ItemRoute } from './types';
+
 import React from 'react';
 import styled from 'styled-components';
 
 import { Badge, Icon } from '@polkadot/react-components';
 import { useToggle } from '@polkadot/react-hooks';
 
-import type { ItemRoute } from './types';
-
 interface Props {
   className?: string;
   isToplevel?: boolean;

packages/apps/src/Menu/NodeInfo.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { BareProps as Props } from '@polkadot/react-components/types';
+
 import React from 'react';
 import styled from 'styled-components';
 
-import type { BareProps as Props } from '@polkadot/react-components/types';
 import { useApi } from '@polkadot/react-hooks';
 import { NodeName, NodeVersion } from '@polkadot/react-query';
 

packages/apps/src/Menu/index.tsx

@@ -1,20 +1,21 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import type { TFunction } from 'i18next';
-import React, { useMemo, useRef } from 'react';
-import { useLocation } from 'react-router-dom';
-import styled from 'styled-components';
-
 import type { Route, Routes } from '@polkadot/apps-routing/types';
 import type { ApiProps } from '@polkadot/react-api/types';
 import type { ThemeProps } from '@polkadot/react-components/types';
 import type { AccountId } from '@polkadot/types/interfaces';
+import type { TFunction } from 'i18next';
+import type { Group, Groups, ItemRoute } from './types';
+
+import React, { useMemo, useRef } from 'react';
+import { useLocation } from 'react-router-dom';
+import styled from 'styled-components';
+
 import createRoutes from '@polkadot/apps-routing';
 import { Icon } from '@polkadot/react-components';
 import { useAccounts, useApi, useCall } from '@polkadot/react-hooks';
 
-import type { Group, Groups, ItemRoute } from './types';
 import { findMissingApis } from '../endpoint';
 import { useTranslation } from '../translate';
 import ChainInfo from './ChainInfo';

packages/apps/src/Menu/types.tsx

@@ -2,10 +2,10 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { IconName } from '@fortawesome/fontawesome-svg-core';
-import React from 'react';
-
 import type { Routes } from '@polkadot/apps-routing/types';
 
+import React from 'react';
+
 export interface ItemRoute {
   Modal?: React.ComponentType<any>;
   href?: string;

packages/apps/src/Root.tsx

@@ -1,12 +1,13 @@
 // Copyright 2017-2020 @polkadot/apps authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeDef } from '@polkadot/react-components/types';
+import type { KeyringStore } from '@polkadot/ui-keyring/types';
+
 import React, { Suspense, useEffect, useState } from 'react';
 import { HashRouter } from 'react-router-dom';
 import { ThemeProvider } from 'styled-components';
 
-import type { ThemeDef } from '@polkadot/react-components/types';
-import type { KeyringStore } from '@polkadot/ui-keyring/types';
 import { Api } from '@polkadot/react-api';
 import Queue from '@polkadot/react-components/Status/Queue';
 import { BlockAuthors, Events } from '@polkadot/react-query';

packages/apps/src/index.tsx

@@ -5,6 +5,7 @@
 import './initSettings';
 import 'semantic-ui-css/semantic.min.css';
 import '@polkadot/react-components/i18n';
+
 import React from 'react';
 import ReactDOM from 'react-dom';
 

packages/apps/src/overlays/Base.tsx

@@ -2,10 +2,11 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { IconName } from '@fortawesome/fontawesome-svg-core';
+import type { ThemeProps } from '@polkadot/react-components/types';
+
 import React from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { Button, Icon } from '@polkadot/react-components';
 import { useToggle } from '@polkadot/react-hooks';
 

packages/apps/src/translate.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { UseTranslationResponse } from 'react-i18next';
+
 import { useTranslation as useTranslationBase } from 'react-i18next';
 
 export function useTranslation (): UseTranslationResponse {

packages/page-accounts/src/Accounts/Account.tsx

@@ -1,17 +1,19 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import BN from 'bn.js';
-import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
-import styled, { ThemeContext } from 'styled-components';
-
-import type { DeriveBalancesAll, DeriveDemocracyLock } from '@polkadot/api-derive/types';
 import type { SubmittableExtrinsic } from '@polkadot/api/types';
+import type { DeriveBalancesAll, DeriveDemocracyLock } from '@polkadot/api-derive/types';
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { ThemeDef } from '@polkadot/react-components/types';
 import type { Option } from '@polkadot/types';
 import type { ProxyDefinition, RecoveryConfig } from '@polkadot/types/interfaces';
 import type { KeyringAddress } from '@polkadot/ui-keyring/types';
+import type { Delegation } from '../types';
+
+import BN from 'bn.js';
+import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import styled, { ThemeContext } from 'styled-components';
+
 import { ApiPromise } from '@polkadot/api';
 import { getLedger } from '@polkadot/react-api';
 import { AddressInfo, AddressMini, AddressSmall, Badge, Button, ChainLock, CryptoType, Forget, Icon, IdentityIcon, LinkExternal, Menu, Popup, StatusContext, Tags } from '@polkadot/react-components';
@@ -19,7 +21,6 @@ import { useAccountInfo, useApi, useCall, useToggle } from '@polkadot/react-hook
 import keyring from '@polkadot/ui-keyring';
 import { BN_ZERO, formatBalance, formatNumber } from '@polkadot/util';
 
-import type { Delegation } from '../types';
 import Backup from '../modals/Backup';
 import ChangePass from '../modals/ChangePass';
 import DelegateModal from '../modals/Delegate';

packages/page-accounts/src/Accounts/index.tsx

@@ -1,19 +1,20 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { AccountId, ProxyDefinition, ProxyType, Voting } from '@polkadot/types/interfaces';
+import type { Delegation, SortedAccount } from '../types';
+
 import BN from 'bn.js';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 
-import type { ActionStatus } from '@polkadot/react-components/Status/types';
-import type { AccountId, ProxyDefinition, ProxyType, Voting } from '@polkadot/types/interfaces';
 import { isLedger } from '@polkadot/react-api';
 import { Button, Input, Table } from '@polkadot/react-components';
 import { useAccounts, useApi, useCall, useFavorites, useIpfs, useLoadingDelay, useToggle } from '@polkadot/react-hooks';
 import { FormatBalance } from '@polkadot/react-query';
 import { BN_ZERO } from '@polkadot/util';
 
-import type { Delegation, SortedAccount } from '../types';
 import CreateModal from '../modals/Create';
 import ImportModal from '../modals/Import';
 import Ledger from '../modals/Ledger';

packages/page-accounts/src/Accounts/types.ts

@@ -1,11 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { WithTranslation } from 'react-i18next';
-
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { KeyringAddress } from '@polkadot/ui-keyring/types';
 
+import { WithTranslation } from 'react-i18next';
+
 export { AppProps as ComponentProps } from '@polkadot/react-components/types';
 
 export interface BareProps {

packages/page-accounts/src/Accounts/useMultisigApprovals.ts

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { useContext, useEffect, useState } from 'react';
-
 import type { Option, StorageKey } from '@polkadot/types';
 import type { H256, Multisig } from '@polkadot/types/interfaces';
+
+import { useContext, useEffect, useState } from 'react';
+
 import { useApi, useIncrement, useIsMountedRef } from '@polkadot/react-hooks';
 import { EventsContext } from '@polkadot/react-query';
 

packages/page-accounts/src/Accounts/useProxies.ts

@@ -1,12 +1,13 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import BN from 'bn.js';
-import { useEffect, useState } from 'react';
-
 import type { Vec } from '@polkadot/types';
 import type { AccountId, BalanceOf, ProxyDefinition, ProxyType } from '@polkadot/types/interfaces';
 import type { ITuple } from '@polkadot/types/types';
+
+import BN from 'bn.js';
+import { useEffect, useState } from 'react';
+
 import { useAccounts, useApi, useIsMountedRef } from '@polkadot/react-hooks';
 import { BN_ZERO } from '@polkadot/util';
 

packages/page-accounts/src/CreateAccount.slow.spec.tsx

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import '@polkadot/react-components/i18n';
+
 import { fireEvent, render, waitForElementToBeRemoved } from '@testing-library/react';
 import React, { PropsWithChildren } from 'react';
 import { MemoryRouter } from 'react-router-dom';

packages/page-accounts/src/Sidebar/Flags.tsx

@@ -1,9 +1,10 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { AddressFlags } from '@polkadot/react-hooks/types';
+
 import React from 'react';
 
-import type { AddressFlags } from '@polkadot/react-hooks/types';
 import { Tag } from '@polkadot/react-components';
 
 import { useTranslation } from '../translate';

packages/page-accounts/src/Sidebar/Identity.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React from 'react';
-
 import type { AddressIdentity } from '@polkadot/react-hooks/types';
 import type { AccountId, BalanceOf } from '@polkadot/types/interfaces';
+
+import React from 'react';
+
 import { AddressMini, AvatarItem, Expander, Icon, IconLink, Tag } from '@polkadot/react-components';
 import { useApi, useCall, useRegistrars, useToggle } from '@polkadot/react-hooks';
 import { isHex } from '@polkadot/util';

packages/page-accounts/src/Sidebar/Multisig.tsx

@@ -1,9 +1,10 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeyringJson$Meta } from '@polkadot/ui-keyring/types';
+
 import React from 'react';
 
-import type { KeyringJson$Meta } from '@polkadot/ui-keyring/types';
 import { AddressMini, Icon, Static } from '@polkadot/react-components';
 
 import { useTranslation } from '../translate';

packages/page-accounts/src/Sidebar/Sidebar.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
+
 import React, { useCallback } from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { AccountName, Button, Icon, IdentityIcon, Input, LinkExternal, Sidebar, Tags } from '@polkadot/react-components';
 import { colorLink } from '@polkadot/react-components/styles/theme';
 import { useAccountInfo, useToggle } from '@polkadot/react-hooks';

packages/page-accounts/src/Sidebar/index.tsx

@@ -1,10 +1,10 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useState } from 'react';
-
 import type { StringOrNull, VoidFn } from '@polkadot/react-components/types';
 
+import React, { useCallback, useState } from 'react';
+
 import Sidebar from './Sidebar';
 
 type ToggleContext = undefined | (([address, onUpdateName]: [StringOrNull, VoidFn | null]) => void);

packages/page-accounts/src/Vanity/Match.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
+
 import React, { useCallback, useMemo } from 'react';
 import styled from 'styled-components';
 
-import type { ThemeProps } from '@polkadot/react-components/types';
 import { Button, IdentityIcon } from '@polkadot/react-components';
 import { u8aToHex } from '@polkadot/util';
 

packages/page-accounts/src/Vanity/index.tsx

@@ -1,12 +1,13 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import styled from 'styled-components';
-
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { KeypairType } from '@polkadot/util-crypto/types';
 import type { GeneratorMatch, GeneratorMatches, GeneratorResult } from '@polkadot/vanitygen/types';
+
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import styled from 'styled-components';
+
 import { Button, Dropdown, Input, Table } from '@polkadot/react-components';
 import { useApi, useIsMountedRef } from '@polkadot/react-hooks';
 import uiSettings from '@polkadot/ui-settings';

packages/page-accounts/src/index.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { AppProps as Props } from '@polkadot/react-components/types';
+
 import React, { useRef } from 'react';
 import { Route, Switch } from 'react-router';
 
-import type { AppProps as Props } from '@polkadot/react-components/types';
 import { HelpOverlay, Tabs } from '@polkadot/react-components';
 import { useAccounts, useIpfs } from '@polkadot/react-hooks';
 

packages/page-accounts/src/modals/Create.tsx

@@ -1,13 +1,15 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { CreateResult } from '@polkadot/ui-keyring/types';
+import type { KeypairType } from '@polkadot/util-crypto/types';
+import type { ModalProps } from '../types';
+
 import FileSaver from 'file-saver';
 import React, { useCallback, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
-import type { ActionStatus } from '@polkadot/react-components/Status/types';
-import type { CreateResult } from '@polkadot/ui-keyring/types';
-import type { KeypairType } from '@polkadot/util-crypto/types';
 import { DEV_PHRASE } from '@polkadot/keyring/defaults';
 import { getEnvironment } from '@polkadot/react-api/util';
 import { AddressRow, Button, Checkbox, CopyButton, Dropdown, Expander, Input, InputAddress, Modal, TextArea } from '@polkadot/react-components';
@@ -17,7 +19,6 @@ import uiSettings from '@polkadot/ui-settings';
 import { isHex, u8aToHex } from '@polkadot/util';
 import { keyExtractSuri, mnemonicGenerate, mnemonicValidate, randomAsU8a } from '@polkadot/util-crypto';
 
-import type { ModalProps } from '../types';
 import { useTranslation } from '../translate';
 import CreateConfirmation from './CreateConfirmation';
 import ExternalWarning from './ExternalWarning';

packages/page-accounts/src/modals/CreateConfirmation.tsx

@@ -1,9 +1,10 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeypairType } from '@polkadot/util-crypto/types';
+
 import React from 'react';
 
-import type { KeypairType } from '@polkadot/util-crypto/types';
 import { AddressRow, Modal, Static } from '@polkadot/react-components';
 import { isHex } from '@polkadot/util';
 

packages/page-accounts/src/modals/Delegate.tsx

@@ -1,15 +1,16 @@
 // Copyright 2017-2020 @polkadot/app-staking authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { Conviction } from '@polkadot/types/interfaces';
+import type { AmountValidateState } from '../Accounts/types';
+
 import BN from 'bn.js';
 import React, { useState } from 'react';
 
-import type { Conviction } from '@polkadot/types/interfaces';
 import { ConvictionDropdown, InputAddress, InputBalance, Modal, TxButton } from '@polkadot/react-components';
 import { BalanceFree } from '@polkadot/react-query';
 import { BN_ZERO } from '@polkadot/util';
 
-import type { AmountValidateState } from '../Accounts/types';
 import { useTranslation } from '../translate';
 import ValidateAmount from './InputValidateAmount';
 

packages/page-accounts/src/modals/Derive.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useContext, useEffect, useState } from 'react';
-
 import type { KeyringPair } from '@polkadot/keyring/types';
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { KeypairType } from '@polkadot/util-crypto/types';
+
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+
 import { AddressRow, Button, Input, InputAddress, Modal, Password, StatusContext } from '@polkadot/react-components';
 import { useApi, useDebounce, useToggle } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';

packages/page-accounts/src/modals/IdentityMain.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { Data, Option } from '@polkadot/types';
+import type { Registration } from '@polkadot/types/interfaces';
+
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 
-import type { Data, Option } from '@polkadot/types';
-import type { Registration } from '@polkadot/types/interfaces';
 import { Input, InputBalance, Modal, Toggle, TxButton } from '@polkadot/react-components';
 import { getAddressMeta } from '@polkadot/react-components/util';
 import { useApi, useCall } from '@polkadot/react-hooks';

packages/page-accounts/src/modals/IdentitySub.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useEffect, useState } from 'react';
-
 import type { Data, Option, Vec } from '@polkadot/types';
 import type { AccountId, Balance } from '@polkadot/types/interfaces';
 import type { ITuple } from '@polkadot/types/types';
+
+import React, { useCallback, useEffect, useState } from 'react';
+
 import { Button, Columar, Input, InputAddress, Modal, Spinner, TxButton } from '@polkadot/react-components';
 import { useAccounts, useApi, useCall } from '@polkadot/react-hooks';
 import { u8aToString } from '@polkadot/util';

packages/page-accounts/src/modals/Import.tsx

@@ -1,16 +1,17 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useMemo, useState } from 'react';
-
 import type { KeyringPair, KeyringPair$Json } from '@polkadot/keyring/types';
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { ModalProps } from '../types';
+
+import React, { useCallback, useMemo, useState } from 'react';
+
 import { AddressRow, Button, InputAddress, InputFile, Modal, Password } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 import { u8aToString } from '@polkadot/util';
 
-import type { ModalProps } from '../types';
 import { useTranslation } from '../translate';
 import ExternalWarning from './ExternalWarning';
 

packages/page-accounts/src/modals/InputValidateAmount.tsx

@@ -1,14 +1,15 @@
 // Copyright 2017-2020 @polkadot/app-staking authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { DeriveBalancesAll } from '@polkadot/api-derive/types';
+import type { AmountValidateState } from '../Accounts/types';
+
 import BN from 'bn.js';
 import React, { useEffect, useState } from 'react';
 
-import type { DeriveBalancesAll } from '@polkadot/api-derive/types';
 import { useApi, useCall } from '@polkadot/react-hooks';
 import { BN_ZERO } from '@polkadot/util';
 
-import type { AmountValidateState } from '../Accounts/types';
 import { useTranslation } from '../translate';
 
 interface Props {

packages/page-accounts/src/modals/MultisigApprove.tsx

@@ -1,11 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { SubmittableExtrinsic } from '@polkadot/api/types';
+import type { AccountId, Call, H256, Multisig } from '@polkadot/types/interfaces';
+
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
-import type { SubmittableExtrinsic } from '@polkadot/api/types';
-import type { AccountId, Call, H256, Multisig } from '@polkadot/types/interfaces';
 import { registry } from '@polkadot/react-api';
 import { Dropdown, Input, InputAddress, Modal, Toggle, TxButton } from '@polkadot/react-components';
 import { useAccounts, useApi, useWeight } from '@polkadot/react-hooks';

packages/page-accounts/src/modals/MultisigCreate.tsx

@@ -1,15 +1,16 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { ModalProps } from '../types';
+
 import BN from 'bn.js';
 import React, { useCallback, useState } from 'react';
 
-import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import { Button, Input, InputAddressMulti, InputNumber, Modal } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 
-import type { ModalProps } from '../types';
 import useKnownAddresses from '../Accounts/useKnownAddresses';
 import { useTranslation } from '../translate';
 

packages/page-accounts/src/modals/ProxiedAdd.tsx

@@ -1,14 +1,15 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { ModalProps } from '../types';
+
 import React, { useCallback, useState } from 'react';
 
-import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import { Button, Input, InputAddressSimple, Modal } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 
-import type { ModalProps } from '../types';
 import useProxies from '../Accounts/useProxies';
 import { useTranslation } from '../translate';
 

packages/page-accounts/src/modals/ProxyOverview.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-staking authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ApiPromise } from '@polkadot/api';
+import type { SubmittableExtrinsic } from '@polkadot/api/types';
+import type { AccountId, ProxyDefinition, ProxyType } from '@polkadot/types/interfaces';
+
 import BN from 'bn.js';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
-import type { ApiPromise } from '@polkadot/api';
-import type { SubmittableExtrinsic } from '@polkadot/api/types';
-import type { AccountId, ProxyDefinition, ProxyType } from '@polkadot/types/interfaces';
 import { registry } from '@polkadot/react-api';
 import { Button, Dropdown, InputAddress, Modal, TxButton } from '@polkadot/react-components';
 import { useApi } from '@polkadot/react-hooks';

packages/page-accounts/src/modals/Qr.tsx

@@ -1,15 +1,16 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { ModalProps } from '../types';
+
 import React, { useCallback, useState } from 'react';
 import styled from 'styled-components';
 
-import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import { AddressRow, Button, Input, InputAddress, Modal, QrScanAddress } from '@polkadot/react-components';
 import { useApi, useIpfs } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 
-import type { ModalProps } from '../types';
 import { useTranslation } from '../translate';
 import PasswordInput from './PasswordInput';
 

packages/page-accounts/src/modals/Transfer.tsx

@@ -1,12 +1,13 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { DeriveBalancesAll } from '@polkadot/api-derive/types';
+import type { AccountInfo } from '@polkadot/types/interfaces';
+
 import BN from 'bn.js';
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 
-import type { DeriveBalancesAll } from '@polkadot/api-derive/types';
-import type { AccountInfo } from '@polkadot/types/interfaces';
 import { InputAddress, InputBalance, Modal, Toggle, TxButton } from '@polkadot/react-components';
 import { useApi, useCall } from '@polkadot/react-hooks';
 import { Available } from '@polkadot/react-query';

packages/page-accounts/src/translate.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { UseTranslationResponse } from 'react-i18next';
+
 import { useTranslation as useTranslationBase } from 'react-i18next';
 
 export function useTranslation (): UseTranslationResponse {

packages/page-accounts/src/types.ts

@@ -1,12 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { WithTranslation } from 'react-i18next';
-
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { Balance, Conviction } from '@polkadot/types/interfaces';
 import type { KeyringAddress } from '@polkadot/ui-keyring/types';
 
+import { WithTranslation } from 'react-i18next';
+
 export { AppProps as ComponentProps } from '@polkadot/react-components/types';
 
 export interface BareProps {

packages/page-accounts/src/util.tsx

@@ -1,14 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-accounts authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeyringAddress } from '@polkadot/ui-keyring/types';
+import type { SortedAccount } from './types';
+
 import React from 'react';
 
-import type { KeyringAddress } from '@polkadot/ui-keyring/types';
 import { Menu } from '@polkadot/react-components';
 import keyring from '@polkadot/ui-keyring';
 
-import type { SortedAccount } from './types';
-
 export function createMenuGroup (items: (React.ReactNode | false | undefined | null)[]): React.ReactNode | null {
   const filtered = items.filter((item): item is React.ReactNode => !!item);
 

packages/page-addresses/src/Contacts/Address.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useContext, useEffect, useState } from 'react';
-import styled, { ThemeContext } from 'styled-components';
-
 import type { DeriveAccountInfo, DeriveBalancesAll } from '@polkadot/api-derive/types';
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { ThemeDef } from '@polkadot/react-components/types';
 import type { KeyringAddress } from '@polkadot/ui-keyring/types';
+
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+import styled, { ThemeContext } from 'styled-components';
+
 import Transfer from '@polkadot/app-accounts/modals/Transfer';
 import { AddressInfo, AddressSmall, Button, ChainLock, Forget, Icon, LinkExternal, Menu, Popup, Tags } from '@polkadot/react-components';
 import { useApi, useCall } from '@polkadot/react-hooks';

packages/page-addresses/src/Contacts/index.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ComponentProps as Props } from '../types';
+
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 
 import { Button, Input, Table } from '@polkadot/react-components';
 import { useAddresses, useFavorites, useLoadingDelay, useToggle } from '@polkadot/react-hooks';
 
-import type { ComponentProps as Props } from '../types';
 import CreateModal from '../modals/Create';
 import { useTranslation } from '../translate';
 import Address from './Address';

packages/page-addresses/src/index.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { AppProps as Props } from '@polkadot/react-components/types';
+
 import React, { useRef } from 'react';
 import { Route, Switch } from 'react-router';
 
-import type { AppProps as Props } from '@polkadot/react-components/types';
 import { Tabs } from '@polkadot/react-components';
 
 import Contacts from './Contacts';

packages/page-addresses/src/modals/Create.tsx

@@ -1,17 +1,18 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useCallback, useState } from 'react';
-
 import type { DeriveAccountInfo } from '@polkadot/api-derive/types';
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
+import type { ModalProps as Props } from '../types';
+
+import React, { useCallback, useState } from 'react';
+
 import { AddressRow, Button, Input, InputAddress, Modal } from '@polkadot/react-components';
 import { useApi, useCall } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 import { hexToU8a } from '@polkadot/util';
 import { ethereumEncode } from '@polkadot/util-crypto';
 
-import type { ModalProps as Props } from '../types';
 import { useTranslation } from '../translate';
 
 interface AddrState {

packages/page-addresses/src/translate.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { UseTranslationResponse } from 'react-i18next';
+
 import { useTranslation as useTranslationBase } from 'react-i18next';
 
 export function useTranslation (): UseTranslationResponse {

packages/page-addresses/src/types.ts

@@ -1,12 +1,12 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { WithTranslation } from 'react-i18next';
-
 import type { ActionStatus } from '@polkadot/react-components/Status/types';
 import type { Balance, Conviction } from '@polkadot/types/interfaces';
 import type { KeyringAddress } from '@polkadot/ui-keyring/types';
 
+import { WithTranslation } from 'react-i18next';
+
 export { AppProps as ComponentProps } from '@polkadot/react-components/types';
 
 export interface BareProps {

packages/page-addresses/src/util.tsx

@@ -1,14 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-addresses authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { KeyringAddress } from '@polkadot/ui-keyring/types';
+import type { SortedAccount } from './types';
+
 import React from 'react';
 
-import type { KeyringAddress } from '@polkadot/ui-keyring/types';
 import { Menu } from '@polkadot/react-components';
 import keyring from '@polkadot/ui-keyring';
 
-import type { SortedAccount } from './types';
-
 export function createMenuGroup (items: (React.ReactNode | false | undefined | null)[]): React.ReactNode | null {
   const filtered = items.filter((item): item is React.ReactNode => !!item);
 

packages/page-bounties/src/Bounties.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-bounties authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import React, { useRef } from 'react';
-
 import type { Bytes, Option } from '@polkadot/types';
 import type { BlockNumber, Bounty as BountyType, BountyIndex } from '@polkadot/types/interfaces';
+
+import React, { useRef } from 'react';
+
 import { BountyDescription } from '@polkadot/app-bounties/types';
 import { Table } from '@polkadot/react-components';
 import { useApi, useCall } from '@polkadot/react-hooks';

packages/page-bounties/src/Bounty.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-bounties authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { BlockNumber, Bounty as BountyType } from '@polkadot/types/interfaces';
+
 import React, { useCallback, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
-import type { BlockNumber, Bounty as BountyType } from '@polkadot/types/interfaces';
 import { BountyDescription } from '@polkadot/app-bounties/types';
 import { AddressSmall, Icon, LinkExternal } from '@polkadot/react-components';
 import { BlockToTime, FormatBalance } from '@polkadot/react-query';

packages/page-bounties/src/translate.ts

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { UseTranslationResponse } from 'react-i18next';
+
 import { useTranslation as useTranslationBase } from 'react-i18next';
 
 export function useTranslation (): UseTranslationResponse {

packages/page-calendar/src/Day.tsx

@@ -1,12 +1,13 @@
 // Copyright 2017-2020 @polkadot/app-calendar authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { EntryInfo } from './types';
+
 import React, { useMemo, useRef } from 'react';
 import styled from 'styled-components';
 
 import { Button } from '@polkadot/react-components';
 
-import type { EntryInfo } from './types';
 import { MONTHS } from './constants';
 import DayHour from './DayHour';
 import DayTime from './DayTime';

packages/page-calendar/src/DayHour.tsx

@@ -1,10 +1,11 @@
 // Copyright 2017-2020 @polkadot/app-calendar authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { EntryInfoTyped } from './types';
+
 import React, { useMemo } from 'react';
 import styled from 'styled-components';
 
-import type { EntryInfoTyped } from './types';
 import DayItem from './DayItem';
 
 interface Props {

packages/page-calendar/src/DayItem.tsx

@@ -1,13 +1,14 @@
 // Copyright 2017-2020 @polkadot/app-calendar authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { EntryInfoTyped } from './types';
+
 import React, { useCallback, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
 import { Button } from '@polkadot/react-components';
 import { formatNumber, isString } from '@polkadot/util';
 
-import type { EntryInfoTyped } from './types';
 import { useTranslation } from './translate';
 import { dateCalendarFormat } from './util';