MyCrypto/common/containers/QrSignerModal/index.tsx

116 lines
2.4 KiB
TypeScript

import React from 'react';
import { connect } from 'react-redux';
import translate, { translateRaw } from 'translations';
import { AppState } from 'reducers';
import { ParityQrSigner } from 'components';
import Modal, { IButton } from 'components/ui/Modal';
import { TFinalizeSignature, finalizeSignature } from 'actions/paritySigner';
interface State {
scan: boolean;
}
interface PropsClosed {
isOpen: false;
}
interface PropsOpen {
isOpen: true;
rlp: string;
from: string;
}
interface ActionProps {
finalizeSignature: TFinalizeSignature;
}
type Props = (PropsClosed | PropsOpen) & ActionProps;
class QrSignerModal extends React.Component<Props, State> {
constructor(props: Props) {
super(props);
this.state = {
scan: false
};
}
public render() {
if (!this.props.isOpen) {
return null;
}
const { scan } = this.state;
const { from, rlp } = this.props;
const buttons: IButton[] = [
{
disabled: false,
text: translate(scan ? 'ACTION_4' : 'ADD_PARITY_3'),
type: 'primary',
onClick: () => this.setState({ scan: !scan })
},
{
disabled: false,
text: translate('ACTION_2'),
type: 'default',
onClick: this.onClose
}
];
return (
<div className="QrSignerModal">
<Modal
title={translateRaw('DEP_SIGNTX')}
isOpen={true}
buttons={buttons}
handleClose={this.onClose}
>
<div className="QrSignerModal-qr-bounds">
{scan ? (
<ParityQrSigner scan={true} onScan={this.onScan} />
) : (
<ParityQrSigner scan={false} account={from} rlp={rlp} />
)}
</div>
</Modal>
</div>
);
}
private onClose = () => {
if (!this.props.isOpen) {
return;
}
this.props.finalizeSignature(null);
this.setState({ scan: false });
};
private onScan = (signature: string) => {
if (!this.props.isOpen) {
return;
}
this.props.finalizeSignature(signature);
this.setState({ scan: false });
};
}
function mapStateToProps(state: AppState): PropsClosed | PropsOpen {
const { requested } = state.paritySigner;
if (!requested) {
return { isOpen: false };
}
const { from, rlp } = requested;
return {
isOpen: true,
from,
rlp
};
}
export default connect(mapStateToProps, { finalizeSignature })(QrSignerModal);