move publish source state up, when editing livestream only show scheduling option when source is none.
This commit is contained in:
parent
6da73f6bc4
commit
4ec4942d8c
4 changed files with 35 additions and 17 deletions
|
@ -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')}
|
||||||
|
|
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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>
|
||||||
|
|
3
ui/constants/publish_sources.js
Normal file
3
ui/constants/publish_sources.js
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
export const SOURCE_NONE = 'none';
|
||||||
|
export const SOURCE_SELECT = 'select';
|
||||||
|
export const SOURCE_UPLOAD = 'upload';
|
Loading…
Reference in a new issue