flowtype fixes

for all modals
pull/154/head
Szymon Lesisz 6 years ago
parent b1691797d3
commit 0cb723b9db

@ -1,9 +1,13 @@
/* @flow */
import React from 'react';
import styled from 'styled-components';
import H3 from 'components/Heading';
import colors from 'config/colors';
import P from 'components/Paragraph';
import { FONT_SIZE } from 'config/variables';
import React from 'react';
import type { Props } from '../../index';
const Wrapper = styled.div`
width: 390px;
@ -24,7 +28,7 @@ const Label = styled.div`
color: ${colors.TEXT_SECONDARY};
`;
const ConfirmAddress = (props) => {
const ConfirmAddress = (props: Props) => {
const {
account,
network,

@ -1,12 +1,16 @@
/* @flow */
import React from 'react';
import colors from 'config/colors';
import styled from 'styled-components';
import colors from 'config/colors';
import P from 'components/Paragraph';
import Icon from 'components/Icon';
import icons from 'config/icons';
import { H3 } from 'components/Heading';
import { LINE_HEIGHT } from 'config/variables';
import type { Props } from '../../index';
const Wrapper = styled.div`
width: 390px;
padding: 12px 10px;
@ -25,7 +29,7 @@ const Content = styled.div`
const StyledP = styled(P)`
word-wrap: break-word;
padding: 5px 0;
line-height: ${LINE_HEIGHT.SMALL}
line-height: ${LINE_HEIGHT.SMALL};
`;
const Label = styled.div`
@ -34,7 +38,7 @@ const Label = styled.div`
color: ${colors.TEXT_SECONDARY};
`;
const ConfirmSignTx = (props) => {
const ConfirmSignTx = (props: Props) => {
if (!props.modal.opened) return null;
const { device } = props.modal;

@ -57,9 +57,8 @@ class ConfirmUnverifiedAddress extends Component<Props> {
verifyAddress() {
if (!this.props.modal.opened) return;
const {
account,
} = this.props.selectedAccount;
const { account } = this.props.selectedAccount;
if (!account) return;
this.props.modalActions.onCancel();
this.props.receiveActions.showAddress(account.addressPath);
}

@ -79,12 +79,6 @@ export default class DuplicateDevice extends Component<Props, State> {
};
}
state: State;
input: ?HTMLInputElement;
keyboardHandler: (event: KeyboardEvent) => void;
componentDidMount(): void {
// one time autofocus
if (this.input) this.input.focus();
@ -108,6 +102,8 @@ export default class DuplicateDevice extends Component<Props, State> {
});
}
input: ?HTMLInputElement;
keyboardHandler(event: KeyboardEvent): void {
if (event.keyCode === 13 && !this.state.isUsed) {
event.preventDefault();
@ -115,6 +111,8 @@ export default class DuplicateDevice extends Component<Props, State> {
}
}
keyboardHandler: (event: KeyboardEvent) => void;
submit() {
if (!this.props.modal.opened) return;
const extended: Object = { instanceName: this.state.instanceName, instance: this.state.instance };

@ -1,9 +1,13 @@
/* @flow */
import React, { Component } from 'react';
import styled from 'styled-components';
import { H3 } from 'components/Heading';
import P from 'components/Paragraph';
import Button from 'components/Button';
import type { Props } from '../../index';
const Wrapper = styled.div`
width: 360px;
padding: 24px 48px;
@ -23,7 +27,7 @@ const Row = styled.div`
padding: 10px 0;
`;
class ForgetDevice extends Component {
class ForgetDevice extends Component<Props> {
componentDidMount() {
this.keyboardHandler = this.keyboardHandler.bind(this);
window.addEventListener('keydown', this.keyboardHandler, false);
@ -33,13 +37,15 @@ class ForgetDevice extends Component {
window.removeEventListener('keydown', this.keyboardHandler, false);
}
keyboardHandler(event) {
keyboardHandler(event: KeyboardEvent) {
if (event.keyCode === 13) {
event.preventDefault();
this.forget();
}
}
keyboardHandler: (event: KeyboardEvent) => void;
forget() {
if (this.props.modal.opened) {
this.props.modalActions.onForgetSingleDevice(this.props.modal.device);
@ -56,7 +62,7 @@ class ForgetDevice extends Component {
<StyledP isSmaller>Forgetting only removes the device from the list on the left, your coins are still safe and you can access them by reconnecting your TREZOR again.</StyledP>
<Row>
<StyledButton onClick={() => this.forget()}>Forget</StyledButton>
<StyledButton isWhite onClick={onCancel}>Don't forget</StyledButton>
<StyledButton isWhite onClick={onCancel}>Don&apos;t forget</StyledButton>
</Row>
</Wrapper>
);

@ -48,10 +48,6 @@ const StyledLoader = styled(Loader)`
`;
export default class RememberDevice extends Component<Props, State> {
keyboardHandler: (event: KeyboardEvent) => void;
state: State;
constructor(props: Props) {
super(props);
@ -60,13 +56,6 @@ export default class RememberDevice extends Component<Props, State> {
};
}
keyboardHandler(event: KeyboardEvent): void {
if (event.keyCode === 13) {
event.preventDefault();
this.forget();
}
}
componentDidMount(): void {
const ticker = () => {
if (this.state.countdown - 1 <= 0) {
@ -99,6 +88,15 @@ export default class RememberDevice extends Component<Props, State> {
}
}
keyboardHandler(event: KeyboardEvent): void {
if (event.keyCode === 13) {
event.preventDefault();
this.forget();
}
}
keyboardHandler: (event: KeyboardEvent) => void;
forget() {
if (this.props.modal.opened) {
this.props.modalActions.onForgetDevice(this.props.modal.device);

@ -1,3 +1,5 @@
/* @flow */
import React from 'react';
import styled from 'styled-components';
import { H3 } from 'components/Heading';

@ -1,8 +1,15 @@
import React from 'react';
/* @flow */
import * as React from 'react';
import styled from 'styled-components';
import PropTypes from 'prop-types';
import colors from 'config/colors';
type Props = {
onClick: () => void;
children: React.Node;
};
const Wrapper = styled.button`
width: 80px;
height: 80px;
@ -32,19 +39,13 @@ const Wrapper = styled.button`
}
`;
const PinButton = ({
children, className, onClick,
}) => (
<Wrapper
className={className}
onClick={onClick}
>
{children}
const PinButton = ({ children, onClick }: Props) => (
<Wrapper onClick={onClick}>
{ children }
</Wrapper>
);
PinButton.propTypes = {
className: PropTypes.string,
children: PropTypes.string.isRequired,
onClick: PropTypes.func,
};

@ -1,3 +1,5 @@
/* @flow */
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
@ -6,6 +8,11 @@ import Icon from 'components/Icon';
import { FONT_SIZE, FONT_WEIGHT } from 'config/variables';
import icons from 'config/icons';
type Props = {
value: string;
onDeleteClick: () => void;
};
const Wrapper = styled.div`
position: relative;
`;
@ -28,11 +35,7 @@ const StyledIcon = styled(Icon)`
cursor: pointer;
`;
const Input = ({
onChange,
onDeleteClick,
value,
}) => (
const Input = ({ value, onDeleteClick }: Props) => (
<Wrapper>
<StyledInput
disabled
@ -40,16 +43,14 @@ const Input = ({
maxLength="9"
autoComplete="off"
value={value}
onChange={onChange}
/>
<StyledIcon onClick={() => onDeleteClick()} color={colors.TEXT_PRIMARY} icon={icons.BACK} />
<StyledIcon onClick={onDeleteClick} color={colors.TEXT_PRIMARY} icon={icons.BACK} />
</Wrapper>
);
Input.propTypes = {
onDeleteClick: PropTypes.func.isRequired,
value: PropTypes.string.isRequired,
onChange: PropTypes.func,
};
export default Input;

Loading…
Cancel
Save