Enable modal enter #2648

Merged
johndoe01012 merged 4 commits from enable-modal-enter into master 2019-07-29 15:44:10 +02:00
4 changed files with 31 additions and 22 deletions

View file

@ -95,6 +95,7 @@ class WalletSendTip extends React.PureComponent<Props, State> {
label={__('Send')}
disabled={isPending || tipError || !tipAmount}
onClick={this.handleSendButtonClicked}
type="submit"
/>
}
helper={

View file

@ -1,5 +1,7 @@
// @flow
import React from 'react';
import Button from 'component/button';
import { Form } from 'component/common/form';
import { Modal } from 'modal/modal';
type Props = {
@ -23,18 +25,20 @@ class ModalConfirmTransaction extends React.PureComponent<Props> {
isOpen
title={__('Send LBC')}
contentLabel={__('Confirm Transaction')}
type="confirm"
confirmButtonLabel={__('Send')}
onConfirmed={() => this.onConfirmed()}
type="custom"
onAborted={closeModal}
>
<section className="card__content">
<Form className="card__content" onSubmit={() => this.onConfirmed()}>
<p>{__('Sending: ')}</p>
<blockquote>{amount} LBC</blockquote>
<p>{__('To address: ')}</p>
<blockquote>{address}</blockquote>
<p>{__('Once the transaction is sent, it cannot be reversed.')}</p>
</section>
<div className="card__actions">
<Button autoFocus button="primary" label={__('Send')} onClick={() => this.onConfirmed()} />
<Button button="link" label={__('Cancel')} onClick={closeModal} />
</div>
</Form>
</Modal>
);
}

View file

@ -1,7 +1,8 @@
// @flow
import React from 'react';
import { Modal } from 'modal/modal';
import { FormField } from 'component/common/form';
import { Form, FormField } from 'component/common/form';
import Button from 'component/button';
import usePersistedState from 'util/use-persisted-state';
type Props = {
@ -23,22 +24,13 @@ function ModalRemoveFile(props: Props) {
const outpoint = fileInfo ? fileInfo.outpoint : `${txid}:${nout}`;
return (
<Modal
isOpen
title="Remove File"
contentLabel={__('Confirm File Remove')}
type="confirm"
confirmButtonLabel={__('Remove')}
confirmButtonDisabled={!deleteChecked && !abandonChecked}
onConfirmed={() => deleteFile(outpoint || '', deleteChecked, abandonChecked)}
onAborted={closeModal}
>
<Modal isOpen title="Remove File" contentLabel={__('Confirm File Remove')} type="custom" onAborted={closeModal}>
<section className="card__content">
<p>
{__("Are you sure you'd like to remove")} <cite>{`"${title}"`}</cite> {__('from the LBRY app?')}
</p>
</section>
<section className="card__content">
<Form className="card__content" onSubmit={() => deleteFile(outpoint || '', deleteChecked, abandonChecked)}>
<FormField
name="file_delete"
label={__('Also delete this file from my computer')}
@ -56,7 +48,17 @@ function ModalRemoveFile(props: Props) {
onChange={() => setAbandonChecked(!abandonChecked)}
/>
)}
</section>
<div className="card__actions">
<Button
autoFocus
button="primary"
label={__('OK')}
disabled={!deleteChecked && !abandonChecked}
onClick={() => deleteFile(outpoint || '', deleteChecked, abandonChecked)}
/>
<Button button="link" label={__('Cancel')} onClick={closeModal} />
</div>
</Form>
</Modal>
);
}

View file

@ -1,6 +1,6 @@
// @flow
import React from 'react';
import { Form, FormField } from 'component/common/form';
import { Form, FormField, Submit } from 'component/common/form';
import { Modal } from 'modal/modal';
import Button from 'component/button';
@ -94,9 +94,7 @@ class ModalWalletEncrypt extends React.PureComponent<Props, State> {
isOpen
title={__('Encrypt Wallet')}
contentLabel={__('Encrypt Wallet')}
type="confirm"
confirmButtonLabel={__('Encrypt Wallet')}
abortButtonLabel={__('Cancel')}
type="custom"
onConfirmed={() => this.submitEncryptForm()}
onAborted={closeModal}
>
@ -135,6 +133,7 @@ class ModalWalletEncrypt extends React.PureComponent<Props, State> {
)}
</div>
<FormField
inputButton={<Submit label={failMessage ? __('Encrypting Wallet') : __('Encrypt Wallet')} />}
error={understandError === true ? 'You must enter "I understand"' : false}
label={__('Enter "I understand"')}
placeholder={__('Dear computer, I understand')}
@ -144,6 +143,9 @@ class ModalWalletEncrypt extends React.PureComponent<Props, State> {
/>
{failMessage && <div className="error-text">{__(failMessage)}</div>}
</Form>
<div className="card__actions">
<Button button="link" label={__('Cancel')} onClick={closeModal} />
</div>
</Modal>
);
}