refactor current file selection on publish area

This commit is contained in:
btzr-io 2020-05-14 16:32:35 -05:00 committed by Sean Yesmunt
parent ec40a4f8ab
commit fa9020340d
3 changed files with 29 additions and 63 deletions

View file

@ -2,7 +2,6 @@
import React from 'react';
import * as ICONS from 'constants/icons';
import * as PAGES from 'constants/pages';
import * as PUBLISH_TYPES from 'constants/publish_types';
import Icon from 'component/common/icon';
import classnames from 'classnames';
import useDragDrop from 'effects/use-drag-drop';
@ -11,9 +10,7 @@ import { withRouter } from 'react-router';
import { useRadioState, Radio, RadioGroup } from 'reakit/Radio';
type Props = {
// Lazy fix for flow errors:
// Todo -> add appropiate types
filePath: ?any,
filePath: string | WebFile,
clearPublish: () => void,
updatePublishForm: ({}) => void,
// React router
@ -122,7 +119,7 @@ function FileDrop(props: Props) {
if (files.length === 1) {
// Handle single file publish
setSelectedFile(files[0]);
updatePublishForm({ filePath: { publish: PUBLISH_TYPES.DROP, webFile: files[0] } });
updatePublishForm({ filePath: files[0] });
}
}
// Handle files
@ -130,16 +127,18 @@ function FileDrop(props: Props) {
// Wait for publish state update:
React.useEffect(() => {
/*
// Publish form has a file
if (selectedFile && filePath && filePath.webFile !== undefined) {
if (selectedFile && filePath) {
// Update completed
if (selectedFile.path === filePath.webFile.path) {
if (selectedFile.path === filePath.path) {
// Done! close the drop area:
setFiles([]);
// Go to publish area
navigateToPublish();
}
}
*/
}, [filePath, selectedFile, navigateToPublish, setFiles]);
const multipleFiles = files.length > 1;

View file

@ -1,6 +1,5 @@
// @flow
import * as ICONS from 'constants/icons';
import * as PUBLISH_TYPES from 'constants/publish_types';
import React, { useState, useEffect } from 'react';
import { regexInvalidURI } from 'lbry-redux';
import FileSelector from 'component/common/file-selector';
@ -12,9 +11,7 @@ import I18nMessage from '../i18nMessage';
type Props = {
name: ?string,
// Lazy fix for flow errors:
// Todo -> add types back
filePath: ?any, // string || WebFile
filePath: string | WebFile,
isStillEditing: boolean,
balance: number,
updatePublishForm: ({}) => void,
@ -50,7 +47,8 @@ function PublishFile(props: Props) {
const { available } = ffmpegStatus;
const [oversized, setOversized] = useState(false);
const [selectedFile, setSelectedFile] = useState(null);
const [currentFile, setCurrentFile] = useState(null);
const RECOMMENDED_BITRATE = 6000000;
const TV_PUBLISH_SIZE_LIMIT: number = 1073741824;
const UPLOAD_SIZE_MESSAGE = 'Lbry.tv uploads are limited to 1 GB. Download the app for unrestricted publishing.';
@ -64,42 +62,16 @@ function PublishFile(props: Props) {
// clear warnings
useEffect(() => {
if (!filePath || filePath === '') {
updateOptimizeState(0, 0, false);
setCurrentFile('');
setOversized(false);
updateOptimizeState(0, 0, false);
} else if (typeof filePath !== 'string') {
// Update currentFile file
if (filePath.name !== currentFile && filePath.path !== currentFile) {
handleFileChange(filePath);
}
}
// Process dropped file
if (filePath && filePath.publish === PUBLISH_TYPES.DROP && filePath.webFile !== undefined) {
setSelectedFile(filePath.webFile);
}
/*
// Process a post:
// See: https://github.com/lbryio/lbry-desktop/issues/4105
if(filePath && filePath.publish === PUBLISH_TYPES.POST) {
console.info("Writing a post...")
}
*/
}, [filePath]);
// File selected by user
useEffect(() => {
if (selectedFile !== undefined || selectedFile !== null) {
handleFileChange(selectedFile);
}
}, [selectedFile]);
let currentFile = '';
if (filePath) {
// Desktiop publish
if (typeof filePath === 'string') {
currentFile = filePath;
} else if (filePath.webFile === undefined && typeof filePath.name === 'string') {
// Web publish
currentFile = filePath.name;
}
}
}, [filePath, currentFile, handleFileChange, updateOptimizeState]);
function updateOptimizeState(duration, size, isvid) {
updatePublishForm({ fileDur: duration, fileSize: size, fileVid: isvid });
@ -204,13 +176,9 @@ function PublishFile(props: Props) {
}
// Lazy fix for flow errors:
// Todo -> add types back: ( file: WebFile )
function handleFileChange(file) {
function handleFileChange(file: WebFile) {
const { showToast } = props;
window.URL = window.URL || window.webkitURL;
// if electron, we'll set filePath to the path string because SDK is handling publishing.
// if web, we set the filePath (dumb name) to the File() object
// File.path will be undefined from web due to browser security, so it will default to the File Object.
setOversized(false);
// select file, start to select a new one, then cancel
@ -218,7 +186,8 @@ function PublishFile(props: Props) {
updatePublishForm({ filePath: '', name: '' });
return;
}
// if video, extract duration so we can warn about bitrate
// if video, extract duration so we can warn about bitrateif (typeof file !== 'string') {
const contentType = file.type.split('/');
const isVideo = contentType[0] === 'video';
const isMp4 = contentType[1] === 'mp4';
@ -241,17 +210,17 @@ function PublishFile(props: Props) {
// @if TARGET='web'
// we only need to enforce file sizes on 'web'
if (typeof file !== 'string') {
if (file && file.size && Number(file.size) > TV_PUBLISH_SIZE_LIMIT) {
setOversized(true);
showToast(__(UPLOAD_SIZE_MESSAGE));
updatePublishForm({ filePath: '', name: '' });
return;
}
if (file.size && Number(file.size) > TV_PUBLISH_SIZE_LIMIT) {
setOversized(true);
showToast(__(UPLOAD_SIZE_MESSAGE));
updatePublishForm({ filePath: '', name: '' });
return;
}
// @endif
const publishFormParams: { filePath: string | WebFile, name?: string, optimize?: boolean } = {
// if electron, we'll set filePath to the path string because SDK is handling publishing.
// File.path will be undefined from web due to browser security, so it will default to the File Object.
filePath: file.path || file,
};
// Strip off extention and replace invalid characters
@ -261,6 +230,8 @@ function PublishFile(props: Props) {
if (!isStillEditing) {
publishFormParams.name = parsedFileName;
}
// File path is not supported on web for security reasons so we use the name instead.
setCurrentFile(file.path || file.name);
updatePublishForm(publishFormParams);
}

View file

@ -1,4 +0,0 @@
// Publish from drag-drop UI
export const DROP = 'drop';
// Publish a post ( text / markdown )
export const POST = 'post';