neptune/ghost-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bumps w/ eslint (#2802)

Browse Source 
* Bumps w/ eslint

* Additional

* Additional

* Additional

* Additional

* Remove style props

* Additional

* Additional

* Additional

* Additional (< 100)

* eslint passes, tsc next

* tsc fixes

* Update deps

* Update i18n
This commit is contained in:
Jaco Greeff 2020-05-24 19:41:14 +02:00 committed by GitHub
parent 8652303211
commit c60ba8708a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
498 changed files with 2342 additions and 2467 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
package.json
View File

@ -28,12 +28,12 @@
}
},
"resolutions": {
"@polkadot/api": "^1.15.1",
"@polkadot/api-contract": "^1.15.1",
"@polkadot/keyring": "^2.10.1",
"@polkadot/types": "^1.15.1",
"@polkadot/util": "^2.10.1",
"@polkadot/util-crypto": "^2.10.1",
"@polkadot/api": "^1.16.0-beta.2",
"@polkadot/api-contract": "^1.16.0-beta.2",
"@polkadot/keyring": "^2.11.0-beta.2",
"@polkadot/types": "^1.16.0-beta.2",
"@polkadot/util": "^2.11.0-beta.2",
"@polkadot/util-crypto": "^2.11.0-beta.2",
"babel-core": "^7.0.0-bridge.0"
},
"scripts": {
@ -75,8 +75,8 @@
"@babel/register": "^7.9.0",
"@babel/runtime": "^7.9.6",
"@pinata/sdk": "^1.1.9",
"@polkadot/dev": "^0.53.5",
"@polkadot/ts": "^0.3.22",
"@polkadot/dev": "^0.54.1",
"@polkadot/ts": "^0.3.23",
"@types/bn.js": "^4.11.6",
"@types/chart.js": "^2.9.21",
"@types/file-saver": "^2.0.1",

2
packages/apps-config/src/api/chain/berlin.ts
View File

@ -9,7 +9,7 @@ import * as edgewareDefinitions from 'edgeware-node-types/dist/definitions';
const edgTypes = Object
.values(edgewareDefinitions)
.reduce((res, { default: { types } }): object => ({ ...res, ...types }), {});
.reduce((res, { default: { types } }) => ({ ...res, ...types }), {});
export default {
...edgTypes,

2
packages/apps-config/src/api/index.ts
View File

@ -5,7 +5,7 @@
import typesChain from './chain';
import typesSpec from './spec';
export function getChainTypes (specName: string, chainName: string): Record<string, string | object> {
export function getChainTypes (specName: string, chainName: string): Record<string, string | Record<string, unknown>> {
return {
...(typesSpec[specName as 'edgeware'] || {}),
...(typesChain[chainName as 'Berlin'] || {})

2
packages/apps-config/src/api/spec/edgeware.ts
View File

@ -9,7 +9,7 @@ import * as edgewareDefinitions from 'edgeware-node-types/dist/definitions';
const edgTypes = Object
.values(edgewareDefinitions)
.reduce((res, { default: { types } }): object => ({ ...res, ...types }), {});
.reduce((res, { default: { types } }) => ({ ...res, ...types }), {});
export default {
...edgTypes,

2
packages/apps-config/src/api/spec/encointer-node.ts
View File

@ -4,7 +4,7 @@
// structs need to be in order
/* eslint-disable sort-keys */
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
export default {
Address: 'AccountId',

4
packages/apps-config/src/api/util.ts
View File

@ -2,10 +2,10 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
export function typesFromDefs (definitions: Record<string, { types: any }>): object {
export function typesFromDefs (definitions: Record<string, { types: Record<string, any> }>): Record<string, any> {
return Object
.values(definitions)
.reduce((res, { types }): object => ({
.reduce((res: Record<string, any>, { types }): Record<string, any> => ({
...res,
...types
}), {});

2
packages/apps-config/src/links/commonwealth.ts
View File

@ -13,7 +13,7 @@ export default {
'Kusama CC3': 'kusama'
},
create: (chain: string, path: string, data: BN | number | string, hash?: string): string =>
`https://commonwealth.im/${chain}/${path}/${HASH_PATHS.includes(path) ? hash : data.toString()}`,
`https://commonwealth.im/${chain}/${path}/${HASH_PATHS.includes(path) ? (hash || '') : data.toString()}`,
isActive: true,
paths: {
council: 'proposal/councilmotion',

41
packages/apps-config/src/settings/endpoints.ts
View File

@ -4,66 +4,66 @@
import { Option } from './types';
function createDev (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
function createDev (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
return [
{
info: 'local',
text: t('rpc.local', 'Local Node (Own, 127.0.0.1:9944)', { ns: 'apps-config' }),
text: t<string>('rpc.local', 'Local Node (Own, 127.0.0.1:9944)', { ns: 'apps-config' }),
value: 'ws://127.0.0.1:9944/'
}
];
}
function createLive (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
function createLive (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
return [
{
info: 'kusama',
text: t('rpc.kusama.parity', 'Kusama (Polkadot Canary, hosted by Parity)', { ns: 'apps-config' }),
text: t<string>('rpc.kusama.parity', 'Kusama (Polkadot Canary, hosted by Parity)', { ns: 'apps-config' }),
value: 'wss://kusama-rpc.polkadot.io/'
},
{
info: 'kusama',
text: t('rpc.kusama.w3f', 'Kusama (Polkadot Canary, hosted by Web3 Foundation)', { ns: 'apps-config' }),
text: t<string>('rpc.kusama.w3f', 'Kusama (Polkadot Canary, hosted by Web3 Foundation)', { ns: 'apps-config' }),
value: 'wss://cc3-5.kusama.network/'
},
{
info: 'kusama',
text: t('rpc.kusama.ava', 'Kusama (Polkadot Canary, user-run public nodes; see https://status.cloud.ava.do/)', { ns: 'apps-config' }),
text: t<string>('rpc.kusama.ava', 'Kusama (Polkadot Canary, user-run public nodes; see https://status.cloud.ava.do/)', { ns: 'apps-config' }),
value: 'wss://kusama.polkadot.cloud.ava.do/'
},
{
info: 'edgeware',
text: t('rpc.edgeware', 'Edgeware (Edgeware Mainnet, hosted by Commonwealth Labs)', { ns: 'apps-config' }),
text: t<string>('rpc.edgeware', 'Edgeware (Edgeware Mainnet, hosted by Commonwealth Labs)', { ns: 'apps-config' }),
value: 'wss://mainnet1.edgewa.re'
},
{
info: 'substrate',
text: t('rpc.kulupu', 'Kulupu (Kulupu Mainnet, hosted by Kulupu)', { ns: 'apps-config' }),
text: t<string>('rpc.kulupu', 'Kulupu (Kulupu Mainnet, hosted by Kulupu)', { ns: 'apps-config' }),
value: 'wss://rpc.kulupu.network/ws'
}
];
}
function createTest (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
function createTest (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
return [
{
info: 'westend',
text: t('rpc.westend', 'Westend (Polkadot Testnet, hosted by Parity)', { ns: 'apps-config' }),
text: t<string>('rpc.westend', 'Westend (Polkadot Testnet, hosted by Parity)', { ns: 'apps-config' }),
value: 'wss://westend-rpc.polkadot.io'
},
{
info: 'edgeware',
text: t('rpc.berlin', 'Berlin (Edgeware Testnet, hosted by Commonwealth Labs)', { ns: 'apps-config' }),
text: t<string>('rpc.berlin', 'Berlin (Edgeware Testnet, hosted by Commonwealth Labs)', { ns: 'apps-config' }),
value: 'wss://berlin1.edgewa.re'
},
{
info: 'substrate',
text: t('rpc.flamingfir', 'Flaming Fir (Substrate Testnet, hosted by Parity)', { ns: 'apps-config' }),
text: t<string>('rpc.flamingfir', 'Flaming Fir (Substrate Testnet, hosted by Parity)', { ns: 'apps-config' }),
value: 'wss://substrate-rpc.parity.io/'
},
{
info: 'nodle',
text: t('rpc.arcadia', 'Arcadia (Nodle Testnet, hosted by Nodle)', { ns: 'apps-config' }),
text: t<string>('rpc.arcadia', 'Arcadia (Nodle Testnet, hosted by Nodle)', { ns: 'apps-config' }),
value: 'wss://arcadia1.nodleprotocol.io/'
}
];
@ -74,14 +74,15 @@ function createTest (t: (key: string, text: string, options: { ns: string }) =>
// info: The chain logo name as defined in ../logos, specifically in namedLogos
// text: The text to display on teh dropdown
// value: The actual hosted secure websocket endpoint
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
export default function create (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
const ENV: Option[] = [];
const WS_URL = process.env.WS_URL || (window as any).process_env?.WS_URL;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-member-access
const WS_URL = process.env.WS_URL || (window as any).process_env?.WS_URL as string;
if (WS_URL) {
ENV.push({
info: 'WS_URL',
text: 'WS_URL: ' + WS_URL,
text: `WS_URL: ${WS_URL}`,
value: WS_URL
});
}
@ -89,19 +90,19 @@ export default function create (t: (key: string, text: string, options: { ns: st
let endpoints = [
{
isHeader: true,
text: t('rpc.header.live', 'Live networks', { ns: 'apps-config' }),
text: t<string>('rpc.header.live', 'Live networks', { ns: 'apps-config' }),
value: ''
},
...createLive(t),
{
isHeader: true,
text: t('rpc.header.test', 'Test networks', { ns: 'apps-config' }),
text: t<string>('rpc.header.test', 'Test networks', { ns: 'apps-config' }),
value: ''
},
...createTest(t),
{
isHeader: true,
text: t('rpc.header.dev', 'Development', { ns: 'apps-config' }),
text: t<string>('rpc.header.dev', 'Development', { ns: 'apps-config' }),
value: ''
},
...createDev(t)
@ -111,7 +112,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
endpoints = [
{
isHeader: true,
text: t('rpc.custom', 'Custom environment', { ns: 'apps-config' }),
text: t<string>('rpc.custom', 'Custom environment', { ns: 'apps-config' }),
value: ''
},
...ENV

4
packages/apps-config/src/settings/languages.ts
View File

@ -4,10 +4,10 @@
import { Option } from './types';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
export default function create (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
return [
{
text: t('lng.detect', 'Default browser language (auto-detect)', { ns: 'apps-config' }),
text: t<string>('lng.detect', 'Default browser language (auto-detect)', { ns: 'apps-config' }),
value: 'default'
},
{

14
packages/apps-config/src/settings/ss58.ts
View File

@ -8,36 +8,36 @@ import { Option } from './types';
// info: the name of a logo as defined in ../logos, specifically in namedLogos
// text: The text you wish to display in the dropdown
// value: The actual ss5Format value (as registered)
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Option[] {
export default function create (t: <T= string> (key: string, text: string, options: { ns: string }) => T): Option[] {
return [
{
info: 'default',
text: t('ss58.default', 'Default for the connected node', { ns: 'apps-config' }),
text: t<string>('ss58.default', 'Default for the connected node', { ns: 'apps-config' }),
value: -1
},
{
info: 'substrate',
text: t('ss58.substrate', 'Substrate (generic)', { ns: 'apps-config' }),
text: t<string>('ss58.substrate', 'Substrate (generic)', { ns: 'apps-config' }),
value: 42
},
{
info: 'polkadot',
text: t('ss58.polkadot', 'Polkadot (live)', { ns: 'apps-config' }),
text: t<string>('ss58.polkadot', 'Polkadot (live)', { ns: 'apps-config' }),
value: 0
},
{
info: 'kusama',
text: t('ss58.kusmaa', 'Kusama (canary)', { ns: 'apps-config' }),
text: t<string>('ss58.kusmaa', 'Kusama (canary)', { ns: 'apps-config' }),
value: 2
},
{
info: 'edgeware',
text: t('ss58.edgeware', 'Edgeware (live)', { ns: 'apps-config' }),
text: t<string>('ss58.edgeware', 'Edgeware (live)', { ns: 'apps-config' }),
value: 7
},
{
info: 'centrifuge',
text: t('ss58.centrifuge', 'Centrifuge (live)', { ns: 'apps-config' }),
text: t<string>('ss58.centrifuge', 'Centrifuge (live)', { ns: 'apps-config' }),
value: 36
}
];

1
packages/apps-config/src/ui/index.ts
View File

@ -14,5 +14,6 @@ export function getSystemIcon (systemName: string): 'beachball' | 'polkadot' | '
}
export const getSystemChainColor = (systemChain: string, systemName: string): string | undefined => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
return chainColors[sanitize(systemChain)] || nodeColors[sanitize(systemName)];
};

6
packages/apps-config/src/ui/logos/index.ts
View File

@ -2,6 +2,8 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
// anything for a specific chain, most would probably fit into the node category (but allow for chain-specific)
import chainKusama from './chains/kusama-128.gif';
@ -28,7 +30,7 @@ const chainLogos: Record<string, any> = [
['Kusama CC3', chainKusama]
].reduce((logos, [chain, logo]): Record<string, any> => ({
...logos,
[chain.toLowerCase()]: logo
[(chain as string).toLowerCase()]: logo
}), {});
// overrides based on the actual software node type (all '-' converted to ' ')
@ -44,7 +46,7 @@ const nodeLogos: Record<string, any> = [
['substrate-node', nodeSubstrate]
].reduce((logos, [node, logo]): Record<string, any> => ({
...logos,
[node.toLowerCase().replace(/-/g, ' ')]: logo
[(node as string).toLowerCase().replace(/-/g, ' ')]: logo
}), {});
// overrides when we pass an explicit logo name

2
packages/apps-electron/package.json
View File

@ -5,7 +5,7 @@
"version": "0.43.0-beta.2",
"dependencies": {
"@babel/polyfill": "^7.8.7",
"@polkadot/dev": "^0.53.5",
"@polkadot/dev": "^0.54.1",
"@polkadot/react-components": "0.43.0-beta.2"
},
"devDependencies": {

13
packages/apps-electron/src/electron.ts
View File

@ -7,7 +7,7 @@ import path from 'path';
const environment = process.env.NODE_ENV || 'production';
function createWindow (): void {
function createWindow (): Promise<unknown> {
// Create the browser window.
const win = new BrowserWindow({
height: 600,
@ -18,13 +18,14 @@ function createWindow (): void {
});
if (environment === 'development') {
win.loadURL('http://0.0.0.0:9000/');
win.webContents.openDevTools();
} else {
const mainFilePath = path.resolve(__dirname, 'index.html');
win.loadFile(mainFilePath);
return win.loadURL('http://0.0.0.0:9000/');
}
const mainFilePath = path.resolve(__dirname, 'index.html');
return win.loadFile(mainFilePath);
}
app.whenReady().then(createWindow);
app.whenReady().then(createWindow).catch(console.error);

2
packages/apps-electron/webpack.main.config.js
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
const TerserPlugin = require('terser-webpack-plugin');
const path = require('path');

2
packages/apps-electron/webpack.renderer.config.js
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
const merge = require('webpack-merge');
const baseConfig = require('@polkadot/apps/webpack.base.config');

4
packages/apps-routing/src/123code.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Template from '@polkadot/app-123code';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Template,
display: {
@ -18,6 +18,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'th',
name: '123code',
text: t('nav.123-code', 'Template', { ns: 'apps-routing' })
text: t<string>('nav.123-code', 'Template', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/accounts.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Accounts, { useCounter } from '@polkadot/app-accounts';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Accounts,
display: {
@ -14,7 +14,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'users',
name: 'accounts',
text: t('nav.accounts', 'Accounts', { ns: 'apps-routing' }),
text: t<string>('nav.accounts', 'Accounts', { ns: 'apps-routing' }),
useCounter
};
}

4
packages/apps-routing/src/claims.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Claims from '@polkadot/app-claims';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Claims,
display: {
@ -17,6 +17,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'star',
name: 'claims',
text: t('nav.claims', 'Claim Tokens', { ns: 'apps-routing' })
text: t<string>('nav.claims', 'Claim Tokens', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/contracts.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Contracts from '@polkadot/app-contracts';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Contracts,
display: {
@ -17,6 +17,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'compress',
name: 'contracts',
text: t('nav.contracts', 'Contracts', { ns: 'apps-routing' })
text: t<string>('nav.contracts', 'Contracts', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/council.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Council, { useCounter } from '@polkadot/app-council';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Council,
display: {
@ -19,7 +19,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'building',
name: 'council',
text: t('nav.council', 'Council', { ns: 'apps-routing' }),
text: t<string>('nav.council', 'Council', { ns: 'apps-routing' }),
useCounter
};
}

4
packages/apps-routing/src/dashboard.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Dashboard from '@polkadot/app-dashboard';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Dashboard,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'th',
name: 'dashboard',
text: t('nav.dashboard', 'Dashboard', { ns: 'apps-routing' })
text: t<string>('nav.dashboard', 'Dashboard', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/democracy.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Democracy, { useCounter } from '@polkadot/app-democracy';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Democracy,
display: {
@ -16,7 +16,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'calendar check',
name: 'democracy',
text: t('nav.democracy', 'Democracy', { ns: 'apps-routing' }),
text: t<string>('nav.democracy', 'Democracy', { ns: 'apps-routing' }),
useCounter
};
}

4
packages/apps-routing/src/explorer.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Explorer from '@polkadot/app-explorer';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Explorer,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'braille',
name: 'explorer',
text: t('nav.explorer', 'Explorer', { ns: 'apps-routing' })
text: t<string>('nav.explorer', 'Explorer', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/extrinsics.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Extrinsics from '@polkadot/app-extrinsics';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Extrinsics,
display: {
@ -15,6 +15,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'sync',
name: 'extrinsics',
text: t('nav.extrinsics', 'Extrinsics', { ns: 'apps-routing' })
text: t<string>('nav.extrinsics', 'Extrinsics', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/generic-asset.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import GenericAsset from '@polkadot/app-generic-asset';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: GenericAsset,
display: {
@ -18,6 +18,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'cubes',
name: 'generic-asset',
text: t('nav.generic-asset', 'Generic asset', { ns: 'apps-routing' })
text: t<string>('nav.generic-asset', 'Generic asset', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/i18n.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Translator from '@polkadot/app-i18n';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Translator,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'th',
name: 'i18n',
text: t('nav.i18n', 'I18n Translator', { ns: 'apps-routing' })
text: t<string>('nav.i18n', 'I18n Translator', { ns: 'apps-routing' })
};
}

2
packages/apps-routing/src/index.ts
View File

@ -31,7 +31,7 @@ import toolbox from './toolbox';
import transfer from './transfer';
import treasury from './treasury';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Routes {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Routes {
return appSettings.uiMode === 'light'
? [
// dashboard,

4
packages/apps-routing/src/js.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Js from '@polkadot/app-js';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Js,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'code',
name: 'js',
text: t('nav.js', 'Javascript', { ns: 'apps-routing' })
text: t<string>('nav.js', 'Javascript', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/parachains.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Parachains from '@polkadot/app-parachains';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Parachains,
display: {
@ -16,6 +16,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'chain',
name: 'parachains',
text: t('nav.parachains', 'Parachains', { ns: 'apps-routing' })
text: t<string>('nav.parachains', 'Parachains', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/settings.ts
View File

@ -6,13 +6,13 @@ import { Route } from './types';
import Settings, { useCounter } from '@polkadot/app-settings';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Settings,
display: {},
icon: 'settings',
name: 'settings',
text: t('nav.settings', 'Settings', { ns: 'apps-routing' }),
text: t<string>('nav.settings', 'Settings', { ns: 'apps-routing' }),
useCounter
};
}

4
packages/apps-routing/src/society.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Society from '@polkadot/app-society';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Society,
display: {
@ -17,6 +17,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'grab',
name: 'society',
text: t('nav.society', 'Society', { ns: 'apps-routing' })
text: t<string>('nav.society', 'Society', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/staking.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Staking from '@polkadot/app-staking';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Staking,
display: {
@ -16,6 +16,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'certificate',
name: 'staking',
text: t('nav.staking', 'Staking', { ns: 'apps-routing' })
text: t<string>('nav.staking', 'Staking', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/storage.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Storage from '@polkadot/app-storage';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Storage,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'database',
name: 'chainstate',
text: t('nav.storage', 'Chain state', { ns: 'apps-routing' })
text: t<string>('nav.storage', 'Chain state', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/sudo.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Sudo from '@polkadot/app-sudo';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Sudo,
display: {
@ -18,6 +18,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'unlock',
name: 'sudo',
text: t('nav.sudo', 'Sudo', { ns: 'apps-routing' })
text: t<string>('nav.sudo', 'Sudo', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/techcomm.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import TechComm, { useCounter } from '@polkadot/app-tech-comm';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: TechComm,
display: {
@ -17,7 +17,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'microchip',
name: 'techcomm',
text: t('nav.tech-comm', 'Tech. comm.', { ns: 'apps-routing' }),
text: t<string>('nav.tech-comm', 'Tech. comm.', { ns: 'apps-routing' }),
useCounter
};
}

4
packages/apps-routing/src/toolbox.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Toolbox from '@polkadot/app-toolbox';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Toolbox,
display: {
@ -14,6 +14,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'configure',
name: 'toolbox',
text: t('nav.toolbox', 'Toolbox', { ns: 'apps-routing' })
text: t<string>('nav.toolbox', 'Toolbox', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/transfer.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import TransferModal from '@polkadot/app-accounts/Accounts/modals/Transfer';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: TransferModal,
Modal: TransferModal,
@ -19,6 +19,6 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'send',
name: 'transfer',
text: t('nav.transfer', 'Transfer', { ns: 'apps-routing' })
text: t<string>('nav.transfer', 'Transfer', { ns: 'apps-routing' })
};
}

4
packages/apps-routing/src/treasury.ts
View File

@ -6,7 +6,7 @@ import { Route } from './types';
import Treasury, { useCounter } from '@polkadot/app-treasury';
export default function create (t: (key: string, text: string, options: { ns: string }) => string): Route {
export default function create (t: <T = string> (key: string, text: string, options: { ns: string }) => T): Route {
return {
Component: Treasury,
display: {
@ -16,7 +16,7 @@ export default function create (t: (key: string, text: string, options: { ns: st
},
icon: 'gem',
name: 'treasury',
text: t('nav.treasury', 'Treasury', { ns: 'apps-routing' }),
text: t<string>('nav.treasury', 'Treasury', { ns: 'apps-routing' }),
useCounter
};
}

2
packages/apps/package.json
View File

@ -15,7 +15,7 @@
"dependencies": {
"@babel/polyfill": "^7.8.7",
"@babel/runtime": "^7.9.6",
"@polkadot/dev": "^0.53.5",
"@polkadot/dev": "^0.54.1",
"@polkadot/react-components": "0.43.0-beta.2",
"@polkadot/react-signer": "0.43.0-beta.2",
"query-string": "^6.12.1"

2
packages/apps/public/locales/en/app-parachains.json
View File

@ -5,6 +5,7 @@
"Message data": "Message data",
"Message origin.": "Message origin.",
"Most recent head data": "Most recent head data",
"Not updated in the last block": "Not updated in the last block",
"Parachains overview": "Parachains overview",
"Positive number greater than or equal to {{nextFreeId}}": "Positive number greater than or equal to {{nextFreeId}}",
"Register a parachain": "Register a parachain",
@ -19,6 +20,7 @@
"The scheduling setting for this parachain.": "The scheduling setting for this parachain.",
"There are no registered parachains": "There are no registered parachains",
"Unknown": "Unknown",
"Updated in the latest block": "Updated in the latest block",
"best block": "best block",
"code": "code",
"data": "data",

6
packages/apps/src/Apps.tsx
View File

@ -29,10 +29,10 @@ interface SidebarState {
export const PORTAL_ID = 'portals';
function saveSidebar (sidebar: SidebarState): SidebarState {
return store.set('sidebar', sidebar);
return store.set('sidebar', sidebar) as SidebarState;
}
function Apps ({ className }: Props): React.ReactElement<Props> {
function Apps ({ className = '' }: Props): React.ReactElement<Props> {
const { systemChain, systemName } = useApi();
const [sidebar, setSidebar] = useState<SidebarState>({
isCollapsed: false,
@ -75,7 +75,7 @@ function Apps ({ className }: Props): React.ReactElement<Props> {
return (
<>
<GlobalStyle uiHighlight={defaultColor || uiHighlight} />
<div className={`apps--Wrapper ${isCollapsed ? 'collapsed' : 'expanded'} ${isMenu && 'fixed'} ${isMenuOpen && 'menu-open'} theme--default ${className}`}>
<div className={`apps--Wrapper ${isCollapsed ? 'collapsed' : 'expanded'} ${isMenu ? 'fixed' : ''} ${isMenuOpen ? 'menu-open' : ''} theme--default ${className}`}>
<div
className={`apps--Menu-bg ${isMenuOpen ? 'open' : 'closed'}`}
onClick={_handleResize}

4
packages/apps/src/Content/NotFound.tsx
View File

@ -5,9 +5,7 @@
import React from 'react';
import { Redirect } from 'react-router';
type Props = {};
function NotFound (): React.ReactElement<Props> {
function NotFound (): React.ReactElement {
return (
<Redirect to='/explorer' />
);

6
packages/apps/src/Content/Status.tsx
View File

@ -23,7 +23,7 @@ interface Props {
let prevEventHash: string;
function filterEvents (allAccounts: string[], t: (key: string, opts?: object) => string, optionsAll?: KeyringOptions, events?: EventRecord[]): ActionStatus[] | null {
function filterEvents (allAccounts: string[], t: <T = string> (key: string, opts?: Record<string, unknown>) => T, optionsAll?: KeyringOptions, events?: EventRecord[]): ActionStatus[] | null {
const eventHash = xxhashAsHex(stringToU8a(JSON.stringify(events)));
if (!optionsAll || !events || eventHash === prevEventHash) {
@ -41,7 +41,7 @@ function filterEvents (allAccounts: string[], t: (key: string, opts?: object) =>
return {
account,
action: `${section}.${method}`,
message: t('transfer received'),
message: t<string>('transfer received'),
status: 'event'
};
}
@ -50,7 +50,7 @@ function filterEvents (allAccounts: string[], t: (key: string, opts?: object) =>
return {
action: `${section}.${method}`,
message: t('update on #{{index}}', {
message: t<string>('update on #{{index}}', {
replace: {
index
}

2
packages/apps/src/Content/index.tsx
View File

@ -50,7 +50,7 @@ function Content ({ className }: Props): React.ReactElement<Props> {
{needsApi && (!isApiReady || !isApiConnected)
? (
<div className='connecting'>
<Spinner label={t('Initializing connection')} />
<Spinner label={t<string>('Initializing connection')} />
</div>
)
: (

4
packages/apps/src/SideBar/ChainInfo.tsx
View File

@ -17,7 +17,7 @@ interface Props {
onClick?: () => void;
}
function ChainInfo ({ className, onClick }: Props): React.ReactElement<Props> {
function ChainInfo ({ className = '', onClick }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api } = useApi();
const runtimeVersion = useCall<RuntimeVersion>(api.rpc.state.subscribeRuntimeVersion, []);
@ -32,7 +32,7 @@ function ChainInfo ({ className, onClick }: Props): React.ReactElement<Props> {
<div className='info'>
<Chain className='chain' />
{runtimeVersion && (
<div className='runtimeVersion'>{t('version {{version}}', { replace: { version: runtimeVersion.specVersion.toNumber() } })}</div>
<div className='runtimeVersion'>{t<string>('version {{version}}', { replace: { version: runtimeVersion.specVersion.toNumber() } })}</div>
)}
<BestNumber label='#' />
</div>

5
packages/apps/src/SideBar/Item.tsx
View File

@ -21,7 +21,7 @@ interface Props {
route: Route;
}
const disabledLog: Map<string, string> = new Map();
const disabledLog = new Map<string, string>();
const TOOLTIP_OFFSET = { right: -4 };
function logDisabled (route: string, message: string): void {
@ -36,6 +36,7 @@ function hasEndpoint (api: ApiPromise, endpoint: string): boolean {
const [area, section, method] = endpoint.split('.');
try {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
return isFunction((api as any)[area][section][method]);
} catch (error) {
return false;
@ -66,7 +67,7 @@ function checkVisible (name: string, { api, isApiConnected, isApiReady }: ApiPro
});
if (notFound.length !== 0) {
logDisabled(name, `API not available: ${notFound}`);
logDisabled(name, `API not available: ${notFound.toString()}`);
}
return notFound.length === 0;

2
packages/apps/src/SideBar/NodeInfo.tsx
View File

@ -10,7 +10,7 @@ import { useApi } from '@polkadot/react-hooks';
import { NodeName, NodeVersion } from '@polkadot/react-query';
// eslint-disable-next-line @typescript-eslint/no-var-requires
const pkgJson = require('../../package.json');
const pkgJson = require('../../package.json') as { version: string };
const uiInfo = `apps v${pkgJson.version}`;

9
packages/apps/src/SideBar/index.tsx
View File

@ -9,7 +9,6 @@ import styled from 'styled-components';
import { Responsive } from 'semantic-ui-react';
import createRoutes from '@polkadot/apps-routing';
import { Button, ChainImg, Icon, Menu, media } from '@polkadot/react-components';
import { classes } from '@polkadot/react-components/util';
import { SIDEBAR_MENU_THRESHOLD } from '../constants';
import NetworkModal from '../modals/Network';
@ -27,7 +26,7 @@ interface Props {
toggleMenu: () => void;
}
function SideBar ({ className, collapse, handleResize, isCollapsed, isMenuOpen, toggleMenu }: Props): React.ReactElement<Props> {
function SideBar ({ className = '', collapse, handleResize, isCollapsed, isMenuOpen, toggleMenu }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [modals, setModals] = useState<Record<string, boolean>>(
createRoutes(t).reduce((result: Record<string, boolean>, route): Record<string, boolean> => {
@ -55,7 +54,7 @@ function SideBar ({ className, collapse, handleResize, isCollapsed, isMenuOpen,
return (
<Responsive
className={classes(className, 'apps--SideBar-Wrapper', isCollapsed ? 'collapsed' : 'expanded')}
className={`apps--SideBar-Wrapper ${className} ${isCollapsed ? 'collapsed' : 'expanded'}`}
onUpdate={handleResize}
>
<ChainImg
@ -113,7 +112,7 @@ function SideBar ({ className, collapse, handleResize, isCollapsed, isMenuOpen,
rel='noopener noreferrer'
target='_blank'
>
<Icon name='github' /><span className='text'>{t('nav.github', 'GitHub', { ns: 'apps-routing' })}</span>
<Icon name='github' /><span className='text'>{t<string>('nav.github', 'GitHub', { ns: 'apps-routing' })}</span>
</a>
</Menu.Item>
<Menu.Item className='apps--SideBar-Item'>
@ -123,7 +122,7 @@ function SideBar ({ className, collapse, handleResize, isCollapsed, isMenuOpen,
rel='noopener noreferrer'
target='_blank'
>
<Icon name='book' /><span className='text'>{t('nav.wiki', 'Wiki', { ns: 'apps-routing' })}</span>
<Icon name='book' /><span className='text'>{t<string>('nav.wiki', 'Wiki', { ns: 'apps-routing' })}</span>
</a>
</Menu.Item>
<Menu.Divider hidden />

2
packages/apps/src/WarmUp.tsx
View File

@ -19,7 +19,7 @@ function WarmUp (): React.ReactElement {
}, []);
return (
<div className={`apps--api-warm ${hasValues}`} />
<div className={`apps--api-warm ${hasValues.toString()}`} />
);
}

6
packages/apps/src/initSettings.ts
View File

@ -12,13 +12,13 @@ import settings from '@polkadot/ui-settings';
// - http://localhost:3000/?rpc=wss://substrate-rpc.parity.io/#/explorer
// - http://localhost:3000/#/explorer?rpc=wss://substrate-rpc.parity.io
const urlOptions = queryString.parse(location.href.split('?')[1]);
const stored = store.get('settings') || {};
const stored = store.get('settings') as Record<string, unknown> || {};
if (Array.isArray(urlOptions.rpc)) {
throw new Error('Invalid WS endpoint specified');
}
const fallbackUrl = createEndpoints(() => '').find(({ value }) => !!value) || { value: 'ws://127.0.0.1:9944' };
const fallbackUrl = createEndpoints(<T = string>(): T => ('' as unknown as T)).find(({ value }) => !!value) || { value: 'ws://127.0.0.1:9944' };
const apiUrl = urlOptions.rpc // we have a supplied value
? urlOptions.rpc.split('#')[0] // https://polkadot.js.org/apps/?rpc=ws://127.0.0.1:9944#/explorer
: [stored.apiUrl, process.env.WS_URL].includes(settings.apiUrl) // overridden, or stored
@ -31,7 +31,7 @@ settings.set({ apiUrl });
console.log('WS endpoint=', apiUrl);
try {
const types = store.get('types') || {};
const types = store.get('types') as Record<string, Record<string, string>> || {};
const names = Object.keys(types);
if (names.length) {

4
packages/apps/src/modals/Network.tsx
View File

@ -13,13 +13,13 @@ interface Props {
onClose: () => void;
}
function NetworkModal ({ className, onClose }: Props): React.ReactElement<Props> {
function NetworkModal ({ className = '', onClose }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
return (
<Modal
className={className}
header={t('Select Network')}
header={t<string>('Select Network')}
size='large'
>
<Modal.Content>

4
packages/apps/src/overlays/Base.tsx
View File

@ -14,7 +14,7 @@ interface Props {
type: 'error' | 'info';
}
function BaseOverlay ({ children, className, icon, type }: Props): React.ReactElement<Props> | null {
function BaseOverlay ({ children, className = '', icon, type }: Props): React.ReactElement<Props> | null {
const [isHidden, toggleHidden] = useToggle();
if (isHidden) {
@ -26,7 +26,7 @@ function BaseOverlay ({ children, className, icon, type }: Props): React.ReactEl
<div className='content'>
<Icon
className='contentIcon'
name={icon as any}
name={icon as 'send'}
size='big'
/>
<div className='contentItem'>

6
packages/apps/src/overlays/Connecting.tsx
View File

@ -29,7 +29,7 @@ function Connecting ({ className }: Props): React.ReactElement<Props> | null {
icon='puzzle'
type='info'
>
<div>{t('Waiting for authorization from the extension. Please open the installed extension and approve or reject access.')}</div>
<div>{t<string>('Waiting for authorization from the extension. Please open the installed extension and approve or reject access.')}</div>
</BaseOverlay>
);
} else if (!isApiConnected) {
@ -39,10 +39,10 @@ function Connecting ({ className }: Props): React.ReactElement<Props> | null {
icon='globe'
type='error'
>
<div>{t('You are not connected to a node. Ensure that your node is running and that the Websocket endpoint is reachable.')}</div>
<div>{t<string>('You are not connected to a node. Ensure that your node is running and that the Websocket endpoint is reachable.')}</div>
{
isWs && !isWsLocal && isHttps
? <div>{t('You are connecting from a secure location to an insecure WebSocket ({{wsUrl}}). Due to browser mixed-content security policies this connection type is not allowed. Change the RPC service to a secure \'wss\' endpoint.', { replace: { wsUrl } })}</div>
? <div>{t<string>('You are connecting from a secure location to an insecure WebSocket ({{wsUrl}}). Due to browser mixed-content security policies this connection type is not allowed. Change the RPC service to a secure \'wss\' endpoint.', { replace: { wsUrl } })}</div>
: undefined
}
</BaseOverlay>

2
packages/apps/webpack.base.config.js
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
const fs = require('fs');
const path = require('path');

2
packages/apps/webpack.config.js
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
const fs = require('fs');
const path = require('path');

2
packages/page-123code/src/AccountSelector.tsx
View File

@ -15,7 +15,7 @@ interface Props {
onChange: (accountId: string | null) => void;
}
function AccountSelector ({ className, onChange }: Props): React.ReactElement<Props> {
function AccountSelector ({ className = '', onChange }: Props): React.ReactElement<Props> {
const [accountId, setAccountId] = useState<string | null>(null);
useEffect(

7
packages/page-123code/src/Summary.tsx
View File

@ -11,12 +11,9 @@ interface Props extends BareProps {
children: React.ReactNode;
}
function Summary ({ children, className, style }: Props): React.ReactElement<Props> {
function Summary ({ children, className = '' }: Props): React.ReactElement<Props> {
return (
<div
className={className}
style={style}
>
<div className={className}>
{children}
</div>
);

4
packages/page-accounts/package.json
View File

@ -13,8 +13,8 @@
"dependencies": {
"@babel/runtime": "^7.9.6",
"@polkadot/react-components": "0.43.0-beta.2",
"@polkadot/react-qr": "^0.54.0-beta.1",
"@polkadot/vanitygen": "^0.12.1",
"@polkadot/react-qr": "^0.54.0-beta.2",
"@polkadot/vanitygen": "^0.13.0-beta.0",
"detect-browser": "^5.1.0",
"file-saver": "^2.0.2"
}

44
packages/page-accounts/src/Accounts/Account.tsx
View File

@ -61,7 +61,7 @@ function createClearDemocracyTx (api: ApiPromise, address: string, unlockableIds
);
}
function Account ({ account: { address, meta }, className, filter, isFavorite, setBalance, 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 { queueExtrinsic } = useContext(StatusContext);
const api = useApi();
@ -140,10 +140,10 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
try {
keyring.forgetAccount(address);
status.status = 'success';
status.message = t('account forgotten');
status.message = t<string>('account forgotten');
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
},
[address, t]
@ -174,7 +174,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
getLedger()
.getAddress(true)
.catch((error): void => {
console.error(`ledger: ${error.message}`);
console.error(`ledger: ${(error as Error).message}`);
});
},
[]
@ -188,7 +188,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
<tr className={className}>
<td className='favorite'>
<Icon
className={`${isFavorite && 'isSelected isColorHighlight'}`}
className={`${isFavorite ? 'isSelected isColorHighlight' : ''}`}
name={isFavorite ? 'star' : 'star outline'}
onClick={_onFavorite}
/>
@ -198,7 +198,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
<Badge
hover={
<div>
<p>{t('This account is recoverable, with the following friends:')}</p>
<p>{t<string>('This account is recoverable, with the following friends:')}</p>
<div>
{recoveryInfo.friends.map((friend, index): React.ReactNode => (
<IdentityIcon
@ -210,15 +210,15 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
<table>
<tbody>
<tr>
<td>{t('threshold')}</td>
<td>{t<string>('threshold')}</td>
<td>{formatNumber(recoveryInfo.threshold)}</td>
</tr>
<tr>
<td>{t('delay')}</td>
<td>{t<string>('delay')}</td>
<td>{formatNumber(recoveryInfo.delayPeriod)}</td>
</tr>
<tr>
<td>{t('deposit')}</td>
<td>{t<string>('deposit')}</td>
<td>{formatBalance(recoveryInfo.deposit)}</td>
</tr>
</tbody>
@ -283,8 +283,8 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
key='multisig-approve'
onClose={_closeMultisig}
ongoing={multiInfos}
threshold={meta.threshold}
who={meta.who}
threshold={meta.threshold as number}
who={meta.who as string[]}
/>
)}
{isRecoverAccountOpen && (
@ -334,9 +334,9 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
<td className='button'>
<Button
icon='paper plane'
label={t('send')}
label={t<string>('send')}
onClick={toggleTransfer}
tooltip={t('Send funds from this account')}
tooltip={t<string>('Send funds from this account')}
/>
<Popup
className='theme--default'
@ -358,25 +358,25 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
disabled={!api.api.tx.identity?.setIdentity}
onClick={toggleIdentity}
>
{t('Set on-chain identity')}
{t<string>('Set on-chain identity')}
</Menu.Item>
<Menu.Item
disabled={!democracyUnlockTx}
onClick={_clearDemocracyLocks}
>
{t('Clear expired democracy locks')}
{t<string>('Clear expired democracy locks')}
</Menu.Item>
<Menu.Divider />
<Menu.Item
disabled={isExternal || isInjected || isMultisig}
onClick={toggleDerive}
>
{t('Derive account via derivation path')}
{t<string>('Derive account via derivation path')}
</Menu.Item>
{isHardware && (
<Menu.Item onClick={_showOnHardware}
>
{t('Show address on hardware device')}
{t<string>('Show address on hardware device')}
</Menu.Item>
)}
<Menu.Divider />
@ -384,7 +384,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
disabled={isExternal || isInjected || isMultisig || isDevelopment}
onClick={toggleBackup}
>
{t('Create a backup file for this account')}
{t<string>('Create a backup file for this account')}
</Menu.Item>
<Menu.Item
disabled={isExternal || isInjected || isMultisig || isDevelopment}
@ -396,18 +396,18 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
disabled={isInjected || isDevelopment}
onClick={toggleForget}
>
{t('Forget this account')}
{t<string>('Forget this account')}
</Menu.Item>
{api.api.tx.recovery?.createRecovery && (
<>
<Menu.Divider />
{!recoveryInfo && (
<Menu.Item onClick={toggleRecoverSetup}>
{t('Make recoverable')}
{t<string>('Make recoverable')}
</Menu.Item>
)}
<Menu.Item onClick={toggleRecoverAccount}>
{t('Initiate recovery for another')}
{t<string>('Initiate recovery for another')}
</Menu.Item>
</>
)}
@ -418,7 +418,7 @@ function Account ({ account: { address, meta }, className, filter, isFavorite, s
disabled={!multiInfos || !multiInfos.length}
onClick={toggleMultisig}
>
{t('Multisig approvals')}
{t<string>('Multisig approvals')}
</Menu.Item>
</>
)}

6
packages/page-accounts/src/Accounts/Banner.tsx
View File

@ -33,7 +33,7 @@ function Banner ({ className }: Props): React.ReactElement<Props> | null {
<div className={className}>
<div className='box'>
<div className='info'>
<p>{t('It is recommended that you create/store your accounts securely and externally from the app. On {{yourBrowser}} the following browser extensions are available for use -', {
<p>{t<string>('It is recommended that you create/store your accounts securely and externally from the app. On {{yourBrowser}} the following browser extensions are available for use -', {
replace: {
yourBrowser: stringUpperFirst(browserName)
}
@ -50,11 +50,11 @@ function Banner ({ className }: Props): React.ReactElement<Props> | null {
</li>
))
}</ul>
<p>{t('Accounts injected from any of these extensions will appear in this application and be available for use. The above list is updated as more extensions with external signing capability become available.')}&nbsp;<a
<p>{t<string>('Accounts injected from any of these extensions will appear in this application and be available for use. The above list is updated as more extensions with external signing capability become available.')}&nbsp;<a
href='https://github.com/polkadot-js/extension'
rel='noopener noreferrer'
target='_blank'
>{t('Learn more...')}</a></p>
>{t<string>('Learn more...')}</a></p>
</div>
</div>
</div>

16
packages/page-accounts/src/Accounts/index.tsx
View File

@ -91,7 +91,7 @@ function sortAccounts (addresses: string[], favorites: string[]): SortedAccount[
);
}
function Overview ({ className, onStatusChange }: Props): React.ReactElement<Props> {
function Overview ({ className = '', onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api } = useApi();
const { allAccounts } = useAccounts();
@ -150,7 +150,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
<Input
autoFocus
isFull
label={t('filter by name or tags')}
label={t<string>('filter by name or tags')}
onChange={setFilter}
value={filterOn}
/>
@ -188,25 +188,25 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
<Button
icon='add'
isDisabled={isIpfs}
label={t('Add account')}
label={t<string>('Add account')}
onClick={toggleCreate}
/>
<Button
icon='sync'
isDisabled={isIpfs}
label={t('Restore JSON')}
label={t<string>('Restore JSON')}
onClick={toggleImport}
/>
<Button
icon='qrcode'
label={t('Add via Qr')}
label={t<string>('Add via Qr')}
onClick={toggleQr}
/>
{isLedger() && (
<>
<Button
icon='question'
label={t('Query Ledger')}
label={t<string>('Query Ledger')}
onClick={queryLedger}
/>
</>
@ -214,12 +214,12 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
<Button
icon='add'
isDisabled={!api.tx.utility}
label={t('Multisig')}
label={t<string>('Multisig')}
onClick={toggleMultisig}
/>
</Button.Group>
<Table
empty={t("You don't have any accounts. Some features are currently hidden and will only become available once you have accounts.")}
empty={t<string>("You don't have any accounts. Some features are currently hidden and will only become available once you have accounts.")}
filter={filter}
footer={footer}
header={header}

12
packages/page-accounts/src/Accounts/modals/Backup.tsx
View File

@ -69,7 +69,7 @@ function Backup ({ address, onClose }: Props): React.ReactElement<Props> {
return (
<Modal
className='app--accounts-Modal'
header={t('Backup account')}
header={t<string>('Backup account')}
>
<Content
address={address}
@ -83,7 +83,7 @@ function Backup ({ address, onClose }: Props): React.ReactElement<Props> {
<Button
icon='download'
isDisabled={!isPassValid}
label={t('Download')}
label={t<string>('Download')}
onClick={_doBackup}
/>
</Modal.Actions>
@ -100,14 +100,14 @@ function Content ({ address, doBackup, isPassTouched, isPassValid, onChangePass,
isInline
value={address}
>
<p>{t('An encrypted backup file will be created once you have pressed the "Download" button. This can be used to re-import your account on any other machine.')}</p>
<p>{t('Save this backup file in a secure location. Additionally, the password associated with this account is needed together with this backup file in order to restore your account.')}</p>
<p>{t<string>('An encrypted backup file will be created once you have pressed the "Download" button. This can be used to re-import your account on any other machine.')}</p>
<p>{t<string>('Save this backup file in a secure location. Additionally, the password associated with this account is needed together with this backup file in order to restore your account.')}</p>
<div>
<Password
autoFocus
help={t('The account password as specified when creating the account. This is used to encrypt the backup file and subsequently decrypt it when restoring the account.')}
help={t<string>('The account password as specified when creating the account. This is used to encrypt the backup file and subsequently decrypt it when restoring the account.')}
isError={isPassTouched && !isPassValid}
label={t('password')}
label={t<string>('password')}
onChange={onChangePass}
onEnter={doBackup}
tabIndex={0}

16
packages/page-accounts/src/Accounts/modals/ChangePass.tsx
View File

@ -24,7 +24,7 @@ interface OldPass {
oldPass: string;
}
function ChangePass ({ address, className, onClose }: Props): React.ReactElement<Props> {
function ChangePass ({ address, className = '', onClose }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [{ isNewValid, newPass }, setNewPass] = useState<NewPass>({ isNewValid: false, newPass: '' });
const [{ isOldValid, oldPass }, setOldPass] = useState<OldPass>({ isOldValid: false, oldPass: '' });
@ -77,28 +77,28 @@ function ChangePass ({ address, className, onClose }: Props): React.ReactElement
return (
<Modal
className={`${className} app--accounts-Modal`}
header={t('Change account password')}
header={t<string>('Change account password')}
>
<Modal.Content>
<AddressRow
isInline
value={address}
>
<p>{t('This will apply to any future use of this account as stored on this browser. Ensure that you securely store this new password and that it is strong and unique to the account.')}</p>
<p>{t<string>('This will apply to any future use of this account as stored on this browser. Ensure that you securely store this new password and that it is strong and unique to the account.')}</p>
<div>
<Password
autoFocus
help={t('The existing account password as specified when this account was created or when it was last changed.')}
help={t<string>('The existing account password as specified when this account was created or when it was last changed.')}
isError={!isOldValid}
label={t('your current password')}
label={t<string>('your current password')}
onChange={_onChangeOld}
tabIndex={1}
value={oldPass}
/>
<Password
help={t('The new account password. Once set, all future account unlocks will be performed with this new password.')}
help={t<string>('The new account password. Once set, all future account unlocks will be performed with this new password.')}
isError={!isNewValid}
label={t('your new password')}
label={t<string>('your new password')}
onChange={_onChangeNew}
onEnter={_doChange}
tabIndex={2}
@ -112,7 +112,7 @@ function ChangePass ({ address, className, onClose }: Props): React.ReactElement
icon='sign-in'
isDisabled={!isNewValid || !isOldValid}
isPrimary
label={t('Change')}
label={t<string>('Change')}
onClick={_doChange}
/>
</Modal.Actions>

64
packages/page-accounts/src/Accounts/modals/Create.tsx
View File

@ -56,7 +56,7 @@ function deriveValidate (seed: string, derivePath: string, pairType: KeypairType
return 'Soft derivation paths are not allowed on ed25519';
}
} catch (error) {
return error.message;
return (error as Error).message;
}
return null;
@ -150,13 +150,13 @@ function createAccount (suri: string, pairType: KeypairType, { genesisHash, name
downloadAccount(result);
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
return status;
}
function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: propsType }: Props): React.ReactElement<Props> {
function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, type: propsType }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api, isDevelopment } = useApi();
const [{ address, deriveError, derivePath, isSeedValid, pairType, seed, seedType }, setAddress] = useState<AddressState>(generateSeed(propsSeed, '', propsSeed ? 'raw' : 'bip', propsType));
@ -167,11 +167,11 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
const isValid = !!address && !deriveError && isNameValid && isPassValid && isPass2Valid && isSeedValid;
const seedOpt = useMemo(() => (
isDevelopment
? [{ text: t('Development'), value: 'dev' }]
? [{ text: t<string>('Development'), value: 'dev' }]
: []
).concat(
{ text: t('Mnemonic'), value: 'bip' },
{ text: t('Raw seed'), value: 'raw' }
{ text: t<string>('Mnemonic'), value: 'bip' },
{ text: t<string>('Raw seed'), value: 'raw' }
), [isDevelopment, t]);
const _onChangePass = useCallback(
@ -220,7 +220,7 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
}
const options = { genesisHash: isDevelopment ? undefined : api.genesisHash.toString(), name: name.trim() };
const status = createAccount(`${seed}${derivePath}`, pairType, options, password, t('created account'));
const status = createAccount(`${seed}${derivePath}`, pairType, options, password, t<string>('created account'));
toggleConfirmation();
onStatusChange(status);
@ -232,7 +232,7 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
return (
<Modal
className={className}
header={t('Add an account via seed')}
header={t<string>('Add an account via seed')}
size='large'
>
{address && isConfirmationOpen && (
@ -258,33 +258,33 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
<Input
autoFocus
className='full'
help={t('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')}
help={t<string>('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')}
isError={!isNameValid}
label={t('name')}
label={t<string>('name')}
onChange={_onChangeName}
onEnter={_onCommit}
placeholder={t('new account')}
placeholder={t<string>('new account')}
value={name}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The name for this account and how it will appear under your addresses. With an on-chain identity, it can be made available to others.')}</p>
<p>{t<string>('The name for this account and how it will appear under your addresses. With an on-chain identity, it can be made available to others.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<Input
className='full'
help={t('The private key for your account is derived from this seed. This seed must be kept secret as anyone in its possession has access to the funds of this account. If you validate, use the seed of the session account as the "--key" parameter of your node.')}
help={t<string>('The private key for your account is derived from this seed. This seed must be kept secret as anyone in its possession has access to the funds of this account. If you validate, use the seed of the session account as the "--key" parameter of your node.')}
isAction
isError={!isSeedValid}
isReadOnly={seedType === 'dev'}
label={
seedType === 'bip'
? t('mnemonic seed')
? t<string>('mnemonic seed')
: seedType === 'dev'
? t('development seed')
: t('seed (hex or string)')
? t<string>('development seed')
: t<string>('seed (hex or string)')
}
onChange={_onChangeSeed}
onEnter={_onCommit}
@ -299,66 +299,66 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
</Input>
</Modal.Column>
<Modal.Column>
<p>{t('The secret seed value for this account. Ensure that you keep this in a safe place, with access to the seed you can re-create the account.')}</p>
<p>{t<string>('The secret seed value for this account. Ensure that you keep this in a safe place, with access to the seed you can re-create the account.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<Password
className='full'
help={t('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')}
help={t<string>('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')}
isError={!isPassValid}
label={t('password')}
label={t<string>('password')}
onChange={_onChangePass}
onEnter={_onCommit}
value={password}
/>
<Password
className='full'
help={t('Verify the password entered above.')}
help={t<string>('Verify the password entered above.')}
isError={!isPass2Valid}
label={t('password (repeat)')}
label={t<string>('password (repeat)')}
onChange={_onChangePass2}
onEnter={_onCommit}
value={password2}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The password and password confirmation for this account. This is required to authenticate any transactions made and to encrypt the keypair.')}</p>
<p>{t<string>('The password and password confirmation for this account. This is required to authenticate any transactions made and to encrypt the keypair.')}</p>
</Modal.Column>
</Modal.Columns>
<Expander
className='accounts--Creator-advanced'
isOpen
summary={t('Advanced creation options')}
summary={t<string>('Advanced creation options')}
>
<Modal.Columns>
<Modal.Column>
<Dropdown
defaultValue={pairType}
help={t('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')}
label={t('keypair crypto type')}
help={t<string>('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')}
label={t<string>('keypair crypto type')}
onChange={_onChangePairType}
options={uiSettings.availableCryptos}
/>
</Modal.Column>
<Modal.Column>
<p>{t('If you are moving accounts between applications, ensure that you use the correct type.')}</p>
<p>{t<string>('If you are moving accounts between applications, ensure that you use the correct type.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<Input
className='full'
help={t('You can set a custom derivation path for this account using the following syntax "/<soft-key>//<hard-key>///<password>". The "/<soft-key>" and "//<hard-key>" may be repeated and mixed`. The "///password" is optional and should only occur once.')}
help={t<string>('You can set a custom derivation path for this account using the following syntax "/<soft-key>//<hard-key>///<password>". The "/<soft-key>" and "//<hard-key>" may be repeated and mixed`. The "///password" is optional and should only occur once.')}
isError={!!deriveError}
label={t('secret derivation path')}
label={t<string>('secret derivation path')}
onChange={_onChangeDerive}
onEnter={_onCommit}
placeholder={
pairType === 'sr25519'
? t('//hard/soft///password')
: t('//hard///password')
? t<string>('//hard/soft///password')
: t<string>('//hard///password')
}
value={derivePath}
/>
@ -367,7 +367,7 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
)}
</Modal.Column>
<Modal.Column>
<p>{t('The derivation path allows you to create different accounts from the same base mnemonic.')}</p>
<p>{t<string>('The derivation path allows you to create different accounts from the same base mnemonic.')}</p>
</Modal.Column>
</Modal.Columns>
</Expander>
@ -377,7 +377,7 @@ function Create ({ className, onClose, onStatusChange, seed: propsSeed, type: pr
icon='plus'
isDisabled={!isValid}
isPrimary
label={t('Save')}
label={t<string>('Save')}
onClick={toggleConfirmation}
/>
</Modal.Actions>

8
packages/page-accounts/src/Accounts/modals/CreateConfirmation.tsx
View File

@ -18,7 +18,7 @@ function CreateConfirmation ({ address, name, onClose, onCommit }: Props): React
const { t } = useTranslation();
return (
<Modal header={t('Important notice')}>
<Modal header={t<string>('Important notice')}>
<Modal.Content>
<AddressRow
defaultName={name}
@ -26,15 +26,15 @@ function CreateConfirmation ({ address, name, onClose, onCommit }: Props): React
noDefaultNameOpacity
value={address}
>
<p>{t('We will provide you with a generated backup file after your account is created. As long as you have access to your account you can always download this file later by clicking on "Backup" button from the Accounts section.')}</p>
<p>{t('Please make sure to save this file in a secure location as it is required, together with your password, to restore your account.')}</p>
<p>{t<string>('We will provide you with a generated backup file after your account is created. As long as you have access to your account you can always download this file later by clicking on "Backup" button from the Accounts section.')}</p>
<p>{t<string>('Please make sure to save this file in a secure location as it is required, together with your password, to restore your account.')}</p>
</AddressRow>
</Modal.Content>
<Modal.Actions onCancel={onClose}>
<Button
icon='plus'
isPrimary
label={t('Create and backup account')}
label={t<string>('Create and backup account')}
onClick={onCommit}
/>
</Modal.Actions>

42
packages/page-accounts/src/Accounts/modals/Derive.tsx
View File

@ -36,7 +36,7 @@ function deriveValidate (suri: string, pairType: KeypairType): string | null {
return 'Soft derivation paths are not allowed on ed25519';
}
} catch (error) {
return error.message;
return (error as Error).message;
}
return null;
@ -61,13 +61,13 @@ function createAccount (source: KeyringPair, suri: string, name: string, passwor
downloadAccount(result);
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
return status;
}
function Derive ({ className, from, onClose }: Props): React.ReactElement {
function Derive ({ className = '', from, onClose }: Props): React.ReactElement {
const { t } = useTranslation();
const { queueAction } = useContext(StatusContext);
const [source] = useState(keyring.getPair(from));
@ -135,7 +135,7 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
return;
}
const status = createAccount(source, suri, name, password, t('created account'));
const status = createAccount(source, suri, name, password, t<string>('created account'));
toggleConfirmation();
queueAction(status);
@ -146,9 +146,9 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
const sourceStatic = (
<InputAddress
help={t('The selected account to perform the derivation on.')}
help={t<string>('The selected account to perform the derivation on.')}
isDisabled
label={t('derive root account')}
label={t<string>('derive root account')}
value={from}
/>
);
@ -156,7 +156,7 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
return (
<Modal
className={className}
header={t('Derive account from pair')}
header={t<string>('Derive account from pair')}
>
{address && isConfirmationOpen && (
<CreateConfirmation
@ -172,8 +172,8 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
{sourceStatic}
<Password
autoFocus
help={t('The password to unlock the selected account.')}
label={t('password')}
help={t<string>('The password to unlock the selected account.')}
label={t<string>('password')}
onChange={setRootPass}
value={rootPass}
/>
@ -188,35 +188,35 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
{sourceStatic}
<Input
autoFocus
help={t('You can set a custom derivation path for this account using the following syntax "/<soft-key>//<hard-key>///<password>". The "/<soft-key>" and "//<hard-key>" may be repeated and mixed`. The "///password" is optional and should only occur once.')}
label={t('derivation path')}
help={t<string>('You can set a custom derivation path for this account using the following syntax "/<soft-key>//<hard-key>///<password>". The "/<soft-key>" and "//<hard-key>" may be repeated and mixed`. The "///password" is optional and should only occur once.')}
label={t<string>('derivation path')}
onChange={setSuri}
placeholder={t('//hard/soft')}
placeholder={t<string>('//hard/soft')}
/>
<Input
className='full'
help={t('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')}
help={t<string>('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')}
isError={!isNameValid}
label={t('name')}
label={t<string>('name')}
onChange={_onChangeName}
onEnter={_onCommit}
placeholder={t('new account')}
placeholder={t<string>('new account')}
value={name}
/>
<Password
className='full'
help={t('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')}
help={t<string>('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')}
isError={!isPassValid}
label={t('password')}
label={t<string>('password')}
onChange={_onChangePass}
onEnter={_onCommit}
value={password}
/>
<Password
className='full'
help={t('Verify the password entered above.')}
help={t<string>('Verify the password entered above.')}
isError={!isPass2Valid}
label={t('password (repeat)')}
label={t<string>('password (repeat)')}
onChange={_onChangePass2}
onEnter={_onCommit}
value={password2}
@ -231,7 +231,7 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
icon='lock'
isDisabled={!rootPass}
isPrimary
label={t('Unlock')}
label={t<string>('Unlock')}
onClick={_onUnlock}
/>
)
@ -240,7 +240,7 @@ function Derive ({ className, from, onClose }: Props): React.ReactElement {
icon='plus'
isDisabled={!isValid}
isPrimary
label={t('Save')}
label={t<string>('Save')}
onClick={toggleConfirmation}
/>
)

44
packages/page-accounts/src/Accounts/modals/Identity.tsx
View File

@ -43,8 +43,8 @@ function WrapToggle ({ children, onChange, value }: WrapProps): React.ReactEleme
className='toggle-Toggle'
label={
value
? t('include value')
: t('exclude value')
? t<string>('include value')
: t<string>('exclude value')
}
onChange={onChange}
value={value}
@ -53,11 +53,11 @@ function WrapToggle ({ children, onChange, value }: WrapProps): React.ReactEleme
);
}
function Identity ({ address, className, onClose }: Props): React.ReactElement<Props> {
function Identity ({ address, className = '', onClose }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api } = useApi();
const identityOpt = useCall<Option<Registration>>(api.query.identity.identityOf, [address]);
const [info, setInfo] = useState<any>({});
const [info, setInfo] = useState<Record<string, any>>({});
const [hasEmail, setHasEmail] = useState(false);
// const [hasImg, setHasImg] = useState(false);
const [hasLegal, setHasLegal] = useState(false);
@ -104,13 +104,13 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
return (
<Modal
className={className}
header={t('Register identity')}
header={t<string>('Register identity')}
>
<Modal.Content>
<Input
autoFocus
help={t('The name that will be displayed in your accounts list.')}
label={t('display name')}
help={t<string>('The name that will be displayed in your accounts list.')}
label={t<string>('display name')}
maxLength={32}
onChange={setValDisplay}
value={valDisplay}
@ -120,9 +120,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
value={hasLegal}
>
<Input
help={t('The legal name for this identity.')}
help={t<string>('The legal name for this identity.')}
isDisabled={!hasLegal}
label={t('legal name')}
label={t<string>('legal name')}
maxLength={32}
onChange={setValLegal}
value={hasLegal ? valLegal : '<none>'}
@ -133,9 +133,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
value={hasEmail}
>
<Input
help={t('The email address associated with this identity.')}
help={t<string>('The email address associated with this identity.')}
isDisabled={!hasEmail}
label={t('email')}
label={t<string>('email')}
maxLength={32}
onChange={setValEmail}
value={hasEmail ? valEmail : '<none>'}
@ -146,9 +146,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
value={hasWeb}
>
<Input
help={t('An URL that is linked to this identity.')}
help={t<string>('An URL that is linked to this identity.')}
isDisabled={!hasWeb}
label={t('web')}
label={t<string>('web')}
maxLength={32}
onChange={setValWeb}
value={hasWeb ? valWeb : '<none>'}
@ -159,9 +159,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
value={hasTwitter}
>
<Input
help={t('The twitter name for this identity.')}
help={t<string>('The twitter name for this identity.')}
isDisabled={!hasTwitter}
label={t('twitter')}
label={t<string>('twitter')}
onChange={setValTwitter}
value={hasTwitter ? valTwitter : '<none>'}
/>
@ -171,9 +171,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
value={hasRiot}
>
<Input
help={t('a riot name linked to this identity')}
help={t<string>('a riot name linked to this identity')}
isDisabled={!hasRiot}
label={t('riot name')}
label={t<string>('riot name')}
maxLength={32}
onChange={setValRiot}
value={hasRiot ? valRiot : '<none>'}
@ -186,9 +186,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
<Input
isDisabled={!hasImg}
isError={hasImg && errImg}
label={t('sha2 image hash')}
label={t<string>('sha2 image hash')}
onChange={_onChangeImg}
placeholder={t('0x...')}
placeholder={t<string>('0x...')}
maxLength={66}
value={hasImg ? valImg : '<none>'}
/>
@ -200,9 +200,9 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
<Input
isDisabled={!hasPgp}
isError={hasPgp && errPgp}
label={t('pgp hash')}
label={t<string>('pgp hash')}
onChange={_onChangePgp}
placeholder={t('0x...')}
placeholder={t<string>('0x...')}
maxLength={42}
value={hasPgp ? valPgp : '<none>'}
/>
@ -213,7 +213,7 @@ function Identity ({ address, className, onClose }: Props): React.ReactElement<P
accountId={address}
icon='send'
isPrimary
label={t('Set Identity')}
label={t<string>('Set Identity')}
onStart={onClose}
params={[info]}
tx='identity.setIdentity'

26
packages/page-accounts/src/Accounts/modals/Import.tsx
View File

@ -32,7 +32,7 @@ const acceptedFormats = ['application/json', 'text/plain'].join(', ');
function parseFile (file: Uint8Array): FileState {
try {
const json = JSON.parse(u8aToString(file));
const json = JSON.parse(u8aToString(file)) as KeyringPair$Json;
const publicKey = keyring.decodeAddress(json.address, true);
const address = keyring.encodeAddress(publicKey);
const isFileValid = publicKey.length === 32 && isHex(json.encoded) && isObject(json.meta) && (
@ -49,7 +49,7 @@ function parseFile (file: Uint8Array): FileState {
return { address: null, isFileValid: false, json: null };
}
function Import ({ className, onClose, onStatusChange }: Props): React.ReactElement<Props> {
function Import ({ className = '', onClose, onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [{ address, isFileValid, json }, setFile] = useState<FileState>({ address: null, isFileValid: false, json: null });
const [{ isPassValid, password }, setPass] = useState<PassState>({ isPassValid: false, password: '' });
@ -80,14 +80,14 @@ function Import ({ className, onClose, onStatusChange }: Props): React.ReactElem
status.status = pair ? 'success' : 'error';
status.account = address;
status.message = t('account restored');
status.message = t<string>('account restored');
InputAddress.setLastValue('account', address);
} catch (error) {
setPass((state: PassState) => ({ ...state, isPassValid: false }));
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
console.error(error);
}
@ -103,14 +103,14 @@ function Import ({ className, onClose, onStatusChange }: Props): React.ReactElem
return (
<Modal
className={className}
header={t('Add via backup file')}
header={t<string>('Add via backup file')}
size='large'
>
<Modal.Content>
<Modal.Columns>
<Modal.Column>
<AddressRow
defaultName={isFileValid && json ? json.meta.name : null}
defaultName={(isFileValid && json?.meta.name as string) || null}
noDefaultNameOpacity
value={isFileValid && address ? address : null}
/>
@ -121,15 +121,15 @@ function Import ({ className, onClose, onStatusChange }: Props): React.ReactElem
<InputFile
accept={acceptedFormats}
className='full'
help={t('Select the JSON key file that was downloaded when you created the account. This JSON file contains your private key encrypted with your password.')}
help={t<string>('Select the JSON key file that was downloaded when you created the account. This JSON file contains your private key encrypted with your password.')}
isError={!isFileValid}
label={t('backup file')}
label={t<string>('backup file')}
onChange={_onChangeFile}
withLabel
/>
</Modal.Column>
<Modal.Column>
<p>{t('Supply a backed-up JSON file, encrypted with your account-specific password.')}</p>
<p>{t<string>('Supply a backed-up JSON file, encrypted with your account-specific password.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
@ -137,16 +137,16 @@ function Import ({ className, onClose, onStatusChange }: Props): React.ReactElem
<Password
autoFocus
className='full'
help={t('Type the password chosen at the account creation. It was used to encrypt your account\'s private key in the backup file.')}
help={t<string>('Type the password chosen at the account creation. It was used to encrypt your account\'s private key in the backup file.')}
isError={!isPassValid}
label={t('password')}
label={t<string>('password')}
onChange={_onChangePass}
onEnter={_onSave}
value={password}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The password previously used to encrypt this account.')}</p>
<p>{t<string>('The password previously used to encrypt this account.')}</p>
</Modal.Column>
</Modal.Columns>
</Modal.Content>
@ -155,7 +155,7 @@ function Import ({ className, onClose, onStatusChange }: Props): React.ReactElem
icon='sync'
isDisabled={!isFileValid || !isPassValid}
isPrimary
label={t('Restore')}
label={t<string>('Restore')}
onClick={_onSave}
/>
</Modal.Actions>

20
packages/page-accounts/src/Accounts/modals/MultisigApprove.tsx
View File

@ -23,7 +23,7 @@ interface Option {
value: string;
}
function MultisigApprove ({ className, onClose, ongoing, threshold, who }: Props): React.ReactElement<Props> {
function MultisigApprove ({ className = '', onClose, ongoing, threshold, who }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [hash, setHash] = useState<string | null>(ongoing[0][0].toHex());
const [multisig, setMultisig] = useState<[H256, Multisig] | null>(null);
@ -31,8 +31,8 @@ function MultisigApprove ({ className, onClose, ongoing, threshold, who }: Props
const [type, setType] = useState<string | null>('aye');
const calltypes = useMemo<Option[]>(
() => [
{ text: t('Approve this call hash'), value: 'aye' },
{ text: t('Cancel this call hash'), value: 'nay' }
{ text: t<string>('Approve this call hash'), value: 'aye' },
{ text: t<string>('Cancel this call hash'), value: 'nay' }
],
[t]
);
@ -50,25 +50,25 @@ function MultisigApprove ({ className, onClose, ongoing, threshold, who }: Props
return (
<Modal
className={className}
header={t('Pending call hashes')}
header={t<string>('Pending call hashes')}
>
<Modal.Content>
<InputAddress
filter={who}
help={t('The signatory to send the approval/cancel from')}
label={t('signatory')}
help={t<string>('The signatory to send the approval/cancel from')}
label={t<string>('signatory')}
onChange={setSignatory}
/>
<Dropdown
help={t('The call hashes that have not been executed as of yet.')}
label={t('pending hashes')}
help={t<string>('The call hashes that have not been executed as of yet.')}
label={t<string>('pending hashes')}
onChange={setHash}
options={hashes}
value={hash}
/>
<Dropdown
help={t('Either approve or reject this call.')}
label={t('approval type')}
help={t<string>('Either approve or reject this call.')}
label={t<string>('approval type')}
onChange={setType}
options={calltypes}
value={type}

34
packages/page-accounts/src/Accounts/modals/MultisigCreate.tsx
View File

@ -40,13 +40,13 @@ function createAccount (signatories: string[], threshold: BN | number, { genesis
status.message = success;
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
return status;
}
function Multisig ({ className, onClose, onStatusChange }: Props): React.ReactElement<Props> {
function Multisig ({ className = '', onClose, onStatusChange }: Props): React.ReactElement<Props> {
const { api, isDevelopment } = useApi();
const { t } = useTranslation();
const availableSignatories = useKnownAddresses();
@ -57,7 +57,7 @@ function Multisig ({ className, onClose, onStatusChange }: Props): React.ReactEl
const _createMultisig = useCallback(
(): void => {
const options = { genesisHash: isDevelopment ? undefined : api.genesisHash.toString(), name: name.trim() };
const status = createAccount(signatories, threshold, options, t('created multisig'));
const status = createAccount(signatories, threshold, options, t<string>('created multisig'));
onStatusChange(status);
onClose();
@ -81,7 +81,7 @@ function Multisig ({ className, onClose, onStatusChange }: Props): React.ReactEl
return (
<Modal
className={className}
header={t('Add multisig')}
header={t<string>('Add multisig')}
size='large'
>
<Modal.Content>
@ -90,45 +90,45 @@ function Multisig ({ className, onClose, onStatusChange }: Props): React.ReactEl
<Input
autoFocus
className='full'
help={t('Name given to this multisig. You can edit it at any later point in time.')}
help={t<string>('Name given to this multisig. You can edit it at any later point in time.')}
isError={!isNameValid}
label={t('name')}
label={t<string>('name')}
onChange={_onChangeName}
placeholder={t('multisig name')}
placeholder={t<string>('multisig name')}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The name is for unique identification of the account in your owner lists.')}</p>
<p>{t<string>('The name is for unique identification of the account in your owner lists.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputAddressMulti
available={availableSignatories}
availableLabel={t('available signatories')}
help={t('The addresses that are able to approve multisig transactions. You can select up to {{maxHelpers}} trusted addresses.', { replace: { maxHelpers: MAX_SIGNATORIES } })}
availableLabel={t<string>('available signatories')}
help={t<string>('The addresses that are able to approve multisig transactions. You can select up to {{maxHelpers}} trusted addresses.', { replace: { maxHelpers: MAX_SIGNATORIES } })}
maxCount={MAX_SIGNATORIES}
onChange={setSignatories}
value={signatories}
valueLabel={t('selected signatories')}
valueLabel={t<string>('selected signatories')}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The signatories has the ability to create transactions using the multisig and approve transactions sent by others.Once the threshold is reached with approvals, the multisig transaction is enacted on-chain.')}</p>
<p>{t('Since the multisig function like any other account, once created it is available for selection anywhere accounts are used and needs to be funded before use.')}</p>
<p>{t<string>('The signatories has the ability to create transactions using the multisig and approve transactions sent by others.Once the threshold is reached with approvals, the multisig transaction is enacted on-chain.')}</p>
<p>{t<string>('Since the multisig function like any other account, once created it is available for selection anywhere accounts are used and needs to be funded before use.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputNumber
help={t('The threshold for this multisig')}
help={t<string>('The threshold for this multisig')}
isError={!isThresholdValid}
label={t('threshold')}
label={t<string>('threshold')}
onChange={_onChangeThreshold}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The threshold for approval should be less or equal to the number of signatories for this multisig.')}</p>
<p>{t<string>('The threshold for approval should be less or equal to the number of signatories for this multisig.')}</p>
</Modal.Column>
</Modal.Columns>
</Modal.Content>
@ -137,7 +137,7 @@ function Multisig ({ className, onClose, onStatusChange }: Props): React.ReactEl
icon='plus'
isDisabled={!isValid}
isPrimary
label={t('Create')}
label={t<string>('Create')}
onClick={_createMultisig}
/>
</Modal.Actions>

16
packages/page-accounts/src/Accounts/modals/Qr.tsx
View File

@ -22,7 +22,7 @@ interface Props extends ModalProps {
className?: string;
}
function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactElement<Props> {
function QrModal ({ className = '', onClose, onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const [{ isNameValid, name }, setName] = useState({ isNameValid: false, name: '' });
const [scanned, setScanned] = useState<Scanned | null>(null);
@ -57,7 +57,7 @@ function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactEle
onStatusChange({
account: address,
action: 'create',
message: t('created account'),
message: t<string>('created account'),
status: 'success'
});
onClose();
@ -68,7 +68,7 @@ function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactEle
return (
<Modal
className={className}
header={t('Add account via Qr')}
header={t<string>('Add account via Qr')}
size='large'
>
<Modal.Content>
@ -89,16 +89,16 @@ function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactEle
<Input
autoFocus
className='full'
help={t('Name given to this account. You can change it at any point in the future.')}
help={t<string>('Name given to this account. You can change it at any point in the future.')}
isError={!isNameValid}
label={t('name')}
label={t<string>('name')}
onChange={_onNameChange}
onEnter={_onSave}
value={name}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The local name for this account. Changing this does not affect your on-line identity, so this is only used to indicate the name of the account locally.')}</p>
<p>{t<string>('The local name for this account. Changing this does not affect your on-line identity, so this is only used to indicate the name of the account locally.')}</p>
</Modal.Column>
</Modal.Columns>
</>
@ -111,7 +111,7 @@ function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactEle
</div>
</Modal.Column>
<Modal.Column>
<p>{t('Provide the account QR from the module/external application for scanning. One detected as valid, you will be taken to the next step to add the account to your list.')}</p>
<p>{t<string>('Provide the account QR from the module/external application for scanning. One detected as valid, you will be taken to the next step to add the account to your list.')}</p>
</Modal.Column>
</Modal.Columns>
)
@ -122,7 +122,7 @@ function QrModal ({ className, onClose, onStatusChange }: Props): React.ReactEle
icon='sign-in'
isDisabled={!scanned || !isNameValid}
isPrimary
label={t('Create')}
label={t<string>('Create')}
onClick={_onSave}
/>
</Modal.Actions>

12
packages/page-accounts/src/Accounts/modals/RecoverAccount.tsx
View File

@ -13,24 +13,24 @@ interface Props {
onClose: () => void;
}
function RecoverAccount ({ address, className, onClose }: Props): React.ReactElement {
function RecoverAccount ({ address, className = '', onClose }: Props): React.ReactElement {
const { t } = useTranslation();
const [recover, setRecover] = useState<string | null>(null);
return (
<Modal
className={className}
header={t('Initiate account recovery')}
header={t<string>('Initiate account recovery')}
>
<Modal.Content>
<InputAddress
isDisabled
label={t('the account to recover to')}
label={t<string>('the account to recover to')}
value={address}
/>
<InputAddress
help={t('Select the account you wish to recover into this account.')}
label={t('recover this account')}
help={t<string>('Select the account you wish to recover into this account.')}
label={t<string>('recover this account')}
onChange={setRecover}
type='allPlus'
/>
@ -40,7 +40,7 @@ function RecoverAccount ({ address, className, onClose }: Props): React.ReactEle
accountId={address}
icon='recycle'
isDisabled={!recover || recover === address}
label={t('Start recovery')}
label={t<string>('Start recovery')}
onStart={onClose}
params={[recover]}
tx='recovery.initiateRecovery'

30
packages/page-accounts/src/Accounts/modals/RecoverSetup.tsx
View File

@ -17,7 +17,7 @@ interface Props {
const MAX_HELPERS = 16;
function RecoverSetup ({ address, className, onClose }: Props): React.ReactElement {
function RecoverSetup ({ address, className = '', onClose }: Props): React.ReactElement {
const { t } = useTranslation();
const availableHelpers = useKnownAddresses(address);
const [delay, setDelay] = useState<BN | undefined>();
@ -31,7 +31,7 @@ function RecoverSetup ({ address, className, onClose }: Props): React.ReactEleme
return (
<Modal
className={className}
header={t('Setup account as recoverable')}
header={t<string>('Setup account as recoverable')}
size='large'
>
<Modal.Content>
@ -39,49 +39,49 @@ function RecoverSetup ({ address, className, onClose }: Props): React.ReactEleme
<Modal.Column>
<InputAddress
isDisabled
label={t('the account to make recoverable')}
label={t<string>('the account to make recoverable')}
value={address}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The recoverable account is protected against the loss of seed/access by a social process.')}</p>
<p>{t<string>('The recoverable account is protected against the loss of seed/access by a social process.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputAddressMulti
available={availableHelpers}
availableLabel={t('available social recovery helpers')}
help={t('The addresses that are able to help in recovery. You can select up to {{maxHelpers}} trusted helpers.', { replace: { maxHelpers: MAX_HELPERS } })}
availableLabel={t<string>('available social recovery helpers')}
help={t<string>('The addresses that are able to help in recovery. You can select up to {{maxHelpers}} trusted helpers.', { replace: { maxHelpers: MAX_HELPERS } })}
maxCount={MAX_HELPERS}
onChange={setHelpers}
value={helpers}
valueLabel={t('trusted social recovery helpers')}
valueLabel={t<string>('trusted social recovery helpers')}
/>
</Modal.Column>
<Modal.Column>
<p>{t('These are trusted individuals that can verify and approve any recovery actions. With recovery, once the threshold is reached, the funds associated with the account can be moved to a new destination.')}</p>
<p>{t('The helpers should be able to verify, via an off-chain mechanism, that the account owner indeed wishes to recover access and as such provide any approvals. In the cases of malicious recovery procedures, they will have the power to stop it.')}</p>
<p>{t<string>('These are trusted individuals that can verify and approve any recovery actions. With recovery, once the threshold is reached, the funds associated with the account can be moved to a new destination.')}</p>
<p>{t<string>('The helpers should be able to verify, via an off-chain mechanism, that the account owner indeed wishes to recover access and as such provide any approvals. In the cases of malicious recovery procedures, they will have the power to stop it.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputNumber
help={t('The threshold of vouches that is to be reached for the account to be recovered.')}
help={t<string>('The threshold of vouches that is to be reached for the account to be recovered.')}
isError={isErrorThreshold}
label={t('recovery threshold')}
label={t<string>('recovery threshold')}
onChange={setThreshold}
/>
<InputNumber
help={t('The delay between vouching and the availability of the recovered account.')}
help={t<string>('The delay between vouching and the availability of the recovered account.')}
isError={isErrorDelay}
isZeroable
label={t('recovery block delay')}
label={t<string>('recovery block delay')}
onChange={setDelay}
/>
</Modal.Column>
<Modal.Column>
<p>{t('The threshold for approvals and the delay is the protection associated with the account. The delay should be such that any colluding recovery attempts does have a window to stop.')}</p>
<p>{t<string>('The threshold for approvals and the delay is the protection associated with the account. The delay should be such that any colluding recovery attempts does have a window to stop.')}</p>
</Modal.Column>
</Modal.Columns>
</Modal.Content>
@ -90,7 +90,7 @@ function RecoverSetup ({ address, className, onClose }: Props): React.ReactEleme
accountId={address}
icon='share alternate'
isDisabled={isErrorHelpers || isErrorThreshold || isErrorDelay}
label={t('Make recoverable')}
label={t<string>('Make recoverable')}
onStart={onClose}
params={[helpers, threshold, delay]}
tx='recovery.createRecovery'

30
packages/page-accounts/src/Accounts/modals/Transfer.tsx
View File

@ -18,7 +18,7 @@ interface Props {
senderId?: string;
}
function Transfer ({ className, onClose, recipientId: propRecipientId, senderId: propSenderId }: Props): React.ReactElement<Props> {
function Transfer ({ className = '', onClose, recipientId: propRecipientId, senderId: propSenderId }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api } = useApi();
const [amount, setAmount] = useState<BN | undefined>(new BN(0));
@ -27,12 +27,12 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId:
const [recipientId, setRecipientId] = useState<string | null>(propRecipientId || null);
const [senderId, setSenderId] = useState<string | null>(propSenderId || null);
const transferrable = <span className='label'>{t('transferrable')}</span>;
const transferrable = <span className='label'>{t<string>('transferrable')}</span>;
return (
<Modal
className='app--accounts-Modal'
header={t('Send funds')}
header={t<string>('Send funds')}
size='large'
>
<Modal.Content>
@ -41,9 +41,9 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId:
<Modal.Column>
<InputAddress
defaultValue={propSenderId}
help={t('The account you will send funds from.')}
help={t<string>('The account you will send funds from.')}
isDisabled={!!propSenderId}
label={t('send from account')}
label={t<string>('send from account')}
labelExtra={
<Available
label={transferrable}
@ -55,16 +55,16 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId:
/>
</Modal.Column>
<Modal.Column>
<p>{t('The transferred balance will be subtracted (along with fees) from the sender account.')}</p>
<p>{t<string>('The transferred balance will be subtracted (along with fees) from the sender account.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputAddress
defaultValue={propRecipientId}
help={t('Select a contact or paste the address you want to send funds to.')}
help={t<string>('Select a contact or paste the address you want to send funds to.')}
isDisabled={!!propRecipientId}
label={t('send to address')}
label={t<string>('send to address')}
labelExtra={
<Available
label={transferrable}
@ -76,30 +76,30 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId:
/>
</Modal.Column>
<Modal.Column>
<p>{t('The beneficiary will have access to the transferred fees when the transaction is included in a block.')}</p>
<p>{t<string>('The beneficiary will have access to the transferred fees when the transaction is included in a block.')}</p>
</Modal.Column>
</Modal.Columns>
<Modal.Columns>
<Modal.Column>
<InputBalance
autoFocus
help={t('Type the amount you want to transfer. Note that you can select the unit on the right e.g sending 1 milli is equivalent to sending 0.001.')}
help={t<string>('Type the amount you want to transfer. Note that you can select the unit on the right e.g sending 1 milli is equivalent to sending 0.001.')}
isError={!hasAvailable}
isZeroable
label={t('amount')}
label={t<string>('amount')}
maxValue={maxBalance}
onChange={setAmount}
withMax
/>
<InputBalance
defaultValue={api.consts.balances.existentialDeposit}
help={t('The minimum amount that an account should have to be deemed active')}
help={t<string>('The minimum amount that an account should have to be deemed active')}
isDisabled
label={t('existential deposit')}
label={t<string>('existential deposit')}
/>
</Modal.Column>
<Modal.Column>
<p>{t('If the recipient account is new, the balance needs to be more than the existential deposit. Likewise if the sending account balance drops below the same value, the account will be removed from the state.')}</p>
<p>{t<string>('If the recipient account is new, the balance needs to be more than the existential deposit. Likewise if the sending account balance drops below the same value, the account will be removed from the state.')}</p>
</Modal.Column>
</Modal.Columns>
</div>
@ -110,7 +110,7 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId:
icon='send'
isDisabled={!hasAvailable || !recipientId || !amount}
isPrimary
label={t('Make Transfer')}
label={t<string>('Make Transfer')}
onStart={onClose}
params={[recipientId, amount]}
tx='balances.transfer'

16
packages/page-accounts/src/Contacts/Address.tsx
View File

@ -28,7 +28,7 @@ const WITH_BALANCE = { available: true, bonded: true, free: true, locked: true,
const isEditable = true;
function Address ({ address, className, filter, isFavorite, toggleFavorite }: Props): React.ReactElement<Props> | null {
function Address ({ address, className = '', filter, isFavorite, toggleFavorite }: Props): React.ReactElement<Props> | null {
const { t } = useTranslation();
const api = useApi();
const info = useCall<DeriveAccountInfo>(api.api.derive.accounts.info, [address]);
@ -70,7 +70,7 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
useEffect((): void => {
const account = keyring.getAddress(address);
_setTags(account?.meta?.tags || []);
_setTags(account?.meta?.tags as string[] || []);
setAccName(account?.meta?.name || '');
}, [_setTags, address]);
@ -132,10 +132,10 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
try {
keyring.forgetAddress(address);
status.status = 'success';
status.message = t('address forgotten');
status.message = t<string>('address forgotten');
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
}
},
@ -150,7 +150,7 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
<tr className={className}>
<td className='favorite'>
<Icon
className={`${isFavorite && 'isSelected isColorHighlight'}`}
className={`${isFavorite ? 'isSelected isColorHighlight' : ''}`}
name={isFavorite ? 'star' : 'star outline'}
onClick={_onFavorite}
/>
@ -203,9 +203,9 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
<Button
icon='paper plane'
key='deposit'
label={t('deposit')}
label={t<string>('deposit')}
onClick={_toggleTransfer}
tooltip={t('Send funds to this address')}
tooltip={t<string>('Send funds to this address')}
/>
<Popup
className='theme--default'
@ -227,7 +227,7 @@ function Address ({ address, className, filter, isFavorite, toggleFavorite }: Pr
disabled={!isEditable}
onClick={_toggleForget}
>
{t('Forget this address')}
{t<string>('Forget this address')}
</Menu.Item>
{!api.isDevelopment && (
<>

8
packages/page-accounts/src/Contacts/index.tsx
View File

@ -17,7 +17,7 @@ type SortedAddress = { address: string; isFavorite: boolean };
const STORE_FAVS = 'accounts:favorites';
function Overview ({ className, onStatusChange }: Props): React.ReactElement<Props> {
function Overview ({ className = '', onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { allAddresses } = useAddresses();
const [isCreateOpen, toggleCreate] = useToggle(false);
@ -53,7 +53,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
<Input
autoFocus
isFull
label={t('filter by name or tags')}
label={t<string>('filter by name or tags')}
onChange={setFilter}
value={filterOn}
/>
@ -65,7 +65,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
<Button.Group>
<Button
icon='add'
label={t('Add contact')}
label={t<string>('Add contact')}
onClick={toggleCreate}
/>
</Button.Group>
@ -76,7 +76,7 @@ function Overview ({ className, onStatusChange }: Props): React.ReactElement<Pro
/>
)}
<Table
empty={t('no addresses saved yet, add any existing address')}
empty={t<string>('no addresses saved yet, add any existing address')}
filter={filter}
header={header}
>

20
packages/page-accounts/src/Contacts/modals/Create.tsx
View File

@ -70,13 +70,13 @@ function Create ({ onClose, onStatusChange }: Props): React.ReactElement<Props>
status.account = address;
status.status = address ? 'success' : 'error';
status.message = isAddressExisting
? t('address edited')
: t('address created');
? t<string>('address edited')
: t<string>('address created');
InputAddress.setLastValue('address', address);
} catch (error) {
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
onStatusChange(status);
@ -86,7 +86,7 @@ function Create ({ onClose, onStatusChange }: Props): React.ReactElement<Props>
);
return (
<Modal header={t('Add an address')}>
<Modal header={t<string>('Add an address')}>
<Modal.Content>
<AddressRow
defaultName={name}
@ -96,19 +96,19 @@ function Create ({ onClose, onStatusChange }: Props): React.ReactElement<Props>
<Input
autoFocus
className='full'
help={t('Paste here the address of the contact you want to add to your address book.')}
help={t<string>('Paste here the address of the contact you want to add to your address book.')}
isError={!isAddressValid}
label={t('address')}
label={t<string>('address')}
onChange={_onChangeAddress}
onEnter={_onCommit}
placeholder={t('new address')}
placeholder={t<string>('new address')}
value={address}
/>
<Input
className='full'
help={t('Type the name of your contact. This name will be used across all the apps. It can be edited later on.')}
help={t<string>('Type the name of your contact. This name will be used across all the apps. It can be edited later on.')}
isError={!isNameValid}
label={t('name')}
label={t<string>('name')}
onChange={_onChangeName}
onEnter={_onCommit}
value={name}
@ -120,7 +120,7 @@ function Create ({ onClose, onStatusChange }: Props): React.ReactElement<Props>
icon='save'
isDisabled={!isValid}
isPrimary
label={t('Save')}
label={t<string>('Save')}
onClick={_onCommit}
/>
</Modal.Actions>

16
packages/page-accounts/src/Sidebar/Flags.tsx
View File

@ -28,14 +28,14 @@ function Flags ({ flags: { isCouncil, isDevelopment, isExternal, isInjected, isM
? (
<Tag
color='green'
label={t('Multisig')}
label={t<string>('Multisig')}
size='tiny'
/>
)
: (
<Tag
color='grey'
label={t('External')}
label={t<string>('External')}
size='tiny'
/>
)
@ -43,42 +43,42 @@ function Flags ({ flags: { isCouncil, isDevelopment, isExternal, isInjected, isM
{isInjected && (
<Tag
color='grey'
label={t('Injected')}
label={t<string>('Injected')}
size='tiny'
/>
)}
{isDevelopment && (
<Tag
color='grey'
label={t('Test account')}
label={t<string>('Test account')}
size='tiny'
/>
)}
{isCouncil && (
<Tag
color='blue'
label={t('Council')}
label={t<string>('Council')}
size='tiny'
/>
)}
{isSociety && (
<Tag
color='green'
label={t('Society')}
label={t<string>('Society')}
size='tiny'
/>
)}
{isTechCommittee && (
<Tag
color='orange'
label={t('Technical committee')}
label={t<string>('Technical committee')}
size='tiny'
/>
)}
{isSudo && (
<Tag
color='pink'
label={t('Sudo key')}
label={t<string>('Sudo key')}
size='tiny'
/>
)}

24
packages/page-accounts/src/Sidebar/Identity.tsx
View File

@ -34,7 +34,7 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
<div>
<Icon name='address card' />
&nbsp;
{t('identity')}
{t<string>('identity')}
</div>
<Tag
color={
@ -51,10 +51,10 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
{
identity.judgements.length
? (identity.isGood
? (identity.isKnownGood ? t('Known good') : t('Reasonable'))
: (identity.isErroneous ? t('Erroneous') : t('Low quality'))
? (identity.isKnownGood ? t<string>('Known good') : t<string>('Reasonable'))
: (identity.isErroneous ? t<string>('Erroneous') : t<string>('Low quality'))
)
: t('No judgments')
: t<string>('No judgments')
}
</>
}
@ -77,7 +77,7 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
<div className='ui--AddressMenu-identityTable'>
{identity.parent && (
<div className='tr parent'>
<div className='th'>{t('parent')}</div>
<div className='th'>{t<string>('parent')}</div>
<div className='td'>
<AddressMini
className='parent'
@ -89,13 +89,13 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
)}
{identity.email && (
<div className='tr'>
<div className='th'>{t('email')}</div>
<div className='th'>{t<string>('email')}</div>
<div className='td'>
{isHex(identity.email)
? identity.email
: (
<a
href={`mailto:${identity.email}`}
href={`mailto:${identity.email as string}`}
rel='noopener noreferrer'
target='_blank'
>
@ -107,7 +107,7 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
)}
{identity.web && (
<div className='tr'>
<div className='th'>{t('website')}</div>
<div className='th'>{t<string>('website')}</div>
<div className='td'>
{isHex(identity.web)
? identity.web
@ -125,13 +125,13 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
)}
{identity.twitter && (
<div className='tr'>
<div className='th'>{t('twitter')}</div>
<div className='th'>{t<string>('twitter')}</div>
<div className='td'>
{isHex(identity.twitter)
? identity.twitter
: (
<a
href={`https://twitter.com/${identity.twitter}`}
href={`https://twitter.com/${identity.twitter as string}`}
rel='noopener noreferrer'
target='_blank'
>
@ -143,7 +143,7 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
)}
{identity.riot && (
<div className='tr'>
<div className='th'>{t('riot')}</div>
<div className='th'>{t<string>('riot')}</div>
<div className='td'>
{identity.riot}
</div>
@ -159,7 +159,7 @@ function Identity ({ address, identity }: Props): React.ReactElement<Props> | nu
<li>
<IconLink
icon='address card'
label={t('Add identity judgment')}
label={t<string>('Add identity judgment')}
onClick={toggleIsJudgementOpen}
/>
</li>

10
packages/page-accounts/src/Sidebar/Multisig.tsx
View File

@ -29,20 +29,20 @@ function Multisig ({ isMultisig, meta }: Props): React.ReactElement<Props> | nul
<div>
<Icon name='handshake outline' />
&nbsp;
{t('multisig')}
{t<string>('multisig')}
</div>
</div>
<Static
isFull
label={t('threshold')}
label={t<string>('threshold')}
>
{threshold}/{who.length}
{threshold}/{(who as string[]).length}
</Static>
<Static
isFull
label={t('signatories')}
label={t<string>('signatories')}
>
{who?.map((address: string) => (
{(who as string[])?.map((address) => (
<AddressMini
key={address}
value={address}

12
packages/page-accounts/src/Sidebar/RegistrarJudgement.tsx
View File

@ -44,24 +44,24 @@ function RegistrarJudgement ({ address, registrars, toggleJudgement }: Props): R
return (
<Modal
header={t('Provide judgement')}
header={t<string>('Provide judgement')}
onClose={toggleJudgement}
size='small'
>
<Modal.Content>
<InputAddress
filter={addresses}
label={t('registrar account')}
label={t<string>('registrar account')}
onChange={setJudgementAccountId}
type='account'
/>
<Input
isDisabled
label={t('registrar index')}
value={registrarIndex === -1 ? t('invalid/unknown registrar account') : registrarIndex}
label={t<string>('registrar index')}
value={registrarIndex === -1 ? t<string>('invalid/unknown registrar account') : registrarIndex.toString()}
/>
<Dropdown
label={t('judgement')}
label={t<string>('judgement')}
onChange={setJudgementEnum}
options={JUDGEMENT_ENUM}
value={judgementEnum}
@ -72,7 +72,7 @@ function RegistrarJudgement ({ address, registrars, toggleJudgement }: Props): R
accountId={judgementAccountId}
icon='check'
isDisabled={registrarIndex === -1}
label={t('Judge')}
label={t<string>('Judge')}
onStart={toggleJudgement}
params={[registrarIndex, address, judgementEnum]}
tx='identity.provideJudgement'

16
packages/page-accounts/src/Sidebar/Sidebar.tsx
View File

@ -26,7 +26,7 @@ const TAG_OPTS = {
autoFocus: true
};
function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.ReactElement<Props> {
function Sidebar ({ address, className = '', onClose, onUpdateName }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { flags, identity, isEditingName, isEditingTags, meta, name, onForgetAddress, onSaveName, onSaveTags, setName, setTags, tags, toggleIsEditingName, toggleIsEditingTags } = useAccountInfo(address);
const [isHoveringButton, toggleIsHoveringButton] = useToggle();
@ -80,7 +80,7 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
/>
)
: flags.isEditable
? (name.toUpperCase() || t('<unknown>'))
? (name.toUpperCase() || t<string>('<unknown>'))
: undefined
}
value={address}
@ -121,7 +121,7 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
size='tiny'
/>
))
: <label>{t('no tags')}</label>
: <label>{t<string>('no tags')}</label>
}
</div>
)
@ -139,7 +139,7 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
<Button.Group>
<Button
icon='send'
label={t('Deposit')}
label={t<string>('Deposit')}
onClick={toggleIsTransferOpen}
/>
{flags.isOwned && (
@ -147,7 +147,7 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
className='basic'
icon='check'
isPrimary
label={t('Owned')}
label={t<string>('Owned')}
onMouseEnter={toggleIsHoveringButton}
onMouseLeave={toggleIsHoveringButton}
size='tiny'
@ -157,7 +157,7 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
<Button
icon='add'
isPositive
label={t('Save')}
label={t<string>('Save')}
onClick={_onUpdateName}
onMouseEnter={toggleIsHoveringButton}
onMouseLeave={toggleIsHoveringButton}
@ -178,12 +178,12 @@ function Sidebar ({ address, className, onClose, onUpdateName }: Props): React.R
<Button.Content visible>
<Icon name='check' />
&nbsp;
{t('Saved')}
{t<string>('Saved')}
</Button.Content>
<Button.Content hidden>
<Icon name='ban' />
&nbsp;
{t('Remove')}
{t<string>('Remove')}
</Button.Content>
</Button>
)}

2
packages/page-accounts/src/Vanity/Match.tsx
View File

@ -18,7 +18,7 @@ interface Props extends BareProps {
seed: Uint8Array;
}
function Match ({ address, className, count, offset, onCreateToggle, onRemove, seed }: Props): React.ReactElement<Props> {
function Match ({ address, className = '', count, offset, onCreateToggle, onRemove, seed }: Props): React.ReactElement<Props> {
const hexSeed = useMemo(
() => u8aToHex(seed),
[seed]

20
packages/page-accounts/src/Vanity/index.tsx
View File

@ -39,7 +39,7 @@ const BOOL_OPTIONS = [
{ text: 'Yes', value: true }
];
function VanityApp ({ className, onStatusChange }: Props): React.ReactElement<Props> {
function VanityApp ({ className = '', onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const results = useRef<GeneratorResult[]>([]);
const runningRef = useRef(false);
@ -182,19 +182,19 @@ function VanityApp ({ className, onStatusChange }: Props): React.ReactElement<Pr
<Input
autoFocus
className='medium'
help={t('Type here what you would like your address to contain. This tool will generate the keys and show the associated addresses that best match your search. You can use "?" as a wildcard for a character.')}
help={t<string>('Type here what you would like your address to contain. This tool will generate the keys and show the associated addresses that best match your search. You can use "?" as a wildcard for a character.')}
isDisabled={isRunning}
isError={!isMatchValid}
label={t('Search for')}
label={t<string>('Search for')}
onChange={_onChangeMatch}
onEnter={_toggleStart}
value={match}
/>
<Dropdown
className='medium'
help={t('Should the search be case sensitive, e.g if you select "no" your search for "Some" may return addresses containing "somE" or "sOme"...')}
help={t<string>('Should the search be case sensitive, e.g if you select "no" your search for "Some" may return addresses containing "somE" or "sOme"...')}
isDisabled={isRunning}
label={t('case sensitive')}
label={t<string>('case sensitive')}
onChange={setWithCase}
options={BOOL_OPTIONS}
value={withCase}
@ -204,8 +204,8 @@ function VanityApp ({ className, onStatusChange }: Props): React.ReactElement<Pr
<Dropdown
className='medium'
defaultValue={type}
help={t('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')}
label={t('keypair crypto type')}
help={t<string>('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')}
label={t<string>('keypair crypto type')}
onChange={setType}
options={uiSettings.availableCryptos}
/>
@ -220,8 +220,8 @@ function VanityApp ({ className, onStatusChange }: Props): React.ReactElement<Pr
isDisabled={!isMatchValid}
label={
isRunning
? t('Stop generation')
: t('Start generation')
? t<string>('Stop generation')
: t<string>('Start generation')
}
onClick={_toggleStart}
/>
@ -229,7 +229,7 @@ function VanityApp ({ className, onStatusChange }: Props): React.ReactElement<Pr
{matches.length !== 0 && (
<Table
className='vanity--App-matches'
empty={t('No matches found')}
empty={t<string>('No matches found')}
header={header}
>
{matches.map((match): React.ReactNode => (

8
packages/page-accounts/src/index.tsx
View File

@ -25,15 +25,15 @@ function AccountsApp ({ basePath, onStatusChange }: Props): React.ReactElement<P
{
isRoot: true,
name: 'overview',
text: t('My accounts')
text: t<string>('My accounts')
},
{
name: 'contacts',
text: t('My contacts')
text: t<string>('My contacts')
},
{
name: 'vanity',
text: t('Vanity generator')
text: t<string>('Vanity generator')
}
], [t]);
const hidden = useMemo(
@ -43,7 +43,7 @@ function AccountsApp ({ basePath, onStatusChange }: Props): React.ReactElement<P
return (
<main className='accounts--App'>
<HelpOverlay md={basicMd} />
<HelpOverlay md={basicMd as string} />
<header>
<Tabs
basePath={basePath}

1
packages/page-accounts/src/types.ts
View File

@ -9,7 +9,6 @@ import { WithTranslation } from 'react-i18next';
export interface BareProps {
className?: string;
style?: Record<string, any>;
}
export type I18nProps = BareProps & WithTranslation;

8
packages/page-claims/src/Claim.tsx
View File

@ -20,7 +20,7 @@ interface Props {
ethereumAddress: EthereumAddress | null;
}
function Claim ({ button, className, ethereumAddress }: Props): React.ReactElement<Props> | null {
function Claim ({ button, className = '', ethereumAddress }: Props): React.ReactElement<Props> | null {
const { t } = useTranslation();
const { api } = useApi();
const [claimValue, setClaimValue] = useState<BalanceOf | null>(null);
@ -60,19 +60,19 @@ function Claim ({ button, className, ethereumAddress }: Props): React.ReactEleme
isSuccess={!!hasClaim}
>
<div className={className}>
{t('Your Ethereum account')}
{t<string>('Your Ethereum account')}
<h3>{addrToChecksum(claimAddress.toString())}</h3>
{hasClaim && claimValue
? (
<>
{t('has a valid claim for')}
{t<string>('has a valid claim for')}
<h2><FormatBalance value={claimValue} /></h2>
<Button.Group>{button}</Button.Group>
</>
)
: (
<>
{t('does not appear to have a valid claim. Please double check that you have signed the transaction correctly on the correct ETH account.')}
{t<string>('does not appear to have a valid claim. Please double check that you have signed the transaction correctly on the correct ETH account.')}
</>
)}
</div>

16
packages/page-claims/src/index.tsx
View File

@ -115,15 +115,15 @@ class ClaimsApp extends TxModal<Props, State> {
<Columar>
<Column>
<Card withBottomMargin>
<h3>{t('1. Select your {{chain}} account', {
<h3>{t<string>('1. Select your {{chain}} account', {
replace: {
chain: systemChain
}
})}</h3>
<InputAddress
defaultValue={this.state.accountId}
help={t('The account you want to claim to.')}
label={t('claim to account')}
help={t<string>('The account you want to claim to.')}
label={t<string>('claim to account')}
onChange={this.onChangeAccount}
type='all'
/>
@ -131,7 +131,7 @@ class ClaimsApp extends TxModal<Props, State> {
<Button.Group>
<Button
icon='sign-in'
label={t('Continue')}
label={t<string>('Continue')}
onClick={this.setStep(Step.Sign)}
/>
</Button.Group>
@ -139,7 +139,7 @@ class ClaimsApp extends TxModal<Props, State> {
</Card>
{(step >= Step.Sign && !!accountId) && (
<Card>
<h3>{t('2. Sign ETH transaction')}</h3>
<h3>{t<string>('2. Sign ETH transaction')}</h3>
<CopyToClipboard
onCopy={this.onCopy}
text={payload}
@ -153,11 +153,11 @@ class ClaimsApp extends TxModal<Props, State> {
</CopyToClipboard>
<Tooltip
place='right'
text={didCopy ? t('copied') : t('click to copy')}
text={didCopy ? t<string>('copied') : t<string>('click to copy')}
trigger='tx-payload'
/>
<div>
{t('Copy the above string and sign an Ethereum transaction with the account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below')}
{t<string>('Copy the above string and sign an Ethereum transaction with the account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below')}
:
</div>
<Signature
@ -170,7 +170,7 @@ class ClaimsApp extends TxModal<Props, State> {
<Button
icon='sign-in'
isDisabled={!accountId || !signature}
label={t('Confirm claim')}
label={t<string>('Confirm claim')}
onClick={this.setStep(Step.Claim)}
/>
</Button.Group>

4
packages/page-claims/src/util.ts
View File

@ -85,7 +85,7 @@ export function recoverAddress (message: string, { recovery, signature }: Signat
// recover an address from a signature JSON (as supplied by e.g. MyCrypto)
export function recoverFromJSON (signatureJson: string | null): RecoveredSignature {
try {
const { msg, sig } = JSON.parse(signatureJson || '{}');
const { msg, sig } = JSON.parse(signatureJson || '{}') as Record<string, string>;
if (!msg || !sig) {
throw new Error('Invalid signature object');
@ -102,7 +102,7 @@ export function recoverFromJSON (signatureJson: string | null): RecoveredSignatu
console.error(error);
return {
error,
error: error as Error,
ethereumAddress: null,
signature: null
};

2
packages/page-contracts/package.json
View File

@ -12,6 +12,6 @@
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.9.6",
"@polkadot/api-contract": "^1.15.1"
"@polkadot/api-contract": "^1.16.0-beta.2"
}
}

13
packages/page-contracts/src/ABI.tsx
View File

@ -2,6 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { ContractABIPre } from '@polkadot/api-contract/types';
import { I18nProps } from '@polkadot/react-components/types';
import React from 'react';
@ -90,7 +91,7 @@ class ABI extends React.PureComponent<Props, State> {
}
private renderInputFile (): React.ReactNode {
const { className, help, isDisabled, isRequired, label, t } = this.props;
const { className = '', help, isDisabled, isRequired, label, t } = this.props;
const { errorText, isAbiValid, isEmpty, isError } = this.state;
return (
@ -105,7 +106,7 @@ class ABI extends React.PureComponent<Props, State> {
!isEmpty && !isAbiValid
? (
<>
{t('invalid ABI file selected')}
{t<string>('invalid ABI file selected')}
{!!errorText && (
<>
{' — '}
@ -114,7 +115,7 @@ class ABI extends React.PureComponent<Props, State> {
)}
</>
)
: t('click to select or drag and drop a JSON ABI file')
: t<string>('click to select or drag and drop a JSON ABI file')
}
/>
</div>
@ -152,9 +153,9 @@ class ABI extends React.PureComponent<Props, State> {
const json = u8aToString(u8a);
try {
const abi = JSON.parse(json);
const abi = JSON.parse(json) as ContractABIPre;
if (abi.deploy || abi.messages) {
if ((abi as unknown as Record<string, unknown>).deploy || (abi as unknown as Record<string, unknown>).messages) {
throw new Error(t('You are using an ABI with an outdated format. Please generate a new one.'));
}
@ -170,7 +171,7 @@ class ABI extends React.PureComponent<Props, State> {
console.error(error);
this.setState({
errorText: error,
errorText: error as string,
isAbiValid: false,
isEmpty: false,
isError: true

13
packages/page-contracts/src/CodeRow.tsx
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
import { I18nProps } from '@polkadot/react-components/types';
import { CodeStored } from '@polkadot/app-contracts/types';
@ -57,11 +57,11 @@ class CodeRow extends Row<Props, State> {
this.state = this.createState();
}
public static getDerivedStateFromProps ({ accounts_info, code: { json } }: Props, prevState: State): State | null {
public static getDerivedStateFromProps ({ accountsInfo, code: { json } }: Props, prevState: State): State | null {
const codeHash = json.codeHash || DEFAULT_HASH;
const name = json.name || DEFAULT_NAME;
const tags = json.tags || [];
const { accountId } = accounts_info || {};
const { accountId } = accountsInfo || {};
const address = accountId
? accountId.toString()
: DEFAULT_ADDR;
@ -90,13 +90,10 @@ class CodeRow extends Row<Props, State> {
}
public render (): React.ReactNode {
const { className, isInline, style } = this.props;
const { className = '', isInline } = this.props;
return (
<div
className={classes('ui--Row', isInline && 'inline', className)}
style={style}
>
<div className={classes('ui--Row', isInline && 'inline', className)}>
<div className='ui--Row-base'>
{this.renderIcon()}
<div className='ui--Row-details'>

7
packages/page-contracts/src/Codes/Add.tsx
View File

@ -39,10 +39,10 @@ class Add extends ContractModal<Props, State> {
<>
<Input
autoFocus
help={t('The code hash for the on-chain deployed code.')}
help={t<string>('The code hash for the on-chain deployed code.')}
isDisabled={isBusy}
isError={!isCodeValid}
label={t('code hash')}
label={t<string>('code hash')}
onChange={this.onChangeHash}
onEnter={this.submit}
value={codeHash}
@ -67,8 +67,9 @@ class Add extends ContractModal<Props, State> {
icon='save'
isDisabled={!isValid}
isPrimary
label={t('Save')}
label={t<string>('Save')}
onClick={this.onSave}
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
ref={this.button}
/>
);

19
packages/page-contracts/src/Codes/Code.tsx
View File

@ -17,7 +17,7 @@ import RemoveABI from '../RemoveABI';
import contracts from '../store';
import translate from '../translate';
interface Props extends I18nProps, RouteComponentProps<{}> {
interface Props extends I18nProps, RouteComponentProps {
code: CodeStored;
showDeploy: (codeHash?: string, constructorIndex?: number) => () => void;
}
@ -69,7 +69,7 @@ class Code extends React.PureComponent<Props, State> {
<Expander
isOpen={isAbiOpen}
onClick={this.toggleAbi}
summary={t('ABI')}
summary={t<string>('ABI')}
>
{abi}
</Expander>
@ -90,14 +90,14 @@ class Code extends React.PureComponent<Props, State> {
icon='trash'
isNegative
onClick={this.toggleForget}
tooltip={t('Forget this code hash')}
tooltip={t<string>('Forget this code hash')}
/>
<Button
icon='cloud upload'
isPrimary
label={t('deploy')}
label={t<string>('deploy')}
onClick={showDeploy(codeHash)}
tooltip={t('Deploy this code hash as a smart contract')}
tooltip={t<string>('Deploy this code hash as a smart contract')}
/>
</>
);
@ -125,8 +125,8 @@ class Code extends React.PureComponent<Props, State> {
code={code || ''}
isInline
>
<p>{t('You are about to remove this code from your list of available code hashes. Once completed, should you need to access it again, you will have to manually add the code hash again.')}</p>
<p>{t('This operation does not remove the uploaded code WASM and ABI from the chain, nor any deployed contracts. The forget operation only limits your access to the code on this browser.')}</p>
<p>{t<string>('You are about to remove this code from your list of available code hashes. Once completed, should you need to access it again, you will have to manually add the code hash again.')}</p>
<p>{t<string>('This operation does not remove the uploaded code WASM and ABI from the chain, nor any deployed contracts. The forget operation only limits your access to the code on this browser.')}</p>
</CodeRow>
</Forget>
);
@ -201,10 +201,7 @@ class Code extends React.PureComponent<Props, State> {
this.setState(
{ isAbiOpen: true },
(): void => {
contracts.saveCode(
codeHash,
{ abi }
);
contracts.saveCode(codeHash, { abi }).catch(console.error);
}
);
}

10
packages/page-contracts/src/Codes/Upload.tsx
View File

@ -42,7 +42,7 @@ class Upload extends ContractModal<Props, State> {
wasm: null
};
this.state = this.defaultState;
this.headerText = t('Upload WASM');
this.headerText = t<string>('Upload WASM');
}
protected renderContent = (): React.ReactNode => {
@ -53,14 +53,14 @@ class Upload extends ContractModal<Props, State> {
<>
{this.renderInputAccount()}
<InputFile
help={t('The compiled WASM for the contract that you wish to deploy. Each unique code blob will be attached with a code hash that can be used to create new instances.')}
help={t<string>('The compiled WASM for the contract that you wish to deploy. Each unique code blob will be attached with a code hash that can be used to create new instances.')}
isDisabled={isBusy}
isError={!isWasmValid}
label={t('compiled contract WASM')}
label={t<string>('compiled contract WASM')}
onChange={this.onAddWasm}
placeholder={
wasm && !isWasmValid
? t('The code is not recognized as being in valid WASM format')
? t<string>('The code is not recognized as being in valid WASM format')
: null
}
/>
@ -82,7 +82,7 @@ class Upload extends ContractModal<Props, State> {
icon='upload'
isDisabled={!isValid}
isPrimary
label={t('Upload')}
label={t<string>('Upload')}
onClick={this.toggleBusy(true)}
onFailed={this.toggleBusy(false)}
onSuccess={this.onSuccess}

6
packages/page-contracts/src/Codes/ValidateCode.tsx
View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
/* eslint-disable @typescript-eslint/camelcase */
/* eslint-disable camelcase */
import { PrefabWasmModule } from '@polkadot/types/interfaces';
import { I18nProps } from '@polkadot/react-components/types';
@ -62,8 +62,8 @@ class ValidateCode extends React.PureComponent<Props, State> {
<InfoForInput type='error'>
{
isValidHex
? t('Unable to find on-chain WASM code for the supplied codeHash')
: t('The codeHash is not a valid hex hash')
? t<string>('Unable to find on-chain WASM code for the supplied codeHash')
: t<string>('The codeHash is not a valid hex hash')
}
</InfoForInput>
);

6
packages/page-contracts/src/Codes/index.tsx
View File

@ -39,17 +39,17 @@ class Codes extends React.PureComponent<Props, State> {
<Button.Group>
<Button
icon='upload'
label={t('Upload WASM')}
label={t<string>('Upload WASM')}
onClick={this.showUpload}
/>
<Button
icon='add'
label={t('Add an existing code hash')}
label={t<string>('Add an existing code hash')}
onClick={this.showAdd}
/>
</Button.Group>
}
emptyText={t('No code hashes available')}
emptyText={t<string>('No code hashes available')}
>
{contracts.getAllCode().map((code): React.ReactNode => {
return (

8
packages/page-contracts/src/Contracts/Add.tsx
View File

@ -51,10 +51,10 @@ class Add extends ContractModal<Props, State> {
>
<Input
autoFocus
help={t('The address for the deployed contract instance.')}
help={t<string>('The address for the deployed contract instance.')}
isDisabled={isBusy}
isError={!isAddressValid}
label={t('contract address')}
label={t<string>('contract address')}
onChange={this.onChangeAddress}
onEnter={this.submit}
value={address || ''}
@ -79,7 +79,7 @@ class Add extends ContractModal<Props, State> {
icon='save'
isDisabled={!isValid}
isPrimary
label={t('Save')}
label={t<string>('Save')}
onClick={this.onAdd}
/>
);
@ -123,7 +123,7 @@ class Add extends ContractModal<Props, State> {
console.error(error);
status.status = 'error';
status.message = error.message;
status.message = (error as Error).message;
}
}
}

45
packages/page-contracts/src/Contracts/Call.tsx
View File

@ -31,7 +31,7 @@ interface Props extends BareProps {
function Call (props: Props): React.ReactElement<Props> | null {
const { t } = useTranslation();
const { callContract, callMessageIndex, className, isOpen, onChangeCallContractAddress, onChangeCallMessageIndex, onClose } = props;
const { callContract, callMessageIndex, className = '', isOpen, onChangeCallContractAddress, onChangeCallMessageIndex, onClose } = props;
const hasRpc = callContract?.hasRpcContractsCall;
const callMessage = callContract?.getMessage(isNull(callMessageIndex) ? undefined : callMessageIndex);
@ -95,11 +95,10 @@ function Call (props: Props): React.ReactElement<Props> | null {
callContract
.call('rpc', callMessage.def.name, endowment, gasLimit, ...params)
.send(accountId)
.then(
(outcome: ContractCallOutcome): void => {
setOutcomes([outcome, ...outcomes]);
}
);
.then((outcome: ContractCallOutcome): void => {
setOutcomes([outcome, ...outcomes]);
})
.catch(console.error);
};
const _onClearOutcomes = (): void => setOutcomes([]);
@ -115,7 +114,7 @@ function Call (props: Props): React.ReactElement<Props> | null {
return (
<Modal
className={[className || '', 'app--contracts-Modal'].join(' ')}
header={t('Call a contract')}
header={t<string>('Call a contract')}
onClose={onClose}
open={isOpen}
>
@ -124,17 +123,17 @@ function Call (props: Props): React.ReactElement<Props> | null {
<div className='contracts--CallControls'>
<InputAddress
defaultValue={accountId}
help={t('Specify the user account to use for this contract call. And fees will be deducted from this account.')}
help={t<string>('Specify the user account to use for this contract call. And fees will be deducted from this account.')}
isDisabled={isBusy}
label={t('call from account')}
label={t<string>('call from account')}
onChange={_onChangeAccountId}
type='account'
value={accountId}
/>
<InputAddress
help={t('A deployed contract that has either been deployed or attached. The address and ABI are used to construct the parameters.')}
help={t<string>('A deployed contract that has either been deployed or attached. The address and ABI are used to construct the parameters.')}
isDisabled={isBusy}
label={t('contract to use')}
label={t<string>('contract to use')}
onChange={onChangeCallContractAddress}
type='contract'
value={callContract.address.toString()}
@ -143,10 +142,10 @@ function Call (props: Props): React.ReactElement<Props> | null {
<>
<Dropdown
defaultValue={`${callMessage.index}`}
help={t('The message to send to this contract. Parameters are adjusted based on the ABI provided.')}
help={t<string>('The message to send to this contract. Parameters are adjusted based on the ABI provided.')}
isDisabled={isBusy}
isError={callMessage === null}
label={t('message to send')}
label={t<string>('message to send')}
onChange={_onChangeCallMessageIndexString}
options={getCallMessageOptions(callContract)}
value={`${callMessage.index}`}
@ -163,21 +162,21 @@ function Call (props: Props): React.ReactElement<Props> | null {
</>
)}
<InputBalance
help={t('The allotted value for this contract, i.e. the amount transferred to the contract as part of this call.')}
help={t<string>('The allotted value for this contract, i.e. the amount transferred to the contract as part of this call.')}
isDisabled={isBusy}
isError={!isEndowmentValid}
isZeroable
label={t('value')}
label={t<string>('value')}
onChange={_onChangeEndowment}
value={endowment}
/>
<InputNumber
bitLength={128}
defaultValue={DEFAULT_GAS_LIMIT}
help={t('The maximum amount of gas that can be used by this call. If the code requires more, the call will fail.')}
help={t<string>('The maximum amount of gas that can be used by this call. If the code requires more, the call will fail.')}
isDisabled={isBusy}
isError={!isGasValid}
label={t('maximum gas allowed')}
label={t<string>('maximum gas allowed')}
onChange={_onChangeGasLimit}
value={gasLimit}
/>
@ -189,8 +188,8 @@ function Call (props: Props): React.ReactElement<Props> | null {
isDisabled={!!callMessage && callMessage.def.mutates}
label={
useRpc
? t('send as RPC call')
: t('send as transaction')
? t<string>('send as RPC call')
: t<string>('send as transaction')
}
onChange={setUseRpc}
value={useRpc || false}
@ -204,7 +203,7 @@ function Call (props: Props): React.ReactElement<Props> | null {
icon='sign-in'
isDisabled={!isValid}
isPrimary
label={t('Call')}
label={t<string>('Call')}
onClick={_onSubmitRpc}
/>
)
@ -214,7 +213,7 @@ function Call (props: Props): React.ReactElement<Props> | null {
icon='sign-in'
isDisabled={!isValid}
isPrimary
label={t('Call')}
label={t<string>('Call')}
onClick={_toggleBusy}
onFailed={_toggleBusy}
onSuccess={_toggleBusy}
@ -228,11 +227,11 @@ function Call (props: Props): React.ReactElement<Props> | null {
{outcomes.length > 0 && (
<>
<h3>
{t('Call results')}
{t<string>('Call results')}
<IconLink
className='clear-all'
icon='close'
label={t('Clear all')}
label={t<string>('Clear all')}
onClick={_onClearOutcomes}
/>
</h3>

Some files were not shown because too many files have changed in this diff Show More