make user type channel name to abandon channel

This commit is contained in:
jessop 2020-03-12 20:56:02 -04:00
parent 4c928c874b
commit 7595458caa
3 changed files with 45 additions and 34 deletions

View file

@ -1041,5 +1041,9 @@
"view all claims": "view all claims", "view all claims": "view all claims",
"Top claims at lbry://%name%": "Top claims at lbry://%name%", "Top claims at lbry://%name%": "Top claims at lbry://%name%",
"Last Updated": "Last Updated", "Last Updated": "Last Updated",
"Total Publishes": "Total Publishes" "Total Publishes": "Total Publishes",
"Almost there": "Almost there",
"Are you sure you want to delete this channel?": "Are you sure you want to delete this channel?",
"Are you sure? Type %name% to confirm that you wish to delete the channel.": "Are you sure? Type %name% to confirm that you wish to delete the channel.",
"You're about to permanently delete a channel. Content published under this channel will be orphaned and their signing channel invalid. Content sync programs using this channel will fail.": "You're about to permanently delete a channel. Content published under this channel will be orphaned and their signing channel invalid. Content sync programs using this channel will fail."
} }

View file

@ -1,2 +1,3 @@
export const TIP = 'tip'; export const TIP = 'tip';
export const SUPPORT = 'support'; export const SUPPORT = 'support';
export const CHANNEL = 'channel';

View file

@ -1,6 +1,7 @@
// @flow // @flow
import React from 'react'; import React, { useState } from 'react';
import { Modal } from 'modal/modal'; import { Modal } from 'modal/modal';
import { FormField } from 'component/common/form';
import * as txnTypes from 'constants/transaction_types'; import * as txnTypes from 'constants/transaction_types';
type Props = { type Props = {
@ -11,14 +12,12 @@ type Props = {
transactionItems: Array<Transaction>, transactionItems: Array<Transaction>,
}; };
class ModalRevokeClaim extends React.PureComponent<Props> { export default function ModalRevokeClaim(props: Props) {
constructor() { const { transactionItems, txid, nout, closeModal } = props;
super(); const { type, claim_name: name } = transactionItems.find(claim => claim.txid === txid && claim.nout === nout) || {};
const [channelName, setChannelName] = useState('');
(this: any).revokeClaim = this.revokeClaim.bind(this); function getButtonLabel(type: string) {
}
getButtonLabel(type: string) {
if (type === txnTypes.TIP) { if (type === txnTypes.TIP) {
return 'Confirm Tip Unlock'; return 'Confirm Tip Unlock';
} else if (type === txnTypes.SUPPORT) { } else if (type === txnTypes.SUPPORT) {
@ -27,7 +26,7 @@ class ModalRevokeClaim extends React.PureComponent<Props> {
return 'Confirm Claim Revoke'; return 'Confirm Claim Revoke';
} }
getMsgBody(type: string) { function getMsgBody(type: string, name: string) {
if (type === txnTypes.TIP) { if (type === txnTypes.TIP) {
return ( return (
<React.Fragment> <React.Fragment>
@ -50,7 +49,20 @@ class ModalRevokeClaim extends React.PureComponent<Props> {
</p> </p>
</React.Fragment> </React.Fragment>
); );
} else if (type === txnTypes.CHANNEL) {
return (
<React.Fragment>
<p>
{__(
"You're about to permanently delete a channel. Content published under this channel will be orphaned and their signing channel invalid. Content sync programs using this channel will fail."
)}
</p>
<p>{__('Are you sure? Type %name% to confirm that you wish to delete the channel.', { name })}</p>
<FormField type={'text'} onChange={e => setChannelName(e.target.value)} />
</React.Fragment>
);
} }
return ( return (
<React.Fragment> <React.Fragment>
<p>{__('Are you sure want to revoke this claim?')}</p> <p>{__('Are you sure want to revoke this claim?')}</p>
@ -64,31 +76,25 @@ class ModalRevokeClaim extends React.PureComponent<Props> {
); );
} }
revokeClaim() { function revokeClaim() {
const { txid, nout } = this.props; const { txid, nout } = props;
this.props.closeModal(); props.closeModal();
this.props.abandonClaim(txid, nout); props.abandonClaim(txid, nout);
} }
render() { return (
const { transactionItems, txid, nout, closeModal } = this.props; <Modal
const { type } = transactionItems.find(claim => claim.txid === txid && claim.nout === nout) || {}; isOpen
title={getButtonLabel(type)}
return ( contentLabel={getButtonLabel(type)}
<Modal type="confirm"
isOpen confirmButtonLabel={getButtonLabel(type)}
title={this.getButtonLabel(type)} onConfirmed={revokeClaim}
contentLabel={this.getButtonLabel(type)} onAborted={closeModal}
type="confirm" confirmButtonDisabled={type === txnTypes.CHANNEL && name !== channelName}
confirmButtonLabel={this.getButtonLabel(type)} >
onConfirmed={this.revokeClaim} <section>{getMsgBody(type, name)}</section>
onAborted={closeModal} </Modal>
> );
<section>{this.getMsgBody(type)}</section>
</Modal>
);
}
} }
export default ModalRevokeClaim;