From bd0fe4718f17e51d26bd388589e99f402a0f6228 Mon Sep 17 00:00:00 2001 From: zeppi Date: Mon, 29 Mar 2021 17:42:07 -0400 Subject: [PATCH] redirect on publish/edit --- ui/component/channelEdit/view.jsx | 3 +- ui/component/publishForm/view.jsx | 9 +- ui/modal/modalPublishPreview/index.js | 2 + ui/modal/modalPublishPreview/view.jsx | 333 ++++++++++++++------------ ui/redux/actions/publish.js | 17 +- 5 files changed, 204 insertions(+), 160 deletions(-) diff --git a/ui/component/channelEdit/view.jsx b/ui/component/channelEdit/view.jsx index eacb04031..0098b99d9 100644 --- a/ui/component/channelEdit/view.jsx +++ b/ui/component/channelEdit/view.jsx @@ -20,6 +20,7 @@ import analytics from 'analytics'; import LbcSymbol from 'component/common/lbc-symbol'; import SUPPORTED_LANGUAGES from 'constants/supported_languages'; import WalletSpendableBalanceHelp from 'component/walletSpendableBalanceHelp'; +import { SIMPLE_SITE } from 'config'; const LANG_NONE = 'none'; @@ -358,7 +359,7 @@ function ChannelForm(props: Props) { { + // because editingURI is lbry://channel_short/claim_long and that particular shape won't map to the claimId yet + if (editingURI) { + resolveUri(editingURI); + } + }, [editingURI, resolveUri]); + useEffect(() => { updatePublishForm({ isMarkdownPost: mode === PUBLISH_MODES.POST, @@ -434,7 +441,7 @@ function PublishForm(props: Props) { {mode === PUBLISH_MODES.FILE && } } /> ({ ...selectPublishFormValues(state), myChannels: selectMyChannelClaims(state), isVid: makeSelectPublishFormValue('fileVid')(state), + publishSuccess: makeSelectPublishFormValue('publishSuccess')(state), + publishing: makeSelectPublishFormValue('publishing')(state), isStillEditing: selectIsStillEditing(state), ffmpegStatus: selectFfmpegStatus(state), enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state), diff --git a/ui/modal/modalPublishPreview/view.jsx b/ui/modal/modalPublishPreview/view.jsx index 2d0ec8731..aa8003bb2 100644 --- a/ui/modal/modalPublishPreview/view.jsx +++ b/ui/modal/modalPublishPreview/view.jsx @@ -41,17 +41,63 @@ type Props = { setEnablePublishPreview: (boolean) => void, isStillEditing: boolean, myChannels: ?Array, + publishSuccess: boolean, + publishing: boolean, }; -class ModalPublishPreview extends React.PureComponent { - onConfirmed() { - const { filePath, publish, closeModal } = this.props; +// class ModalPublishPreview extends React.PureComponent { +const ModalPublishPreview = (props: Props) => { + const { + filePath, + isMarkdownPost, + optimize, + title, + description, + channel, + bid, + uri, + contentIsFree, + fee, + language, + licenseType, + otherLicenseDescription, + licenseUrl, + tags, + isVid, + ffmpegStatus = {}, + previewResponse, + enablePublishPreview, + setEnablePublishPreview, + isStillEditing, + myChannels, + publishSuccess, + publishing, + publish, + closeModal, + } = props; + const livestream = + // $FlowFixMe + previewResponse.outputs[0] && previewResponse.outputs[0].value && !previewResponse.outputs[0].value.source; + React.useEffect(() => { + console.log('publishSuccess', publishSuccess); + if (publishing && !livestream) { + console.log('doPublishing'); + closeModal(); + } + if (publishSuccess && livestream) { + console.log('doPublishSuccess'); + closeModal(); + } + }, [publishSuccess, publishing, livestream]); + + // const waitForSuccess = false; + function onConfirmed() { // Publish for real: - publish(this.resolveFilePathName(filePath), false); - closeModal(); + publish(getFilePathName(filePath), false); + console.log('filePAath', filePath); } - resolveFilePathName(filePath: string | WebFile) { + function getFilePathName(filePath: string | WebFile) { if (!filePath) { return NO_FILE; } @@ -63,7 +109,7 @@ class ModalPublishPreview extends React.PureComponent { } } - createRow(label: string, value: any) { + function createRow(label: string, value: any) { return ( {label} @@ -72,54 +118,20 @@ class ModalPublishPreview extends React.PureComponent { ); } - togglePreviewEnabled() { - const { enablePublishPreview, setEnablePublishPreview } = this.props; - setEnablePublishPreview(!enablePublishPreview); + const txFee = previewResponse ? previewResponse['total_fee'] : null; + // $FlowFixMe add outputs[0] etc to PublishResponse type + const isOptimizeAvail = filePath && filePath !== '' && isVid && ffmpegStatus.available; + let modalTitle; + if (isStillEditing) { + modalTitle = __('Confirm Edit'); + } else if (livestream) { + modalTitle = __('Create Livestream'); + } else { + modalTitle = __('Confirm Upload'); } - render() { - const { - filePath, - isMarkdownPost, - optimize, - title, - description, - channel, - bid, - uri, - contentIsFree, - fee, - language, - licenseType, - otherLicenseDescription, - licenseUrl, - tags, - isVid, - ffmpegStatus = {}, - previewResponse, - closeModal, - enablePublishPreview, - setEnablePublishPreview, - isStillEditing, - myChannels, - } = this.props; - - const txFee = previewResponse ? previewResponse['total_fee'] : null; - // $FlowFixMe add outputs[0] etc to PublishResponse type - const livestream = - // $FlowFixMe - previewResponse.outputs[0] && previewResponse.outputs[0].value && !previewResponse.outputs[0].value.source; - const isOptimizeAvail = filePath && filePath !== '' && isVid && ffmpegStatus.available; - let modalTitle; - if (isStillEditing) { - modalTitle = __('Confirm Edit'); - } else if (livestream) { - modalTitle = __('Create Livestream'); - } else { - modalTitle = __('Confirm Upload'); - } - - let confirmBtnText; + let confirmBtnText; + if (!publishing) { if (isStillEditing) { confirmBtnText = __('Save'); } else if (livestream) { @@ -127,110 +139,119 @@ class ModalPublishPreview extends React.PureComponent { } else { confirmBtnText = __('Upload'); } - const descriptionValue = description ? ( -
- -
- ) : null; - - const licenseValue = - licenseType === COPYRIGHT ? ( -

© {otherLicenseDescription}

- ) : licenseType === OTHER ? ( -

- {otherLicenseDescription} -
- {licenseUrl} -

- ) : ( -

{licenseType}

- ); - - const tagsValue = - // Do nothing for onClick(). Setting to 'null' results in "View Tag" action -- we don't want to leave the modal. - tags.map((tag) => {}} />); - - const depositValue = bid ? :

---

; - - let priceValue = __('Free'); - if (!contentIsFree) { - if (fee.currency === 'LBC') { - priceValue = ; - } else { - priceValue = `${fee.amount} ${fee.currency}`; - } + } else { + if (isStillEditing) { + confirmBtnText = __('Saving'); + } else if (livestream) { + confirmBtnText = __('Creating'); + } else { + confirmBtnText = __('Uploading'); } - - const channelValue = (channel) => { - const channelClaim = myChannels && myChannels.find((x) => x.name === channel); - return channel ? ( -
- {channelClaim && } - {channel} -
- ) : ( -
- - {__('Anonymous')} -
- ); - }; - - return ( - -
this.onConfirmed()}> - -
- - - {!livestream && !isMarkdownPost && this.createRow(__('File'), this.resolveFilePathName(filePath))} - {isOptimizeAvail && this.createRow(__('Transcode'), optimize ? __('Yes') : __('No'))} - {this.createRow(__('Title'), title)} - {this.createRow(__('Description'), descriptionValue)} - {this.createRow(__('Channel'), channelValue(channel))} - {this.createRow(__('URL'), uri)} - {this.createRow(__('Deposit'), depositValue)} - {this.createRow(__('Price'), priceValue)} - {this.createRow(__('Language'), language)} - {this.createRow(__('License'), licenseValue)} - {this.createRow(__('Tags'), tagsValue)} - -
-
- {txFee && ( -
- {__('Est. transaction fee:')}   - - - -
- )} - - } - actions={ - <> -
-
-

{__('Once the transaction is sent, it cannot be reversed.')}

- setEnablePublishPreview(!enablePublishPreview)} - /> - - } - /> - -
- ); } -} + + const descriptionValue = description ? ( +
+ +
+ ) : null; + + const licenseValue = + licenseType === COPYRIGHT ? ( +

© {otherLicenseDescription}

+ ) : licenseType === OTHER ? ( +

+ {otherLicenseDescription} +
+ {licenseUrl} +

+ ) : ( +

{licenseType}

+ ); + + const tagsValue = + // Do nothing for onClick(). Setting to 'null' results in "View Tag" action -- we don't want to leave the modal. + tags.map((tag) => {}} />); + + const depositValue = bid ? :

---

; + + let priceValue = __('Free'); + if (!contentIsFree) { + if (fee.currency === 'LBC') { + priceValue = ; + } else { + priceValue = `${fee.amount} ${fee.currency}`; + } + } + + const channelValue = (channel) => { + const channelClaim = myChannels && myChannels.find((x) => x.name === channel); + return channel ? ( +
+ {channelClaim && } + {channel} +
+ ) : ( +
+ + {__('Anonymous')} +
+ ); + }; + + return ( + +
+ +
+ + + {!livestream && !isMarkdownPost && createRow(__('File'), getFilePathName(filePath))} + {isOptimizeAvail && createRow(__('Transcode'), optimize ? __('Yes') : __('No'))} + {createRow(__('Title'), title)} + {createRow(__('Description'), descriptionValue)} + {createRow(__('Channel'), channelValue(channel))} + {createRow(__('URL'), uri)} + {createRow(__('Deposit'), depositValue)} + {createRow(__('Price'), priceValue)} + {createRow(__('Language'), language)} + {createRow(__('License'), licenseValue)} + {createRow(__('Tags'), tagsValue)} + +
+
+ {txFee && ( +
+ {__('Est. transaction fee:')}   + + + +
+ )} + + } + actions={ + <> +
+
+

{__('Once the transaction is sent, it cannot be reversed.')}

+ setEnablePublishPreview(!enablePublishPreview)} + /> + + } + /> + +
+ ); +}; export default ModalPublishPreview; diff --git a/ui/redux/actions/publish.js b/ui/redux/actions/publish.js index 8395bcfff..dda2b98d5 100644 --- a/ui/redux/actions/publish.js +++ b/ui/redux/actions/publish.js @@ -9,6 +9,8 @@ import { doCheckPendingClaims, doCheckReflectingFiles, ACTIONS as LBRY_REDUX_ACTIONS, + makeSelectPublishFormValue, + makeSelectClaimForUri, } from 'lbry-redux'; import { doError } from 'redux/actions/notifications'; import { push } from 'connected-react-router'; @@ -24,7 +26,12 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat ); }; - const noFile = !filePath || filePath === NO_FILE; + const noFileParam = !filePath || filePath === NO_FILE; + const state = getState(); + const editingUri = makeSelectPublishFormValue('editingURI')(state) || ''; + const claim = makeSelectClaimForUri(editingUri)(state) || {}; + const hasSourceFile = claim.value && claim.value.source; + const redirectToLivestream = noFileParam && !hasSourceFile; const publishSuccess = (successResponse, lbryFirstError) => { const state = getState(); @@ -41,6 +48,7 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat actions.push({ type: ACTIONS.PUBLISH_SUCCESS, }); + // We have to fake a temp claim until the new pending one is returned by claim_list_mine // We can't rely on claim_list_mine because there might be some delay before the new claims are returned // Doing this allows us to show the pending claim immediately, it will get overwritten by the real one @@ -73,6 +81,9 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat // @if TARGET='app' dispatch(doCheckReflectingFiles()); // @endif + if (redirectToLivestream) { + dispatch(push(`/$/${PAGES.LIVESTREAM}`)); + } }; const publishFail = (error) => { @@ -93,7 +104,9 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat // on the publishes page. This doesn't exist on desktop so wait until we get a response // from the SDK // @if TARGET='web' - dispatch(push(noFile ? `/$/${PAGES.LIVESTREAM}` : `/$/${PAGES.UPLOADS}`)); + if (!redirectToLivestream) { + dispatch(push(`/$/${PAGES.UPLOADS}`)); + } // @endif dispatch(doPublish(publishSuccess, publishFail));