From f39787152e47620dec7d890e607f5a5ef83d04af Mon Sep 17 00:00:00 2001 From: HenryNguyen5 Date: Tue, 19 Dec 2017 17:46:34 -0500 Subject: [PATCH] Fix Miscellaneous Types (#635) * Add repo wide prettier command to prepush * Make config file explict, remove formatAll to prepush * Fix react router typings * Add more typings * Fix event typings, fix transition children --- common/Root.tsx | 2 +- common/actions/rates/actionPayloads.ts | 47 ++++++++++++------- common/api/utils.ts | 6 +-- .../AmountFieldFactory/AmountFieldFactory.tsx | 2 +- .../AmountFieldFactory/AmountInputFactory.tsx | 2 +- .../BalanceSidebar/EquivalentValues.tsx | 4 +- .../TokenBalances/AddCustomTokenForm.tsx | 27 +++++++---- .../BalanceSidebar/TokenBalances/TokenRow.tsx | 2 +- .../DataFieldFactory/DataFieldFactory.tsx | 4 +- .../DataFieldFactory/DataInputFactory.tsx | 2 +- common/components/Footer/index.tsx | 6 +-- .../GasFieldFactory/GasFieldFactory.tsx | 4 +- .../Header/components/CustomNodeModal.tsx | 6 +-- .../DeterministicWalletsModal.tsx | 14 +++--- common/components/WalletDecrypt/Mnemonic.tsx | 4 +- .../components/WalletDecrypt/PrivateKey.tsx | 8 ++-- common/components/WalletDecrypt/ViewOnly.tsx | 2 +- common/components/WalletDecrypt/index.tsx | 6 +-- common/components/renderCbs/TokenQuery.tsx | 2 +- common/components/renderCbs/UnitConverter.tsx | 2 +- common/components/ui/Code.tsx | 2 +- common/components/ui/ColorDropdown.tsx | 2 +- common/components/ui/SimpleSelect.tsx | 2 +- common/config/bity.ts | 7 ++- .../containers/TabSection/Notifications.tsx | 7 +-- common/containers/Tabs/Contracts/index.tsx | 4 +- common/containers/Tabs/ENS/index.tsx | 2 +- .../components/DownloadWallet.tsx | 2 +- .../components/KeystoreDetails.tsx | 2 +- .../SendTransaction/components/WalletInfo.tsx | 2 +- .../Tabs/SignAndVerifyMessage/index.tsx | 4 +- .../Tabs/Swap/components/CurrencySwap.tsx | 6 +-- .../Tabs/Swap/components/CurrentRates.tsx | 2 +- .../Tabs/Swap/components/ReceivingAddress.tsx | 6 +-- .../Tabs/Swap/components/SwapProgress.tsx | 2 +- common/libs/nodes/etherscan/client.ts | 2 +- common/libs/validators.ts | 7 ++- .../libs/wallet/non-deterministic/helpers.ts | 2 +- common/reducers/notifications.ts | 2 +- common/reducers/transaction/sign/sign.ts | 4 +- common/sagas/config.ts | 6 +-- common/typescript/bn.d.ts | 2 +- package.json | 3 +- spec/sagas/config.spec.ts | 8 ++-- tsconfig.json | 13 +++-- 45 files changed, 140 insertions(+), 113 deletions(-) diff --git a/common/Root.tsx b/common/Root.tsx index 17b07775..b75f17f3 100644 --- a/common/Root.tsx +++ b/common/Root.tsx @@ -27,7 +27,7 @@ export default class Root extends Component { error: null }; - public componentDidCatch(error) { + public componentDidCatch(error: Error) { this.setState({ error }); } diff --git a/common/actions/rates/actionPayloads.ts b/common/actions/rates/actionPayloads.ts index 92e80412..123e1fe0 100644 --- a/common/actions/rates/actionPayloads.ts +++ b/common/actions/rates/actionPayloads.ts @@ -1,31 +1,39 @@ import { handleJSONResponse } from 'api/utils'; -export const rateSymbols = ['USD', 'EUR', 'GBP', 'BTC', 'CHF', 'REP', 'ETH']; +export const rateSymbols: Symbols = ['USD', 'EUR', 'GBP', 'BTC', 'CHF', 'REP', 'ETH']; + +export type Symbols = (keyof ISymbol)[]; // TODO - internationalize const ERROR_MESSAGE = 'Could not fetch rate data.'; const CCApi = 'https://min-api.cryptocompare.com'; const CCRates = (symbols: string[]) => { - const tsyms = rateSymbols.concat(symbols).join(','); + const tsyms = rateSymbols.concat(symbols as any).join(','); return `${CCApi}/data/price?fsym=ETH&tsyms=${tsyms}`; }; export interface CCResponse { - [symbol: string]: { - USD: number; - EUR: number; - GBP: number; - BTC: number; - CHF: number; - REP: number; - ETH: number; - }; + [symbol: string]: ISymbol; +} + +interface ISymbol { + USD: number; + EUR: number; + GBP: number; + BTC: number; + CHF: number; + REP: number; + ETH: number; +} + +interface IRates extends ISymbol { + Response?: 'Error'; } export const fetchRates = (symbols: string[] = []): Promise => fetch(CCRates(symbols)) .then(response => handleJSONResponse(response, ERROR_MESSAGE)) - .then(rates => { + .then((rates: IRates) => { // API errors come as 200s, so check the json for error if (rates.Response && rates.Response === 'Error') { throw new Error('Failed to fetch rates'); @@ -35,12 +43,15 @@ export const fetchRates = (symbols: string[] = []): Promise => // do it all in one request // to their respective rates via ETH. return symbols.reduce( - (eqRates, sym) => { + (eqRates, sym: keyof ISymbol) => { if (rates[sym]) { - eqRates[sym] = rateSymbols.reduce((symRates, rateSym) => { - symRates[rateSym] = 1 / rates[sym] * rates[rateSym]; - return symRates; - }, {}); + eqRates[sym] = rateSymbols.reduce( + (symRates, rateSym) => { + symRates[rateSym] = 1 / rates[sym] * rates[rateSym]; + return symRates; + }, + {} as ISymbol + ); } return eqRates; }, @@ -54,6 +65,6 @@ export const fetchRates = (symbols: string[] = []): Promise => REP: rates.REP, ETH: 1 } - } + } as CCResponse ); }); diff --git a/common/api/utils.ts b/common/api/utils.ts index 8996e4c3..199e65b7 100644 --- a/common/api/utils.ts +++ b/common/api/utils.ts @@ -4,7 +4,7 @@ export const filter = (i: any, arr: any[]) => { return -1 !== indexOf(arr, i) ? true : false; }; -export function checkHttpStatus(response) { +export function checkHttpStatus(response: Response) { if (response.status >= 200 && response.status < 300) { return response; } else { @@ -12,11 +12,11 @@ export function checkHttpStatus(response) { } } -export function parseJSON(response) { +export function parseJSON(response: Response) { return response.json(); } -export async function handleJSONResponse(response, errorMessage) { +export async function handleJSONResponse(response: Response, errorMessage: string) { if (response.ok) { return await response.json(); } diff --git a/common/components/AmountFieldFactory/AmountFieldFactory.tsx b/common/components/AmountFieldFactory/AmountFieldFactory.tsx index 54374e71..44457faf 100644 --- a/common/components/AmountFieldFactory/AmountFieldFactory.tsx +++ b/common/components/AmountFieldFactory/AmountFieldFactory.tsx @@ -11,7 +11,7 @@ export interface CallbackProps { currentValue: | AppState['transaction']['fields']['value'] | AppState['transaction']['meta']['tokenValue']; - onChange(ev: React.FormEvent); + onChange(ev: React.FormEvent): void; } interface DispatchProps { diff --git a/common/components/AmountFieldFactory/AmountInputFactory.tsx b/common/components/AmountFieldFactory/AmountInputFactory.tsx index f7bcec2d..a2ddfcfe 100644 --- a/common/components/AmountFieldFactory/AmountInputFactory.tsx +++ b/common/components/AmountFieldFactory/AmountInputFactory.tsx @@ -6,7 +6,7 @@ import { connect } from 'react-redux'; import { CallbackProps } from 'components/AmountFieldFactory'; interface OwnProps { - onChange(ev: React.FormEvent); + onChange(ev: React.FormEvent): void; withProps(props: CallbackProps): React.ReactElement | null; } diff --git a/common/components/BalanceSidebar/EquivalentValues.tsx b/common/components/BalanceSidebar/EquivalentValues.tsx index 4f159c21..afd88972 100644 --- a/common/components/BalanceSidebar/EquivalentValues.tsx +++ b/common/components/BalanceSidebar/EquivalentValues.tsx @@ -32,7 +32,7 @@ export default class EquivalentValues extends React.Component { private decimalLookup: { [key: string]: number } = {}; private requestedCurrencies: string[] | null = null; - public constructor(props) { + public constructor(props: Props) { super(props); this.makeBalanceLookup(props); @@ -41,7 +41,7 @@ export default class EquivalentValues extends React.Component { } } - public componentWillReceiveProps(nextProps) { + public componentWillReceiveProps(nextProps: Props) { const { balance, tokenBalances } = this.props; if (nextProps.balance !== balance || nextProps.tokenBalances !== tokenBalances) { this.makeBalanceLookup(nextProps); diff --git a/common/components/BalanceSidebar/TokenBalances/AddCustomTokenForm.tsx b/common/components/BalanceSidebar/TokenBalances/AddCustomTokenForm.tsx index 898f304d..6cfccea9 100644 --- a/common/components/BalanceSidebar/TokenBalances/AddCustomTokenForm.tsx +++ b/common/components/BalanceSidebar/TokenBalances/AddCustomTokenForm.tsx @@ -12,15 +12,19 @@ interface Props { toggleForm(): void; } +interface IGenerateSymbolLookup { + [tokenSymbol: string]: boolean; +} + interface State { - tokenSymbolLookup: { [symbol: string]: boolean }; + tokenSymbolLookup: IGenerateSymbolLookup; address: string; symbol: string; decimal: string; } export default class AddCustomTokenForm extends React.Component { - public state = { + public state: State = { tokenSymbolLookup: {}, address: '', symbol: '', @@ -130,14 +134,14 @@ export default class AddCustomTokenForm extends React.Component { return !Object.keys(this.getErrors()).length && address && symbol && decimal; } - public onFieldChange = (e: React.SyntheticEvent) => { + public onFieldChange = (e: React.FormEvent) => { // TODO: typescript bug: https://github.com/Microsoft/TypeScript/issues/13948 - const name: any = (e.target as HTMLInputElement).name; - const value = (e.target as HTMLInputElement).value; + const name: any = e.currentTarget.name; + const value = e.currentTarget.value; this.setState({ [name]: value }); }; - public onSave = (ev: React.SyntheticEvent) => { + public onSave = (ev: React.FormEvent) => { ev.preventDefault(); if (!this.isValid()) { return; @@ -148,9 +152,12 @@ export default class AddCustomTokenForm extends React.Component { }; private generateSymbolLookup(tokens: Token[]) { - return tokens.reduce((prev, tk) => { - prev[tk.symbol] = true; - return prev; - }, {}); + return tokens.reduce( + (prev, tk) => { + prev[tk.symbol] = true; + return prev; + }, + {} as IGenerateSymbolLookup + ); } } diff --git a/common/components/BalanceSidebar/TokenBalances/TokenRow.tsx b/common/components/BalanceSidebar/TokenBalances/TokenRow.tsx index 011dd9e4..d5c16628 100644 --- a/common/components/BalanceSidebar/TokenBalances/TokenRow.tsx +++ b/common/components/BalanceSidebar/TokenBalances/TokenRow.tsx @@ -65,7 +65,7 @@ export default class TokenRow extends React.Component { ); } - public toggleShowLongBalance = (e: React.SyntheticEvent) => { + public toggleShowLongBalance = (e: React.FormEvent) => { e.preventDefault(); this.setState(state => { return { diff --git a/common/components/DataFieldFactory/DataFieldFactory.tsx b/common/components/DataFieldFactory/DataFieldFactory.tsx index a262ce7d..a9e32d55 100644 --- a/common/components/DataFieldFactory/DataFieldFactory.tsx +++ b/common/components/DataFieldFactory/DataFieldFactory.tsx @@ -9,10 +9,10 @@ export interface CallBackProps { data: AppState['transaction']['fields']['data']; dataExists: boolean; readOnly: boolean; - onChange(ev: React.FormEvent); + onChange(ev: React.FormEvent): void; } interface DispatchProps { - isEtherTransaction; + isEtherTransaction: boolean; inputData: TInputData; } interface OwnProps { diff --git a/common/components/DataFieldFactory/DataInputFactory.tsx b/common/components/DataFieldFactory/DataInputFactory.tsx index a2f61623..6c6f5ba9 100644 --- a/common/components/DataFieldFactory/DataInputFactory.tsx +++ b/common/components/DataFieldFactory/DataInputFactory.tsx @@ -7,7 +7,7 @@ import { CallBackProps } from 'components/DataFieldFactory'; interface OwnProps { withProps(props: CallBackProps): React.ReactElement | null; - onChange(ev: React.FormEvent); + onChange(ev: React.FormEvent): void; } interface StateProps { data: AppState['transaction']['fields']['data']; diff --git a/common/components/Footer/index.tsx b/common/components/Footer/index.tsx index fc85672d..2bd98259 100644 --- a/common/components/Footer/index.tsx +++ b/common/components/Footer/index.tsx @@ -15,7 +15,7 @@ import PreFooter from './PreFooter'; import Modal, { IButton } from 'components/ui/Modal'; import { NewTabLink } from 'components/ui'; -const AffiliateTag = ({ link, text }) => { +const AffiliateTag = ({ link, text }: Link) => { return (
  • {text} @@ -23,7 +23,7 @@ const AffiliateTag = ({ link, text }) => { ); }; -const SocialMediaLink = ({ link, text }) => { +const SocialMediaLink = ({ link, text }: Link) => { return ( @@ -108,7 +108,7 @@ interface State { } export default class Footer extends React.Component { - constructor(props) { + constructor(props: Props) { super(props); this.state = { isOpen: false }; } diff --git a/common/components/GasFieldFactory/GasFieldFactory.tsx b/common/components/GasFieldFactory/GasFieldFactory.tsx index d506ddac..a1e3d72c 100644 --- a/common/components/GasFieldFactory/GasFieldFactory.tsx +++ b/common/components/GasFieldFactory/GasFieldFactory.tsx @@ -18,7 +18,7 @@ interface DispatchProps { } interface OwnProps { gasLimit: string | null; - withProps(props: CallBackProps); + withProps(props: CallBackProps): React.ReactElement | null; } type Props = DispatchProps & OwnProps; @@ -46,7 +46,7 @@ class GasLimitFieldClass extends Component { const GasLimitField = connect(null, { inputGasLimit })(GasLimitFieldClass); interface DefaultGasFieldProps { - withProps(props: CallBackProps); + withProps(props: CallBackProps): React.ReactElement | null; } const DefaultGasField: React.SFC = ({ withProps }) => ( { 'form-control': true, 'is-invalid': this.state[input.name] && invalids[input.name] })} - value={this.state[name]} + value={this.state.name} onChange={this.handleChange} {...input} /> @@ -252,7 +252,7 @@ export default class CustomNodeModal extends React.Component { customNetworkUnit, customNetworkChainId } = this.state; - const required = ['name', 'url', 'port', 'network']; + const required: (keyof State)[] = ['name', 'url', 'port', 'network']; const invalids: { [key: string]: boolean } = {}; // Required fields @@ -344,7 +344,7 @@ export default class CustomNodeModal extends React.Component { private handleCheckbox = (ev: React.FormEvent) => { const { name } = ev.currentTarget; - this.setState({ [name as any]: !this.state[name] }); + this.setState({ [name as any]: !this.state[name as keyof State] }); }; private saveAndAdd = () => { diff --git a/common/components/WalletDecrypt/DeterministicWalletsModal.tsx b/common/components/WalletDecrypt/DeterministicWalletsModal.tsx index bb23297b..0c8b4b43 100644 --- a/common/components/WalletDecrypt/DeterministicWalletsModal.tsx +++ b/common/components/WalletDecrypt/DeterministicWalletsModal.tsx @@ -200,8 +200,8 @@ class DeterministicWalletsModal extends React.Component { } } - private handleChangePath = (ev: React.SyntheticEvent) => { - const { value } = ev.target as HTMLSelectElement; + private handleChangePath = (ev: React.FormEvent) => { + const { value } = ev.currentTarget; if (value === 'custom') { this.setState({ isCustomPath: true }); @@ -213,11 +213,11 @@ class DeterministicWalletsModal extends React.Component { } }; - private handleChangeCustomPath = (ev: React.SyntheticEvent) => { - this.setState({ customPath: (ev.target as HTMLInputElement).value }); + private handleChangeCustomPath = (ev: React.FormEvent) => { + this.setState({ customPath: ev.currentTarget.value }); }; - private handleSubmitCustomPath = (ev: React.SyntheticEvent) => { + private handleSubmitCustomPath = (ev: React.FormEvent) => { ev.preventDefault(); if (!isValidPath(this.state.customPath)) { return; @@ -225,8 +225,8 @@ class DeterministicWalletsModal extends React.Component { this.props.onPathChange(this.state.customPath); }; - private handleChangeToken = (ev: React.SyntheticEvent) => { - this.props.setDesiredToken((ev.target as HTMLSelectElement).value || undefined); + private handleChangeToken = (ev: React.FormEvent) => { + this.props.setDesiredToken(ev.currentTarget.value || undefined); }; private handleConfirmAddress = () => { diff --git a/common/components/WalletDecrypt/Mnemonic.tsx b/common/components/WalletDecrypt/Mnemonic.tsx index 9360fe14..49ab4871 100644 --- a/common/components/WalletDecrypt/Mnemonic.tsx +++ b/common/components/WalletDecrypt/Mnemonic.tsx @@ -82,8 +82,8 @@ export default class MnemonicDecrypt extends Component { ); } - public onPasswordChange = (e: React.SyntheticEvent) => { - this.setState({ pass: (e.target as HTMLInputElement).value }); + public onPasswordChange = (e: React.FormEvent) => { + this.setState({ pass: e.currentTarget.value }); }; public onMnemonicChange = (e: React.FormEvent) => { diff --git a/common/components/WalletDecrypt/PrivateKey.tsx b/common/components/WalletDecrypt/PrivateKey.tsx index 06e05fec..b6972f49 100644 --- a/common/components/WalletDecrypt/PrivateKey.tsx +++ b/common/components/WalletDecrypt/PrivateKey.tsx @@ -83,17 +83,17 @@ export default class PrivateKeyDecrypt extends Component { ); } - public onPkeyChange = (e: React.SyntheticEvent) => { - const pkey = (e.target as HTMLInputElement).value; + public onPkeyChange = (e: React.FormEvent) => { + const pkey = e.currentTarget.value; const pass = this.props.value.password; const { fixedPkey, valid } = validatePkeyAndPass(pkey, pass); this.props.onChange({ ...this.props.value, key: fixedPkey, valid }); }; - public onPasswordChange = (e: React.SyntheticEvent) => { + public onPasswordChange = (e: React.FormEvent) => { const pkey = this.props.value.key; - const pass = (e.target as HTMLInputElement).value; + const pass = e.currentTarget.value; const { valid } = validatePkeyAndPass(pkey, pass); this.props.onChange({ diff --git a/common/components/WalletDecrypt/ViewOnly.tsx b/common/components/WalletDecrypt/ViewOnly.tsx index aa0cefe5..85e4b4ad 100644 --- a/common/components/WalletDecrypt/ViewOnly.tsx +++ b/common/components/WalletDecrypt/ViewOnly.tsx @@ -49,7 +49,7 @@ export default class ViewOnlyDecrypt extends Component { this.setState({ address: ev.currentTarget.value }); }; - private openWallet = (ev: React.SyntheticEvent) => { + private openWallet = (ev: React.FormEvent) => { const { address } = this.state; ev.preventDefault(); if (isValidETHAddress(address)) { diff --git a/common/components/WalletDecrypt/index.tsx b/common/components/WalletDecrypt/index.tsx index bb4faf49..0918a3da 100644 --- a/common/components/WalletDecrypt/index.tsx +++ b/common/components/WalletDecrypt/index.tsx @@ -160,15 +160,15 @@ export class WalletDecrypt extends Component { }); } - public handleDecryptionChoiceChange = (event: React.SyntheticEvent) => { - const wallet = this.WALLETS[(event.target as HTMLInputElement).value]; + public handleDecryptionChoiceChange = (event: React.FormEvent) => { + const wallet = this.WALLETS[event.currentTarget.value]; if (!wallet) { return; } this.setState({ - selectedWalletKey: (event.target as HTMLInputElement).value, + selectedWalletKey: event.currentTarget.value, value: wallet.initialParams }); }; diff --git a/common/components/renderCbs/TokenQuery.tsx b/common/components/renderCbs/TokenQuery.tsx index 4286dec9..33b5306c 100644 --- a/common/components/renderCbs/TokenQuery.tsx +++ b/common/components/renderCbs/TokenQuery.tsx @@ -6,7 +6,7 @@ import { getTokens, MergedToken } from 'selectors/wallet'; interface Props { tokens: MergedToken[]; - withQuery({ token }: { token: MergedToken | null | undefined }); + withQuery({ token }: { token: MergedToken | null | undefined }): React.ReactElement; } class TokenQueryClass extends Component { diff --git a/common/components/renderCbs/UnitConverter.tsx b/common/components/renderCbs/UnitConverter.tsx index e02f3c15..c42f0cea 100644 --- a/common/components/renderCbs/UnitConverter.tsx +++ b/common/components/renderCbs/UnitConverter.tsx @@ -15,7 +15,7 @@ interface IFakeEvent { export interface Props { decimal: number; children({ onUserInput, convertedUnit }: IChildren): React.ReactElement; - onChange(baseUnit: IFakeEvent); + onChange(baseUnit: IFakeEvent): void; } interface State { diff --git a/common/components/ui/Code.tsx b/common/components/ui/Code.tsx index 179cb16d..b1c900f2 100644 --- a/common/components/ui/Code.tsx +++ b/common/components/ui/Code.tsx @@ -1,7 +1,7 @@ import React from 'react'; import './Code.scss'; -const Code = ({ children }) => ( +const Code = ({ children }: React.Props<{}>) => ( 
         {children}
    diff --git a/common/components/ui/ColorDropdown.tsx b/common/components/ui/ColorDropdown.tsx index 93bad7b5..5a32c55a 100644 --- a/common/components/ui/ColorDropdown.tsx +++ b/common/components/ui/ColorDropdown.tsx @@ -112,7 +112,7 @@ export default class ColorDropdown extends Component, {}> { } }; - private onRemove(onRemove: () => void, ev?: React.SyntheticEvent) { + private onRemove(onRemove: () => void, ev?: React.FormEvent) { if (ev) { ev.preventDefault(); ev.stopPropagation(); diff --git a/common/components/ui/SimpleSelect.tsx b/common/components/ui/SimpleSelect.tsx index c9b57c78..95758ae7 100644 --- a/common/components/ui/SimpleSelect.tsx +++ b/common/components/ui/SimpleSelect.tsx @@ -3,7 +3,7 @@ import React, { Component } from 'react'; interface Props { value?: string; options: string[]; - onChange(event: React.SyntheticEvent): void; + onChange(event: React.FormEvent): void; } export default class SimpleSelect extends Component { diff --git a/common/config/bity.ts b/common/config/bity.ts index d2c02825..a6a784e2 100644 --- a/common/config/bity.ts +++ b/common/config/bity.ts @@ -1,7 +1,6 @@ import { BTCTxExplorer, ETHTxExplorer } from './data'; -export type WhitelistedCoins = 'ETH' | 'BTC' | 'REP'; - +export type WhitelistedCoins = 'BTC' | 'REP' | 'ETH'; const serverURL = 'https://bity.myetherapi.com'; const bityURL = 'https://bity.com/api'; const BTCMin = 0.01; @@ -16,13 +15,13 @@ const buffers = { }; // rate must be BTC[KIND] -export function generateKindMin(BTCKINDRate: number, kind: WhitelistedCoins): number { +export function generateKindMin(BTCKINDRate: number, kind: keyof typeof buffers): number { const kindMinVal = BTCKINDRate * BTCMin; return kindMinVal + kindMinVal * buffers[kind]; } // rate must be BTC[KIND] -export function generateKindMax(BTCKINDRate: number, kind: WhitelistedCoins): number { +export function generateKindMax(BTCKINDRate: number, kind: keyof typeof buffers): number { const kindMax = BTCKINDRate * BTCMax; return kindMax - kindMax * buffers[kind]; } diff --git a/common/containers/TabSection/Notifications.tsx b/common/containers/TabSection/Notifications.tsx index e56c4991..901d90f8 100644 --- a/common/containers/TabSection/Notifications.tsx +++ b/common/containers/TabSection/Notifications.tsx @@ -4,15 +4,16 @@ import { connect } from 'react-redux'; import { TransitionGroup, CSSTransition } from 'react-transition-group'; import NotificationRow from './NotificationRow'; import './Notifications.scss'; +import { AppState } from 'reducers'; interface Props { notifications: Notification[]; closeNotification: TCloseNotification; } -const Transition = props => ( +const Transition: React.SFC<{}> = ({ children }) => ( @@ -34,7 +35,7 @@ export class Notifications extends React.Component { } } -const mapStateToProps = state => ({ +const mapStateToProps = (state: AppState) => ({ notifications: state.notifications }); diff --git a/common/containers/Tabs/Contracts/index.tsx b/common/containers/Tabs/Contracts/index.tsx index 2771dbd1..e16acf2d 100644 --- a/common/containers/Tabs/Contracts/index.tsx +++ b/common/containers/Tabs/Contracts/index.tsx @@ -9,7 +9,7 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; interface State { - activeTab: string; + activeTab: 'interact' | 'deploy'; } interface Props { @@ -22,7 +22,7 @@ class Contracts extends Component { activeTab: 'interact' }; - public changeTab = activeTab => () => { + public changeTab = (activeTab: State['activeTab']) => () => { this.props.reset(); this.props.resetWallet(); this.setState({ activeTab }); diff --git a/common/containers/Tabs/ENS/index.tsx b/common/containers/Tabs/ENS/index.tsx index 22c396bf..7ea84d4b 100644 --- a/common/containers/Tabs/ENS/index.tsx +++ b/common/containers/Tabs/ENS/index.tsx @@ -1,6 +1,6 @@ import { connect } from 'react-redux'; import ENS from './components/ENS'; -const mapStateToProps = _ => ({}); +const mapStateToProps = () => ({}); export default connect(mapStateToProps)(ENS); diff --git a/common/containers/Tabs/GenerateWallet/components/DownloadWallet.tsx b/common/containers/Tabs/GenerateWallet/components/DownloadWallet.tsx index 5c9e8a8c..3f725576 100644 --- a/common/containers/Tabs/GenerateWallet/components/DownloadWallet.tsx +++ b/common/containers/Tabs/GenerateWallet/components/DownloadWallet.tsx @@ -130,6 +130,6 @@ export default class DownloadWallet extends Component { this.setState({ keystore }); } - private handleDownloadKeystore = e => + private handleDownloadKeystore = (e: React.FormEvent) => this.state.keystore ? this.markDownloaded() : e.preventDefault(); } diff --git a/common/containers/Tabs/RestoreKeystore/components/KeystoreDetails.tsx b/common/containers/Tabs/RestoreKeystore/components/KeystoreDetails.tsx index e3a8521b..e804f589 100644 --- a/common/containers/Tabs/RestoreKeystore/components/KeystoreDetails.tsx +++ b/common/containers/Tabs/RestoreKeystore/components/KeystoreDetails.tsx @@ -26,7 +26,7 @@ const initialState: State = { wallet: null }; -const minLength = min => value => value && value.length >= min; +const minLength = (min: number) => (value: string) => !!value && value.length >= min; const minLength9 = minLength(9); class KeystoreDetails extends Component<{}, State> { diff --git a/common/containers/Tabs/SendTransaction/components/WalletInfo.tsx b/common/containers/Tabs/SendTransaction/components/WalletInfo.tsx index bb51e3e8..58f1c1f1 100644 --- a/common/containers/Tabs/SendTransaction/components/WalletInfo.tsx +++ b/common/containers/Tabs/SendTransaction/components/WalletInfo.tsx @@ -29,7 +29,7 @@ export default class WalletInfo extends React.Component { this.setWalletAsyncState(this.props.wallet); } - public componentWillReceiveProps(nextProps) { + public componentWillReceiveProps(nextProps: Props) { if (this.props.wallet !== nextProps.wallet) { this.setWalletAsyncState(nextProps.wallet); } diff --git a/common/containers/Tabs/SignAndVerifyMessage/index.tsx b/common/containers/Tabs/SignAndVerifyMessage/index.tsx index 72c52d17..d8db1d4c 100644 --- a/common/containers/Tabs/SignAndVerifyMessage/index.tsx +++ b/common/containers/Tabs/SignAndVerifyMessage/index.tsx @@ -6,7 +6,7 @@ import TabSection from 'containers/TabSection'; import './index.scss'; interface State { - activeTab: string; + activeTab: 'sign' | 'verify'; } export default class SignAndVerifyMessage extends Component<{}, State> { @@ -14,7 +14,7 @@ export default class SignAndVerifyMessage extends Component<{}, State> { activeTab: 'sign' }; - public changeTab = activeTab => () => this.setState({ activeTab }); + public changeTab = (activeTab: State['activeTab']) => () => this.setState({ activeTab }); public render() { const { activeTab } = this.state; diff --git a/common/containers/Tabs/Swap/components/CurrencySwap.tsx b/common/containers/Tabs/Swap/components/CurrencySwap.tsx index 14f6854b..652ec39e 100644 --- a/common/containers/Tabs/Swap/components/CurrencySwap.tsx +++ b/common/containers/Tabs/Swap/components/CurrencySwap.tsx @@ -156,10 +156,10 @@ export default class CurrencySwap extends Component { } }; - public onChangeAmount = (event: React.SyntheticEvent) => { - const type = (event.target as HTMLInputElement).id; + public onChangeAmount = (event: React.FormEvent) => { + const type = event.currentTarget.id; const { origin, destination } = this.state; - const amount = parseFloat((event.target as HTMLInputElement).value); + const amount = parseFloat(event.currentTarget.value); type === 'origin-swap-input' ? this.updateOriginAmount(origin, destination, amount) : this.updateDestinationAmount(origin, destination, amount); diff --git a/common/containers/Tabs/Swap/components/CurrentRates.tsx b/common/containers/Tabs/Swap/components/CurrentRates.tsx index cb28c5ba..66d017c7 100644 --- a/common/containers/Tabs/Swap/components/CurrentRates.tsx +++ b/common/containers/Tabs/Swap/components/CurrentRates.tsx @@ -36,7 +36,7 @@ export default class CurrentRates extends Component { public buildPairRate = (origin: string, destination: string) => { const pair = origin + destination; - const statePair = this.state[pair + 'Amount']; + const statePair = this.state[(pair + 'Amount') as keyof State]; const propsPair = this.props[pair] ? this.props[pair].rate : null; return (
    diff --git a/common/containers/Tabs/Swap/components/ReceivingAddress.tsx b/common/containers/Tabs/Swap/components/ReceivingAddress.tsx index 5eecdca5..9fdc4cad 100644 --- a/common/containers/Tabs/Swap/components/ReceivingAddress.tsx +++ b/common/containers/Tabs/Swap/components/ReceivingAddress.tsx @@ -16,7 +16,7 @@ import './ReceivingAddress.scss'; export interface StateProps { origin: SwapInput; - destinationId: string; + destinationId: keyof typeof donationAddressMap; isPostingOrder: boolean; destinationAddress: string; } @@ -29,8 +29,8 @@ export interface ActionProps { } export default class ReceivingAddress extends Component { - public onChangeDestinationAddress = (event: React.SyntheticEvent) => { - const value = (event.target as HTMLInputElement).value; + public onChangeDestinationAddress = (event: React.FormEvent) => { + const value = event.currentTarget.value; this.props.destinationAddressSwap(value); }; diff --git a/common/containers/Tabs/Swap/components/SwapProgress.tsx b/common/containers/Tabs/Swap/components/SwapProgress.tsx index 3e6d384f..d5d11185 100644 --- a/common/containers/Tabs/Swap/components/SwapProgress.tsx +++ b/common/containers/Tabs/Swap/components/SwapProgress.tsx @@ -32,7 +32,7 @@ export default class SwapProgress extends Component { if (orderStatus === 'FILL') { if (!hasShownViewTx) { - let linkElement; + let linkElement: React.ReactElement; let link; const notificationMessage = translateRaw('SUCCESS_3') + outputTx; // everything but BTC is a token diff --git a/common/libs/nodes/etherscan/client.ts b/common/libs/nodes/etherscan/client.ts index b5b666ef..b8518e4e 100644 --- a/common/libs/nodes/etherscan/client.ts +++ b/common/libs/nodes/etherscan/client.ts @@ -5,7 +5,7 @@ import { EtherscanRequest } from './types'; export default class EtherscanClient extends RPCClient { public encodeRequest(request: EtherscanRequest): string { const encoded = new URLSearchParams(); - Object.keys(request).forEach(key => { + Object.keys(request).forEach((key: keyof EtherscanRequest) => { if (request[key]) { encoded.set(key, request[key]); } diff --git a/common/libs/validators.ts b/common/libs/validators.ts index 881b9639..913c23af 100644 --- a/common/libs/validators.ts +++ b/common/libs/validators.ts @@ -56,7 +56,7 @@ export function isValidENSAddress(address: string): boolean { test: true, reverse: true }; - if (validTLDs[tld]) { + if (validTLDs[tld as keyof typeof validTLDs]) { return true; } } catch (e) { @@ -173,7 +173,10 @@ function formatErrors(response: JsonRpcResponse, apiType: string) { return `Invalid ${apiType} Error`; } -const isValidEthCall = (response: JsonRpcResponse, schemaType) => (apiName, cb?) => { +const isValidEthCall = (response: JsonRpcResponse, schemaType: typeof schema.RpcNode) => ( + apiName, + cb? +) => { if (!isValidResult(response, schemaType)) { if (cb) { return cb(response); diff --git a/common/libs/wallet/non-deterministic/helpers.ts b/common/libs/wallet/non-deterministic/helpers.ts index 1dc7a008..f4645e6b 100644 --- a/common/libs/wallet/non-deterministic/helpers.ts +++ b/common/libs/wallet/non-deterministic/helpers.ts @@ -20,7 +20,7 @@ enum KeystoreTypes { interface ISignWrapper { signRawTransaction(rawTx: Tx): Buffer; signMessage(msg: string): string; - unlock(); + unlock(): Promise; } export type WrappedWallet = IFullWallet & ISignWrapper; diff --git a/common/reducers/notifications.ts b/common/reducers/notifications.ts index e4b63633..b34cf7e0 100644 --- a/common/reducers/notifications.ts +++ b/common/reducers/notifications.ts @@ -13,7 +13,7 @@ function showNotification(state: State, action: ShowNotificationAction): State { return state.concat(action.payload); } -function closeNotification(state, action: CloseNotificationAction): State { +function closeNotification(state: State, action: CloseNotificationAction): State { state = [...state]; state.splice(state.indexOf(action.payload), 1); return state; diff --git a/common/reducers/transaction/sign/sign.ts b/common/reducers/transaction/sign/sign.ts index 046c3ef1..8a5f565b 100644 --- a/common/reducers/transaction/sign/sign.ts +++ b/common/reducers/transaction/sign/sign.ts @@ -20,7 +20,7 @@ const signLocalTransactionRequested = (state: State): State => ({ }); const signLocalTransactionSucceeded = ( - _, + _: State, { payload }: SignLocalTransactionSucceededAction ): State => ({ indexingHash: payload.indexingHash, @@ -31,7 +31,7 @@ const signLocalTransactionSucceeded = ( }); const signWeb3TranscationRequested = ( - _, + _: State, { payload }: SignWeb3TransactionSucceededAction ): State => ({ indexingHash: payload.indexingHash, diff --git a/common/sagas/config.ts b/common/sagas/config.ts index 9869b0d7..7e230073 100644 --- a/common/sagas/config.ts +++ b/common/sagas/config.ts @@ -10,7 +10,7 @@ import { select, race } from 'redux-saga/effects'; -import { NODES } from 'config/data'; +import { NODES, NodeConfig } from 'config/data'; import { makeCustomNodeId, getCustomNodeConfigFromId, @@ -216,13 +216,13 @@ export function* unsetWeb3Node(): SagaIterator { return; } - const nodeConfig = yield select(getNodeConfig); + const nodeConfig: NodeConfig = yield select(getNodeConfig); const newNode = equivalentNodeOrDefault(nodeConfig); yield put(changeNodeIntent(newNode)); } -export const equivalentNodeOrDefault = nodeConfig => { +export const equivalentNodeOrDefault = (nodeConfig: NodeConfig) => { const node = Object.keys(NODES) .filter(key => key !== 'web3') .reduce((found, key) => { diff --git a/common/typescript/bn.d.ts b/common/typescript/bn.d.ts index a9d57b40..550bca64 100644 --- a/common/typescript/bn.d.ts +++ b/common/typescript/bn.d.ts @@ -273,7 +273,7 @@ declare module 'bn.js' { */ iadd(b: BN): BN; - addition; + /** * @description addition */ diff --git a/package.json b/package.json index 772b69e1..655e330c 100644 --- a/package.json +++ b/package.json @@ -134,8 +134,7 @@ "postinstall": "webpack --config=./webpack_config/webpack.dll.js", "start": "npm run dev", "precommit": "lint-staged", - "formatAll": - "find ./common/ -name '*.ts*' | xargs prettier --write --config ./.prettierrc --config-precedence file-override", + "formatAll": "find ./common/ -name '*.ts*' | xargs prettier --write --config ./.prettierrc --config-precedence file-override", "prepush": "npm run tslint && npm run tscheck" }, "lint-staged": { diff --git a/spec/sagas/config.spec.ts b/spec/sagas/config.spec.ts index 1de7bb78..ffa11969 100644 --- a/spec/sagas/config.spec.ts +++ b/spec/sagas/config.spec.ts @@ -13,7 +13,7 @@ import { unsetWeb3NodeOnWalletEvent, equivalentNodeOrDefault } from 'sagas/config'; -import { NODES } from 'config/data'; +import { NODES, NodeConfig } from 'config/data'; import { getNode, getNodeConfig, @@ -301,7 +301,7 @@ describe('handleNodeChangeIntent*', () => { describe('unsetWeb3Node*', () => { const node = 'web3'; - const mockNodeConfig = { network: 'ETH' }; + const mockNodeConfig = { network: 'ETH' } as any; const newNode = equivalentNodeOrDefault(mockNodeConfig); const gen = unsetWeb3Node(); @@ -332,7 +332,7 @@ describe('unsetWeb3Node*', () => { describe('unsetWeb3NodeOnWalletEvent*', () => { const fakeAction = {}; const mockNode = 'web3'; - const mockNodeConfig = { network: 'ETH' }; + const mockNodeConfig: Partial = { network: 'ETH' }; const gen = unsetWeb3NodeOnWalletEvent(fakeAction); it('should select getNode', () => { @@ -345,7 +345,7 @@ describe('unsetWeb3NodeOnWalletEvent*', () => { it('should put changeNodeIntent', () => { expect(gen.next(mockNodeConfig).value).toEqual( - put(changeNodeIntent(equivalentNodeOrDefault(mockNodeConfig))) + put(changeNodeIntent(equivalentNodeOrDefault(mockNodeConfig as any))) ); }); diff --git a/tsconfig.json b/tsconfig.json index 777bd9b5..d80c83ee 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -8,15 +8,22 @@ "target": "es5", "allowJs": true, "baseUrl": "./common/", - "lib": ["es2017", "dom"], + "lib": [ + "es2017", + "dom" + ], "allowSyntheticDefaultImports": true, "moduleResolution": "node", "noEmitOnError": false, "noUnusedLocals": true, "noUnusedParameters": true }, - "include": ["./common/", "spec", "./node_modules/types-rlp/index.d.ts"], + "include": [ + "./common/", + "spec", + "./node_modules/types-rlp/index.d.ts" + ], "awesomeTypescriptLoaderOptions": { "transpileOnly": true } -} +} \ No newline at end of file