From b3dfd24920def08d38e3448fe0fb11feb527e4cd Mon Sep 17 00:00:00 2001 From: builat Date: Sun, 26 Aug 2018 15:25:06 +0700 Subject: [PATCH] Minor codestyle fixes (#23) * Minor code style fixes * Few types added --- .../header-stats/header-stats.component.tsx | 2 +- .../components/header/header.component.tsx | 12 +++---- .../payment-request-modal.component.tsx | 31 ++++++++++++------- .../components/search/search.component.tsx | 30 ++++++++---------- .../components/sidebar/sidebar.component.tsx | 14 ++++++--- 5 files changed, 49 insertions(+), 40 deletions(-) diff --git a/client/src/components/header-stats/header-stats.component.tsx b/client/src/components/header-stats/header-stats.component.tsx index dbd49351..bcc698a2 100644 --- a/client/src/components/header-stats/header-stats.component.tsx +++ b/client/src/components/header-stats/header-stats.component.tsx @@ -39,7 +39,7 @@ class HeaderStats extends React.Component { - constructor (props: any) { - super(props); - - this.showSidebar = this.showSidebar.bind(this); + constructor (props: SettingsActions) { + super(props); + + this.showSidebar = this.showSidebar.bind(this); } - + render (): JSX.Element { return (
@@ -42,7 +42,7 @@ class Header extends React.Component { ); } - private showSidebar (): void { + private showSidebar (): void { this.props.setSidebarDisplayStatus(true); } } diff --git a/client/src/components/modals/payment-request-modal/payment-request-modal.component.tsx b/client/src/components/modals/payment-request-modal/payment-request-modal.component.tsx index bba3f6ad..449ba5e5 100644 --- a/client/src/components/modals/payment-request-modal/payment-request-modal.component.tsx +++ b/client/src/components/modals/payment-request-modal/payment-request-modal.component.tsx @@ -11,32 +11,39 @@ import { AddressId } from '../../../models/generated/addressId'; import { CrossIcon } from '../../common/icons/common.icons'; +import './payment-request-modal.scss'; + type IPaymentRequestModalProps = RouteComponentProps & { isOpen: boolean; onClose: () => void; address: AddressId; }; -import './payment-request-modal.scss'; +interface IPaymentRequestState { + amount: number; + copied: boolean; + description: string; +} + +class PaymentRequestModal extends React.PureComponent { -class PaymentRequestModal extends React.PureComponent { link: HTMLDivElement; - state: any = { + state: IPaymentRequestState = { amount: 0, copied: false, description: '' }; - constructor (props: any) { - super(props); - - this.setAmount = this.setAmount.bind(this); - this.setDescription = this.setDescription.bind(this); - this.copyLinkToClipboard = this.copyLinkToClipboard.bind(this); - this.selectLink = this.selectLink.bind(this); + constructor (props: IPaymentRequestModalProps){ + super(props); + + this.setAmount = this.setAmount.bind(this); + this.setDescription = this.setDescription.bind(this); + this.copyLinkToClipboard = this.copyLinkToClipboard.bind(this); + this.selectLink = this.selectLink.bind(this); } - + render (): JSX.Element { const link = this.getLink(); @@ -137,7 +144,7 @@ class PaymentRequestModal extends React.PureComponent private setAmount (event: React.ChangeEvent): void { this.setState({ - amount: event.target.value + amount: parseInt(event.target.value, 10) }); } diff --git a/client/src/components/search/search.component.tsx b/client/src/components/search/search.component.tsx index 20b03756..0e91ad53 100644 --- a/client/src/components/search/search.component.tsx +++ b/client/src/components/search/search.component.tsx @@ -9,10 +9,12 @@ import { SearchIcon } from '../common/icons/common.icons'; import './search.scss'; -class Search extends React.PureComponent> { - state: { - isInputFocused: boolean, - } = { +interface ISearchState { + isInputFocused: boolean; +} + +class Search extends React.PureComponent, ISearchState> { + state: ISearchState = { isInputFocused: false }; @@ -20,13 +22,13 @@ class Search extends React.PureComponent> { onInputChangedDebounced: () => void; - constructor (props: any) { + constructor (props: RouteComponentProps<{}>) { super(props); - this.focusInput = this.focusInput.bind(this); - this.onInputBlur = this.onInputBlur.bind(this); - this.onInputChanged = this.onInputChanged.bind(this); - this.onSubmit = this.onSubmit.bind(this); + this.focusInput = this.focusInput.bind(this); + this.onInputBlur = this.onInputBlur.bind(this); + this.onInputChanged = this.onInputChanged.bind(this); + this.onSubmit = this.onSubmit.bind(this); this.onInputChangedDebounced = debounce(this.onInputChanged, 500); } @@ -73,7 +75,6 @@ class Search extends React.PureComponent> { private onSubmit (event: SyntheticEvent): void { event.preventDefault(); - this.onInputChanged(); } @@ -84,13 +85,8 @@ class Search extends React.PureComponent> { } private onInputChanged (): void { - const params = { - query: this.inputElement.value - }; - - if (!params.query) { - delete params.query; - } + const query = this.inputElement.value; + const params = query ? ({query}) : ({}); this.props.history.push(`/search?${queryString.stringify(params)}`); } diff --git a/client/src/components/sidebar/sidebar.component.tsx b/client/src/components/sidebar/sidebar.component.tsx index 2dde12b8..84574a18 100644 --- a/client/src/components/sidebar/sidebar.component.tsx +++ b/client/src/components/sidebar/sidebar.component.tsx @@ -62,12 +62,18 @@ const SIDEBAR_MENU_ITEMS: ISidebarMenuItem[] = [ } ]; -class Sidebar extends React.Component { - state: any = { +interface ISidebarState { + isClient: boolean; +} + +type ISidebarProps = SettingsActions & ApiActions & { settings: SettingsState, api: ApiState }; + +class Sidebar extends React.Component { + state: ISidebarState = { isClient: false }; - constructor (props: any) { + constructor (props: ISidebarProps) { super(props); this.toggleCollapse = this.toggleCollapse.bind(this); @@ -165,7 +171,7 @@ class Sidebar extends React.Component