diff --git a/ui/component/common/file-selector.jsx b/ui/component/common/file-selector.jsx index 2ebfb256a..e8566760d 100644 --- a/ui/component/common/file-selector.jsx +++ b/ui/component/common/file-selector.jsx @@ -51,9 +51,9 @@ class FileSelector extends React.PureComponent<Props> { render() { const { type, currentPath, label, fileLabel, directoryLabel, placeholder, accept, error, disabled } = this.props; - const buttonLabel = type === 'file' ? fileLabel || __('Choose File') : directoryLabel || __('Choose Directory'); const placeHolder = currentPath || placeholder; + return ( <React.Fragment> <FormField diff --git a/ui/component/publishFile/index.js b/ui/component/publishFile/index.js index 8f0dfada7..c8ca526b8 100644 --- a/ui/component/publishFile/index.js +++ b/ui/component/publishFile/index.js @@ -1,6 +1,11 @@ import { connect } from 'react-redux'; - -import { selectBalance, selectIsStillEditing, makeSelectPublishFormValue, doUpdatePublishForm } from 'lbry-redux'; +import { + selectBalance, + selectIsStillEditing, + makeSelectPublishFormValue, + doUpdatePublishForm, + doToast, +} from 'lbry-redux'; import PublishPage from './view'; const select = state => ({ @@ -13,6 +18,7 @@ const select = state => ({ const perform = dispatch => ({ updatePublishForm: value => dispatch(doUpdatePublishForm(value)), + showToast: message => dispatch(doToast({ message, isError: true })), }); export default connect( diff --git a/ui/component/publishFile/view.jsx b/ui/component/publishFile/view.jsx index 2e910e915..0927ea13f 100644 --- a/ui/component/publishFile/view.jsx +++ b/ui/component/publishFile/view.jsx @@ -1,6 +1,6 @@ // @flow import * as ICONS from 'constants/icons'; -import React, { useState } from 'react'; +import React from 'react'; import { regexInvalidURI } from 'lbry-redux'; import FileSelector from 'component/common/file-selector'; import Button from 'component/button'; @@ -15,14 +15,12 @@ type Props = { updatePublishForm: ({}) => void, disabled: boolean, publishing: boolean, + showToast: string => void, }; function PublishFile(props: Props) { const { name, balance, filePath, isStillEditing, updatePublishForm, disabled, publishing } = props; - // This is basically for displaying the 500mb limit - const [fileError, setFileError] = useState(''); - let currentFile = ''; if (filePath) { if (typeof filePath === 'string') { @@ -33,6 +31,8 @@ function PublishFile(props: Props) { } function handleFileChange(file: WebFile) { + const { showToast } = props; + // 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. @@ -42,14 +42,13 @@ function PublishFile(props: Props) { const PUBLISH_SIZE_LIMIT: number = 512000000; if (typeof file !== 'string') { if (file && file.size && Number(file.size) > PUBLISH_SIZE_LIMIT) { - setFileError('File uploads currently limited to 500MB. Download the app for unlimited publishing.'); + showToast(__('File uploads currently limited to 500MB. Download the app for unlimited publishing.')); updatePublishForm({ filePath: '', name: '' }); return; - } else { - setFileError(''); } } // @endif + const publishFormParams: { filePath: string | WebFile, name?: string } = { filePath: file.path || file, }; @@ -72,6 +71,7 @@ function PublishFile(props: Props) { } else { title = isStillEditing ? __('Edit') : __('Publish'); } + return ( <Card actionIconPadding={false} @@ -83,12 +83,7 @@ function PublishFile(props: Props) { } actions={ <React.Fragment> - <FileSelector - disabled={disabled} - currentPath={currentFile} - onFileChosen={handleFileChange} - error={fileError} - /> + <FileSelector disabled={disabled} currentPath={currentFile} onFileChosen={handleFileChange} /> {!isStillEditing && ( <p className="help"> {__('For video content, use MP4s in H264/AAC format for best compatibility.')}{' '}