copy for buttons and modals for livestream

redirect on success to dashboard
This commit is contained in:
zeppi 2021-03-24 01:22:02 -04:00 committed by jessopb
parent 995f51711f
commit 81b9b0d801
5 changed files with 101 additions and 38 deletions

View file

@ -179,13 +179,26 @@ function PublishForm(props: Props) {
}
}, [modal]);
const isLivestream = mode === PUBLISH_MODES.LIVESTREAM;
let submitLabel;
if (isStillEditing) {
submitLabel = !publishing ? __('Save') : __('Saving...');
if (publishing) {
if (isStillEditing) {
submitLabel = __('Saving...');
} else if (isLivestream) {
submitLabel = __('Creating...');
} else {
submitLabel = __('Uploading...');
}
} else if (previewing) {
submitLabel = __('Preparing...');
} else {
submitLabel = !publishing ? __('Upload') : __('Uploading...');
if (isStillEditing) {
submitLabel = __('Save');
} else if (isLivestream) {
submitLabel = __('Create');
} else {
submitLabel = __('Upload');
}
}
useEffect(() => {
@ -239,7 +252,7 @@ function PublishForm(props: Props) {
useEffect(() => {
updatePublishForm({
isMarkdownPost: mode === PUBLISH_MODES.POST,
isLivestreamPublish: mode === PUBLISH_MODES.LIVESTREAM,
isLivestreamPublish: isLivestream,
});
}, [mode, updatePublishForm]);
@ -248,7 +261,7 @@ function PublishForm(props: Props) {
updatePublishForm({ channel: undefined });
// Anonymous livestreams aren't supported
if (mode === PUBLISH_MODES.LIVESTREAM) {
if (isLivestream) {
setMode(PUBLISH_MODES.FILE);
}
} else if (activeChannelName) {
@ -357,7 +370,7 @@ function PublishForm(props: Props) {
}
}
// Publish file
if (mode === PUBLISH_MODES.FILE || mode === PUBLISH_MODES.LIVESTREAM) {
if (mode === PUBLISH_MODES.FILE || isLivestream) {
runPublish = true;
}
@ -386,7 +399,7 @@ function PublishForm(props: Props) {
// Editing claim uri
return (
<div className="card-stack">
<ChannelSelect hideAnon={mode === PUBLISH_MODES.LIVESTREAM} disabled={disabled} />
<ChannelSelect hideAnon={isLivestream} disabled={disabled} />
<PublishFile
uri={uri}

View file

@ -1,16 +1,17 @@
import { connect } from 'react-redux';
import { doHideModal } from 'redux/actions/app';
import ModalPublishSuccess from './view';
import { doClearPublish } from 'lbry-redux';
import { doClearPublish, makeSelectClaimForUri } from 'lbry-redux';
import { push } from 'connected-react-router';
const perform = dispatch => ({
closeModal: () => dispatch(doHideModal()),
clearPublish: () => dispatch(doClearPublish()),
navigate: path => dispatch(push(path)),
const select = (state, props) => ({
claim: makeSelectClaimForUri(props.uri)(state),
});
export default connect(
null,
perform
)(ModalPublishSuccess);
const perform = (dispatch) => ({
closeModal: () => dispatch(doHideModal()),
clearPublish: () => dispatch(doClearPublish()),
navigate: (path) => dispatch(push(path)),
});
export default connect(select, perform)(ModalPublishSuccess);

View file

@ -10,20 +10,38 @@ import Nag from 'component/common/nag';
type Props = {
closeModal: () => void,
clearPublish: () => void,
navigate: string => void,
navigate: (string) => void,
uri: string,
isEdit: boolean,
filePath: ?string,
lbryFirstError: ?string,
claim: Claim,
};
class ModalPublishSuccess extends React.PureComponent<Props> {
render() {
const { closeModal, clearPublish, navigate, uri, isEdit, filePath, lbryFirstError } = this.props;
const contentLabel = isEdit ? __('Update published') : __('File published');
const publishMessage = isEdit
? __('Your update is now pending on LBRY. It will take a few minutes to appear for other users.')
: __('Your file is now pending on LBRY. It will take a few minutes to appear for other users.');
const { closeModal, clearPublish, navigate, uri, isEdit, filePath, lbryFirstError, claim } = this.props;
// $FlowFixMe
const livestream = claim && claim.value && claim.value_type === 'stream' && !claim.value.source;
let contentLabel;
if (livestream) {
contentLabel = __('Livestream Created');
} else if (isEdit) {
contentLabel = __('Update published');
} else {
contentLabel = __('File published');
}
let publishMessage;
if (isEdit) {
publishMessage = __('Your update is now pending. It will take a few minutes to appear for other users.');
} else if (livestream) {
publishMessage = __(
'Your livestream is now pending. You will be able to start shortly at the streaming dashboard.'
);
} else {
publishMessage = __('Your file is now pending on LBRY. It will take a few minutes to appear for other users.');
}
function handleClose() {
clearPublish();
@ -54,15 +72,28 @@ class ModalPublishSuccess extends React.PureComponent<Props> {
}
actions={
<div className="section__actions">
<Button
button="primary"
label={__('View My Uploads')}
onClick={() => {
clearPublish();
navigate(`/$/${PAGES.UPLOADS}`);
closeModal();
}}
/>
{!livestream && (
<Button
button="primary"
label={__('View My Uploads')}
onClick={() => {
clearPublish();
navigate(`/$/${PAGES.UPLOADS}`);
closeModal();
}}
/>
)}
{livestream && (
<Button
button="primary"
label={__('View My Dashboard')}
onClick={() => {
clearPublish();
navigate(`/$/${PAGES.LIVESTREAM}`);
closeModal();
}}
/>
)}
<Button button="link" label={__('Close')} onClick={handleClose} />
</div>
}

View file

@ -103,11 +103,29 @@ class ModalPublishPreview extends React.PureComponent<Props> {
myChannels,
} = this.props;
const modalTitle = isStillEditing ? __('Confirm Edit') : __('Confirm Upload');
const confirmBtnText = isStillEditing ? __('Save') : __('Upload');
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;
if (isStillEditing) {
confirmBtnText = __('Save');
} else if (livestream) {
confirmBtnText = __('Create');
} else {
confirmBtnText = __('Upload');
}
const descriptionValue = description ? (
<div className="media__info-text-preview">
<MarkdownPreview content={description} simpleLinks />
@ -167,7 +185,7 @@ class ModalPublishPreview extends React.PureComponent<Props> {
<div className="section">
<table className="table table--condensed table--publish-preview">
<tbody>
{!isMarkdownPost && this.createRow(__('File'), this.resolveFilePathName(filePath))}
{!livestream && !isMarkdownPost && this.createRow(__('File'), this.resolveFilePathName(filePath))}
{isOptimizeAvail && this.createRow(__('Transcode'), optimize ? __('Yes') : __('No'))}
{this.createRow(__('Title'), title)}
{this.createRow(__('Description'), descriptionValue)}

View file

@ -16,7 +16,7 @@ import analytics from 'analytics';
import { doOpenModal } from 'redux/actions/app';
export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispatch: Dispatch, getState: () => {}) => {
const publishPreview = previewResponse => {
const publishPreview = (previewResponse) => {
dispatch(
doOpenModal(MODALS.PUBLISH_PREVIEW, {
previewResponse,
@ -42,7 +42,7 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat
// 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
const isMatch = claim => claim.claim_id === pendingClaim.claim_id;
const isMatch = (claim) => claim.claim_id === pendingClaim.claim_id;
const isEdit = myClaims.some(isMatch);
actions.push({
@ -73,7 +73,7 @@ export const doPublishDesktop = (filePath: string, preview?: boolean) => (dispat
// @endif
};
const publishFail = error => {
const publishFail = (error) => {
const actions = [];
actions.push({
type: ACTIONS.PUBLISH_FAIL,
@ -91,7 +91,7 @@ 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(`/$/${PAGES.UPLOADS}`));
dispatch(push(filePath ? `/$/${PAGES.UPLOADS}` : `/$/${PAGES.LIVESTREAM}`));
// @endif
dispatch(doPublish(publishSuccess, publishFail));