move publish source state up, when editing livestream only show scheduling option when source is none.

This commit is contained in:
Dan Peterson 2021-12-29 16:10:19 -06:00 committed by Thomas Zarebczan
parent 6da73f6bc4
commit 4ec4942d8c
4 changed files with 35 additions and 17 deletions

View file

@ -29,7 +29,7 @@ type Props = {
needsYTAuth: boolean, needsYTAuth: boolean,
fetchAccessToken: () => void, fetchAccessToken: () => void,
accessToken: string, accessToken: string,
isLivestreamMode: boolean, showSchedulingOptions: boolean,
}; };
function PublishAdditionalOptions(props: Props) { function PublishAdditionalOptions(props: Props) {
@ -40,7 +40,7 @@ function PublishAdditionalOptions(props: Props) {
otherLicenseDescription, otherLicenseDescription,
licenseUrl, licenseUrl,
updatePublishForm, updatePublishForm,
isLivestreamMode, showSchedulingOptions,
// user, // user,
// useLBRYUploader, // useLBRYUploader,
// needsYTAuth, // needsYTAuth,
@ -156,7 +156,7 @@ function PublishAdditionalOptions(props: Props) {
)} */} )} */}
{/* @endif */} {/* @endif */}
<div className="section"> <div className="section">
{!isLivestreamMode && <PublishReleaseDate />} {!showSchedulingOptions && <PublishReleaseDate />}
<FormField <FormField
label={__('Language')} label={__('Language')}

View file

@ -19,6 +19,7 @@ import Empty from 'component/common/empty';
import moment from 'moment'; import moment from 'moment';
import classnames from 'classnames'; import classnames from 'classnames';
import ReactPaginate from 'react-paginate'; import ReactPaginate from 'react-paginate';
import { SOURCE_NONE, SOURCE_SELECT, SOURCE_UPLOAD } from 'constants/publish_sources';
type Props = { type Props = {
uri: ?string, uri: ?string,
@ -51,6 +52,8 @@ type Props = {
channelSignature: { signature?: string, signing_ts?: string }, channelSignature: { signature?: string, signing_ts?: string },
isCheckingLivestreams: boolean, isCheckingLivestreams: boolean,
setWaitForFile: (boolean) => void, setWaitForFile: (boolean) => void,
fileSelectSource: string,
changeFileSelectSource: (string) => void,
}; };
function PublishFile(props: Props) { function PublishFile(props: Props) {
@ -84,12 +87,10 @@ function PublishFile(props: Props) {
channelSignature, channelSignature,
isCheckingLivestreams, isCheckingLivestreams,
setWaitForFile, setWaitForFile,
fileSelectSource,
changeFileSelectSource,
} = props; } = props;
const SOURCE_NONE = 'none';
const SOURCE_SELECT = 'select';
const SOURCE_UPLOAD = 'upload';
const RECOMMENDED_BITRATE = 6000000; const RECOMMENDED_BITRATE = 6000000;
const TV_PUBLISH_SIZE_LIMIT_BYTES = WEB_PUBLISH_SIZE_LIMIT_GB * 1073741824; const TV_PUBLISH_SIZE_LIMIT_BYTES = WEB_PUBLISH_SIZE_LIMIT_GB * 1073741824;
const TV_PUBLISH_SIZE_LIMIT_GB_STR = String(WEB_PUBLISH_SIZE_LIMIT_GB); const TV_PUBLISH_SIZE_LIMIT_GB_STR = String(WEB_PUBLISH_SIZE_LIMIT_GB);
@ -121,9 +122,6 @@ function PublishFile(props: Props) {
const hasLivestreamData = livestreamData && Boolean(livestreamData.length); const hasLivestreamData = livestreamData && Boolean(livestreamData.length);
const showSourceSelector = isLivestreamClaim || (hasLivestreamData && mode === PUBLISH_MODES.FILE); const showSourceSelector = isLivestreamClaim || (hasLivestreamData && mode === PUBLISH_MODES.FILE);
const [fileSelectSource, setFileSelectSource] = useState(
IS_WEB && showSourceSelector && name ? SOURCE_SELECT : SOURCE_UPLOAD
);
// const [showFileUpdate, setShowFileUpdate] = useState(false); // const [showFileUpdate, setShowFileUpdate] = useState(false);
const [selectedFileIndex, setSelectedFileIndex] = useState(null); const [selectedFileIndex, setSelectedFileIndex] = useState(null);
const PAGE_SIZE = 4; const PAGE_SIZE = 4;
@ -142,12 +140,16 @@ function PublishFile(props: Props) {
} }
}, [currentFileType, mode, isStillEditing, updatePublishForm]); }, [currentFileType, mode, isStillEditing, updatePublishForm]);
// set default file source to none if editing a livestream. // Initialize default file source state.
useEffect(() => { useEffect(() => {
if (isLivestreamClaim) { if (isLivestreamClaim || mode === PUBLISH_MODES.LIVESTREAM) {
setFileSelectSource(SOURCE_NONE); changeFileSelectSource(SOURCE_NONE);
} else if (showSourceSelector && name) {
changeFileSelectSource(SOURCE_SELECT);
} else {
changeFileSelectSource(SOURCE_UPLOAD);
} }
}, [isLivestreamClaim, setFileSelectSource]); }, [mode]); // eslint-disable-line react-hooks/exhaustive-deps
const normalizeUrlForProtocol = (url) => { const normalizeUrlForProtocol = (url) => {
if (url.startsWith('https://')) { if (url.startsWith('https://')) {
@ -325,7 +327,7 @@ function PublishFile(props: Props) {
updatePublishForm({ remoteFileUrl: livestreamData[selectedFileIndex].data.fileLocation }); updatePublishForm({ remoteFileUrl: livestreamData[selectedFileIndex].data.fileLocation });
} }
} }
setFileSelectSource(source); changeFileSelectSource(source);
setWaitForFile(source !== SOURCE_NONE); setWaitForFile(source !== SOURCE_NONE);
} }

View file

@ -32,6 +32,7 @@ import Spinner from 'component/spinner';
import { toHex } from 'util/hex'; import { toHex } from 'util/hex';
import { LIVESTREAM_REPLAY_API } from 'constants/livestream'; import { LIVESTREAM_REPLAY_API } from 'constants/livestream';
import PublishStreamReleaseDate from 'component/publishStreamReleaseDate'; import PublishStreamReleaseDate from 'component/publishStreamReleaseDate';
import { SOURCE_NONE } from 'constants/publish_sources';
// @if TARGET='app' // @if TARGET='app'
import fs from 'fs'; import fs from 'fs';
@ -559,6 +560,15 @@ function PublishForm(props: Props) {
} }
}, [mode, updatePublishForm]); }, [mode, updatePublishForm]);
// Source Selector State.
const [fileSelectSource, setFileSelectSource] = useState();
const changeFileSelectSource = (state) => setFileSelectSource(state);
const [showSchedulingOptions, setShowSchedulingOptions] = useState(false);
useEffect(() => {
setShowSchedulingOptions(isLivestreamMode && fileSelectSource === SOURCE_NONE);
}, [isLivestreamMode, fileSelectSource]);
if (publishing) { if (publishing) {
return ( return (
<div className="main--empty"> <div className="main--empty">
@ -567,12 +577,15 @@ function PublishForm(props: Props) {
</div> </div>
); );
} }
// Editing claim uri // Editing claim uri
return ( return (
<div className="card-stack"> <div className="card-stack">
<ChannelSelect hideAnon={isLivestreamMode} disabled={disabled} /> <ChannelSelect hideAnon={isLivestreamMode} disabled={disabled} />
<PublishFile <PublishFile
fileSelectSource={fileSelectSource}
changeFileSelectSource={changeFileSelectSource}
uri={permanentUrl} uri={permanentUrl}
mode={mode} mode={mode}
fileMimeType={fileMimeType} fileMimeType={fileMimeType}
@ -609,7 +622,7 @@ function PublishForm(props: Props) {
{!publishing && ( {!publishing && (
<div className={classnames({ 'card--disabled': formDisabled })}> <div className={classnames({ 'card--disabled': formDisabled })}>
{isLivestreamMode && <Card className={'card--enable-overflow'} body={<PublishStreamReleaseDate />} />} {showSchedulingOptions && <Card className={'card--enable-overflow'} body={<PublishStreamReleaseDate />} />}
{mode !== PUBLISH_MODES.POST && <PublishDescription disabled={formDisabled} />} {mode !== PUBLISH_MODES.POST && <PublishDescription disabled={formDisabled} />}
@ -645,7 +658,7 @@ function PublishForm(props: Props) {
<PublishBid disabled={isStillEditing || formDisabled} /> <PublishBid disabled={isStillEditing || formDisabled} />
{!isLivestreamMode && <PublishPrice disabled={formDisabled} />} {!isLivestreamMode && <PublishPrice disabled={formDisabled} />}
<PublishAdditionalOptions disabled={formDisabled} isLivestreamMode={isLivestreamMode} /> <PublishAdditionalOptions disabled={formDisabled} showSchedulingOptions={showSchedulingOptions} />
</div> </div>
)} )}
<section> <section>

View file

@ -0,0 +1,3 @@
export const SOURCE_NONE = 'none';
export const SOURCE_SELECT = 'select';
export const SOURCE_UPLOAD = 'upload';