diff --git a/src/ui/modal/modalRemoveFile/view.jsx b/src/ui/modal/modalRemoveFile/view.jsx index 368683d1a..ffd3ab354 100644 --- a/src/ui/modal/modalRemoveFile/view.jsx +++ b/src/ui/modal/modalRemoveFile/view.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { Modal } from 'modal/modal'; import { FormField } from 'component/common/form'; +import usePersistedState from 'util/use-persisted-state'; type Props = { claim: StreamClaim, @@ -14,80 +15,50 @@ type Props = { }, }; -type State = { - deleteChecked: boolean, - abandonClaimChecked: boolean, -}; +function ModalRemoveFile(props: Props) { + const { claim, claimIsMine, closeModal, deleteFile, fileInfo, title } = props; + const [deleteChecked, setDeleteChecked] = usePersistedState('modal-remove-file:delete', true); + const [abandonChecked, setAbandonChecked] = usePersistedState('modal-remove-file:abandon', true); + const { txid, nout } = claim; + const outpoint = fileInfo ? fileInfo.outpoint : `${txid}:${nout}`; -class ModalRemoveFile extends React.PureComponent { - constructor(props: Props) { - super(props); - this.state = { - deleteChecked: false, - abandonClaimChecked: true, - }; + return ( + deleteFile(outpoint || '', deleteChecked, abandonChecked)} + onAborted={closeModal} + > +
+

+ {__("Are you sure you'd like to remove")} {`"${title}"`} {__('from the LBRY app?')} +

+
+
+ setDeleteChecked(!deleteChecked)} + /> - (this: any).handleDeleteCheckboxClicked = this.handleDeleteCheckboxClicked.bind(this); - (this: any).handleAbandonClaimCheckboxClicked = this.handleAbandonClaimCheckboxClicked.bind(this); - } - - handleDeleteCheckboxClicked() { - const { deleteChecked } = this.state; - this.setState({ - deleteChecked: !deleteChecked, - }); - } - - handleAbandonClaimCheckboxClicked() { - const { abandonClaimChecked } = this.state; - this.setState({ - abandonClaimChecked: !abandonClaimChecked, - }); - } - - render() { - const { claim, claimIsMine, closeModal, deleteFile, fileInfo, title } = this.props; - const { deleteChecked, abandonClaimChecked } = this.state; - const { txid, nout } = claim; - const outpoint = fileInfo ? fileInfo.outpoint : `${txid}:${nout}`; - - return ( - deleteFile(outpoint || '', deleteChecked, abandonClaimChecked)} - onAborted={closeModal} - > -
-

- {__("Are you sure you'd like to remove")} {`"${title}"`} {__('from the LBRY app?')} -

-
-
+ {claimIsMine && ( setAbandonChecked(!abandonChecked)} /> - - {claimIsMine && ( - - )} -
-
- ); - } + )} +
+
+ ); } export default ModalRemoveFile; diff --git a/src/ui/util/use-persisted-state.js b/src/ui/util/use-persisted-state.js index adbb5f5df..9b00aa8c9 100644 --- a/src/ui/util/use-persisted-state.js +++ b/src/ui/util/use-persisted-state.js @@ -14,7 +14,7 @@ export default function usePersistedState(key, firstTimeDefault) { } } - if (!defaultValue) { + if (!defaultValue && defaultValue !== false) { defaultValue = firstTimeDefault; } diff --git a/static/locales/en.json b/static/locales/en.json index ddc4cb8c7..b6654a9f1 100644 --- a/static/locales/en.json +++ b/static/locales/en.json @@ -540,5 +540,6 @@ "During the alpha, comments are not decentralized or censorship resistant (but we repeat ourselves).": "During the alpha, comments are not decentralized or censorship resistant (but we repeat ourselves).", "When the alpha ends, we will attempt to transition comments, but do not promise to do so. Any transition will likely involve publishing previous comments under a single archive handle.": "When the alpha ends, we will attempt to transition comments, but do not promise to do so. Any transition will likely involve publishing previous comments under a single archive handle.", "Upgrade is ready to install": "Upgrade is ready to install", - "Upgrade is ready": "Upgrade is ready" + "Upgrade is ready": "Upgrade is ready", + "Abandon the claim for this URI": "Abandon the claim for this URI" } \ No newline at end of file