lbry-desktop/ui/modal/modalConfirmSendTip/view.jsx

62 lines
1.8 KiB
React
Raw Normal View History

// @flow
import React from 'react';
2020-05-13 23:43:50 +02:00
import { parseURI } from 'lbry-redux';
import Button from 'component/button';
import { Form } from 'component/common/form';
import { Modal } from 'modal/modal';
2020-05-01 19:55:42 +02:00
import Card from 'component/common/card';
type Props = {
2020-05-13 23:43:50 +02:00
uri: string,
claimId: string,
title: string,
tipAmount: number,
isSupport: boolean,
closeModal: () => void,
sendSupport: (number, string, boolean) => void,
};
class ModalConfirmSendTip extends React.PureComponent<Props> {
onConfirmed() {
const { closeModal, sendSupport, tipAmount, claimId, isSupport } = this.props;
sendSupport(tipAmount, claimId, isSupport);
closeModal();
}
render() {
2020-05-13 23:45:06 +02:00
const { tipAmount, title, isSupport, closeModal, uri } = this.props;
2020-05-01 19:55:42 +02:00
const cardTitle = __(isSupport ? 'Confirm Support' : 'Confirm Tip');
2020-05-13 23:43:50 +02:00
const { channelName } = parseURI(uri);
2020-05-01 19:55:42 +02:00
return (
2020-05-01 19:55:42 +02:00
<Modal isOpen type="card" onAborted={closeModal} contentLabel={cardTitle}>
<Form onSubmit={() => this.onConfirmed()}>
2020-05-01 19:55:42 +02:00
<Card
title={cardTitle}
body={
<>
<div className="section">
<label>{__(isSupport ? 'Supporting: ' : 'Tipping: ')}</label>
<blockquote>{tipAmount} LBC</blockquote>
</div>
<div className="section">
<label>{__('To: ')}</label>
2020-05-13 23:43:50 +02:00
<blockquote>{title || channelName}</blockquote>
2020-05-01 19:55:42 +02:00
</div>
</>
}
actions={
<div className="section__actions">
<Button autoFocus button="primary" type="submit" label={__('Send')} />
<Button button="link" label={__('Cancel')} onClick={closeModal} />
</div>
}
/>
</Form>
</Modal>
);
}
}
export default ModalConfirmSendTip;