Fix bug where upload tools may remain visible upon switching upload type, even when no option to upload is available.
This commit is contained in:
Dan Peterson
Thomas Zarebczan
parent
7671d12e42
commit
6da73f6bc4
1 changed files with 92 additions and 81 deletions
|
|
@ -142,12 +142,12 @@ function PublishFile(props: Props) {
|
||||||
}
|
}
|
||||||
}, [currentFileType, mode, isStillEditing, updatePublishForm]);
|
}, [currentFileType, mode, isStillEditing, updatePublishForm]);
|
||||||
|
|
||||||
// set default file source to select if necessary
|
// set default file source to none if editing a livestream.
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (isLivestreamClaim) {
|
if (isLivestreamClaim) {
|
||||||
setFileSelectSource(SOURCE_NONE);
|
setFileSelectSource(SOURCE_NONE);
|
||||||
}
|
}
|
||||||
}, [hasLivestreamData, isLivestreamClaim, setFileSelectSource]);
|
}, [isLivestreamClaim, setFileSelectSource]);
|
||||||
|
|
||||||
const normalizeUrlForProtocol = (url) => {
|
const normalizeUrlForProtocol = (url) => {
|
||||||
if (url.startsWith('https://')) {
|
if (url.startsWith('https://')) {
|
||||||
|
|
@ -511,7 +511,7 @@ function PublishFile(props: Props) {
|
||||||
</fieldset-section>
|
</fieldset-section>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{fileSelectSource === SOURCE_UPLOAD && showFileUpload && (
|
{showSourceSelector && fileSelectSource === SOURCE_UPLOAD && showFileUpload && (
|
||||||
<>
|
<>
|
||||||
<FileSelector
|
<FileSelector
|
||||||
label={__('File')}
|
label={__('File')}
|
||||||
|
|
@ -525,86 +525,97 @@ function PublishFile(props: Props) {
|
||||||
{getUploadMessage()}
|
{getUploadMessage()}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
{fileSelectSource === SOURCE_SELECT && showFileUpload && hasLivestreamData && !isCheckingLivestreams && (
|
{showSourceSelector &&
|
||||||
<>
|
fileSelectSource === SOURCE_SELECT &&
|
||||||
<fieldset-section>
|
showFileUpload &&
|
||||||
<label>{__('Select Replay')}</label>
|
hasLivestreamData &&
|
||||||
<div className="table__wrapper">
|
!isCheckingLivestreams && (
|
||||||
<table className="table table--livestream-data">
|
<>
|
||||||
<tbody>
|
|
||||||
{livestreamData.slice((currentPage - 1) * PAGE_SIZE, currentPage * PAGE_SIZE).map((item, i) => (
|
|
||||||
<tr
|
|
||||||
onClick={() => setSelectedFileIndex((currentPage - 1) * PAGE_SIZE + i)}
|
|
||||||
key={item.id}
|
|
||||||
className={classnames('livestream__data-row', {
|
|
||||||
'livestream__data-row--selected': selectedFileIndex === (currentPage - 1) * PAGE_SIZE + i,
|
|
||||||
})}
|
|
||||||
>
|
|
||||||
<td>
|
|
||||||
<FormField
|
|
||||||
type="radio"
|
|
||||||
checked={selectedFileIndex === (currentPage - 1) * PAGE_SIZE + i}
|
|
||||||
label={null}
|
|
||||||
onClick={() => setSelectedFileIndex((currentPage - 1) * PAGE_SIZE + i)}
|
|
||||||
className="livestream__data-row-radio"
|
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<div className="livestream_thumb_container">
|
|
||||||
{item.data.thumbnails.slice(0, 3).map((thumb) => (
|
|
||||||
<img key={thumb} className="livestream___thumb" src={thumb} />
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
{`${Math.floor(item.data.fileDuration / 60)} ${
|
|
||||||
Math.floor(item.data.fileDuration / 60) > 1 ? __('minutes') : __('minute')
|
|
||||||
}`}
|
|
||||||
<div className="table__item-label">
|
|
||||||
{`${moment(item.data.uploadedAt).from(moment())}`}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<CopyableText
|
|
||||||
primaryButton
|
|
||||||
copyable={normalizeUrlForProtocol(item.data.fileLocation)}
|
|
||||||
snackMessage={__('Url copied.')}
|
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
))}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</fieldset-section>
|
|
||||||
<fieldset-group class="fieldset-group--smushed fieldgroup--paginate">
|
|
||||||
<fieldset-section>
|
<fieldset-section>
|
||||||
<ReactPaginate
|
<label>{__('Select Replay')}</label>
|
||||||
pageCount={totalPages}
|
<div className="table__wrapper">
|
||||||
pageRangeDisplayed={2}
|
<table className="table table--livestream-data">
|
||||||
previousLabel="‹"
|
<tbody>
|
||||||
nextLabel="›"
|
{livestreamData
|
||||||
activeClassName="pagination__item--selected"
|
.slice((currentPage - 1) * PAGE_SIZE, currentPage * PAGE_SIZE)
|
||||||
pageClassName="pagination__item"
|
.map((item, i) => (
|
||||||
previousClassName="pagination__item pagination__item--previous"
|
<tr
|
||||||
nextClassName="pagination__item pagination__item--next"
|
onClick={() => setSelectedFileIndex((currentPage - 1) * PAGE_SIZE + i)}
|
||||||
breakClassName="pagination__item pagination__item--break"
|
key={item.id}
|
||||||
marginPagesDisplayed={2}
|
className={classnames('livestream__data-row', {
|
||||||
onPageChange={(e) => handlePaginateReplays(e.selected + 1)}
|
'livestream__data-row--selected':
|
||||||
forcePage={currentPage - 1}
|
selectedFileIndex === (currentPage - 1) * PAGE_SIZE + i,
|
||||||
initialPage={currentPage - 1}
|
})}
|
||||||
containerClassName="pagination"
|
>
|
||||||
/>
|
<td>
|
||||||
|
<FormField
|
||||||
|
type="radio"
|
||||||
|
checked={selectedFileIndex === (currentPage - 1) * PAGE_SIZE + i}
|
||||||
|
label={null}
|
||||||
|
onClick={() => setSelectedFileIndex((currentPage - 1) * PAGE_SIZE + i)}
|
||||||
|
className="livestream__data-row-radio"
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<div className="livestream_thumb_container">
|
||||||
|
{item.data.thumbnails.slice(0, 3).map((thumb) => (
|
||||||
|
<img key={thumb} className="livestream___thumb" src={thumb} />
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{`${Math.floor(item.data.fileDuration / 60)} ${
|
||||||
|
Math.floor(item.data.fileDuration / 60) > 1 ? __('minutes') : __('minute')
|
||||||
|
}`}
|
||||||
|
<div className="table__item-label">
|
||||||
|
{`${moment(item.data.uploadedAt).from(moment())}`}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<CopyableText
|
||||||
|
primaryButton
|
||||||
|
copyable={normalizeUrlForProtocol(item.data.fileLocation)}
|
||||||
|
snackMessage={__('Url copied.')}
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
</fieldset-section>
|
</fieldset-section>
|
||||||
</fieldset-group>
|
<fieldset-group class="fieldset-group--smushed fieldgroup--paginate">
|
||||||
</>
|
<fieldset-section>
|
||||||
)}
|
<ReactPaginate
|
||||||
{fileSelectSource === SOURCE_SELECT && showFileUpload && !hasLivestreamData && !isCheckingLivestreams && (
|
pageCount={totalPages}
|
||||||
<div className="main--empty empty">
|
pageRangeDisplayed={2}
|
||||||
<Empty text={__('No replays found.')} />
|
previousLabel="‹"
|
||||||
</div>
|
nextLabel="›"
|
||||||
)}
|
activeClassName="pagination__item--selected"
|
||||||
{fileSelectSource === SOURCE_SELECT && showFileUpload && isCheckingLivestreams && (
|
pageClassName="pagination__item"
|
||||||
|
previousClassName="pagination__item pagination__item--previous"
|
||||||
|
nextClassName="pagination__item pagination__item--next"
|
||||||
|
breakClassName="pagination__item pagination__item--break"
|
||||||
|
marginPagesDisplayed={2}
|
||||||
|
onPageChange={(e) => handlePaginateReplays(e.selected + 1)}
|
||||||
|
forcePage={currentPage - 1}
|
||||||
|
initialPage={currentPage - 1}
|
||||||
|
containerClassName="pagination"
|
||||||
|
/>
|
||||||
|
</fieldset-section>
|
||||||
|
</fieldset-group>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
{showSourceSelector &&
|
||||||
|
fileSelectSource === SOURCE_SELECT &&
|
||||||
|
showFileUpload &&
|
||||||
|
!hasLivestreamData &&
|
||||||
|
!isCheckingLivestreams && (
|
||||||
|
<div className="main--empty empty">
|
||||||
|
<Empty text={__('No replays found.')} />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{showSourceSelector && fileSelectSource === SOURCE_SELECT && showFileUpload && isCheckingLivestreams && (
|
||||||
<div className="main--empty empty">
|
<div className="main--empty empty">
|
||||||
<Spinner small />
|
<Spinner small />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue