redirect on publish/edit

This commit is contained in:
zeppi 2021-03-29 17:42:07 -04:00
parent f092e8cb7b
commit bd0fe4718f
5 changed files with 204 additions and 160 deletions

View file

@ -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) {
<Card
body={
<TagsSearch
suggestMature
suggestMature={!SIMPLE_SITE}
disableAutoFocus
limitSelect={MAX_TAG_SELECT}
tagsPassedIn={params.tags || []}

View file

@ -249,6 +249,13 @@ function PublishForm(props: Props) {
}
}, [name, activeChannelName, resolveUri, updatePublishForm, checkAvailability]);
useEffect(() => {
// 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 && <PublishDescription disabled={formDisabled} />}
<Card actions={<SelectThumbnail />} />
<TagsSelect
suggestMature
suggestMature={!SIMPLE_SITE}
disableAutoFocus
hideHeader
label={__('Selected Tags')}

View file

@ -16,6 +16,8 @@ const select = (state) => ({
...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),

View file

@ -41,43 +41,12 @@ type Props = {
setEnablePublishPreview: (boolean) => void,
isStillEditing: boolean,
myChannels: ?Array<ChannelClaim>,
publishSuccess: boolean,
publishing: boolean,
};
class ModalPublishPreview extends React.PureComponent<Props> {
onConfirmed() {
const { filePath, publish, closeModal } = this.props;
// Publish for real:
publish(this.resolveFilePathName(filePath), false);
closeModal();
}
resolveFilePathName(filePath: string | WebFile) {
if (!filePath) {
return NO_FILE;
}
if (typeof filePath === 'string') {
return filePath;
} else {
return filePath.name;
}
}
createRow(label: string, value: any) {
return (
<tr>
<td>{label}</td>
<td>{value}</td>
</tr>
);
}
togglePreviewEnabled() {
const { enablePublishPreview, setEnablePublishPreview } = this.props;
setEnablePublishPreview(!enablePublishPreview);
}
render() {
// class ModalPublishPreview extends React.PureComponent<Props> {
const ModalPublishPreview = (props: Props) => {
const {
filePath,
isMarkdownPost,
@ -97,18 +66,60 @@ class ModalPublishPreview extends React.PureComponent<Props> {
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
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(getFilePathName(filePath), false);
console.log('filePAath', filePath);
}
function getFilePathName(filePath: string | WebFile) {
if (!filePath) {
return NO_FILE;
}
if (typeof filePath === 'string') {
return filePath;
} else {
return filePath.name;
}
}
function createRow(label: string, value: any) {
return (
<tr>
<td>{label}</td>
<td>{value}</td>
</tr>
);
}
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) {
@ -120,6 +131,7 @@ class ModalPublishPreview extends React.PureComponent<Props> {
}
let confirmBtnText;
if (!publishing) {
if (isStillEditing) {
confirmBtnText = __('Save');
} else if (livestream) {
@ -127,6 +139,16 @@ class ModalPublishPreview extends React.PureComponent<Props> {
} else {
confirmBtnText = __('Upload');
}
} else {
if (isStillEditing) {
confirmBtnText = __('Saving');
} else if (livestream) {
confirmBtnText = __('Creating');
} else {
confirmBtnText = __('Uploading');
}
}
const descriptionValue = description ? (
<div className="media__info-text-preview">
<MarkdownPreview content={description} simpleLinks />
@ -178,7 +200,7 @@ class ModalPublishPreview extends React.PureComponent<Props> {
return (
<Modal isOpen contentLabel={modalTitle} type="card" onAborted={closeModal}>
<Form onSubmit={() => this.onConfirmed()}>
<Form onSubmit={onConfirmed}>
<Card
title={modalTitle}
body={
@ -186,17 +208,17 @@ class ModalPublishPreview extends React.PureComponent<Props> {
<div className="section">
<table className="table table--condensed table--publish-preview">
<tbody>
{!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)}
{!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)}
</tbody>
</table>
</div>
@ -213,7 +235,7 @@ class ModalPublishPreview extends React.PureComponent<Props> {
actions={
<>
<div className="section__actions">
<Button autoFocus button="primary" label={confirmBtnText} onClick={() => this.onConfirmed()} />
<Button autoFocus button="primary" disabled={publishing} label={confirmBtnText} onClick={onConfirmed} />
<Button button="link" label={__('Cancel')} onClick={closeModal} />
</div>
<p className="help">{__('Once the transaction is sent, it cannot be reversed.')}</p>
@ -230,7 +252,6 @@ class ModalPublishPreview extends React.PureComponent<Props> {
</Form>
</Modal>
);
}
}
};
export default ModalPublishPreview;

View file

@ -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));