Add SETTINGS.ENABLE_PUBLISH_PREVIEW

This option allows users to bypass the "publish preview" modal. Users can disable it by checking "don't show this again" in the modal, and re-enable it in the Settings Page.

ui/component/publishForm/index.js

@@ -11,10 +11,12 @@ import {
   doUpdatePublishForm,
   doPrepareEdit,
   doCheckPublishNameAvailability,
+  SETTINGS,
 } from 'lbry-redux';
 import { doPublishDesktop } from 'redux/actions/publish';
 import { selectUnclaimedRewardValue } from 'redux/selectors/rewards';
 import { selectModal } from 'redux/selectors/app';
+import { makeSelectClientSetting } from 'redux/selectors/settings';
 import PublishPage from './view';
 
 const select = state => ({
@@ -29,6 +31,7 @@ const select = state => ({
   isResolvingUri: selectIsResolvingPublishUris(state),
   totalRewardValue: selectUnclaimedRewardValue(state),
   modal: selectModal(state),
+  enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state),
 });
 
 const perform = dispatch => ({

ui/component/publishForm/view.jsx

@@ -79,6 +79,7 @@ type Props = {
   checkAvailability: string => void,
   ytSignupPending: boolean,
   modal: { id: string, modalProps: {} },
+  enablePublishPreview: boolean,
 };
 
 function PublishForm(props: Props) {
@@ -116,6 +117,7 @@ function PublishForm(props: Props) {
     checkAvailability,
     ytSignupPending,
     modal,
+    enablePublishPreview,
   } = props;
 
   // Used to check if name should be auto-populated from title
@@ -287,7 +289,7 @@ function PublishForm(props: Props) {
     }
     // Publish file
     if (mode === PUBLISH_MODES.FILE) {
-      if (isStillEditing) {
+      if (isStillEditing || !enablePublishPreview) {
         publish(filePath, false);
       } else {
         setPreviewing(true);

ui/component/publishSettings/index.js

@@ -0,0 +1,15 @@
+import { SETTINGS } from 'lbry-redux';
+import { connect } from 'react-redux';
+import { makeSelectClientSetting } from 'redux/selectors/settings';
+import { doSetClientSetting } from 'redux/actions/settings';
+import PublishSettings from './view';
+
+const select = state => ({
+  enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state),
+});
+
+const perform = dispatch => ({
+  setEnablePublishPreview: value => dispatch(doSetClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW, value)),
+});
+
+export default connect(select, perform)(PublishSettings);

ui/component/publishSettings/view.jsx

@@ -0,0 +1,31 @@
+// @flow
+import React from 'react';
+import { FormField } from 'component/common/form';
+import { withRouter } from 'react-router';
+
+type Props = {
+  enablePublishPreview: boolean,
+  setEnablePublishPreview: boolean => void,
+};
+
+function PublishSettings(props: Props) {
+  const { enablePublishPreview, setEnablePublishPreview } = props;
+
+  function handleChange() {
+    setEnablePublishPreview(!enablePublishPreview);
+  }
+
+  return (
+    <div>
+      <FormField
+        type="checkbox"
+        name="sync_toggle"
+        label={__('Skip preview and confirmation')}
+        checked={!enablePublishPreview}
+        onChange={handleChange}
+      />
+    </div>
+  );
+}
+
+export default withRouter(PublishSettings);

ui/constants/settings.js

@@ -23,3 +23,4 @@ export const FLOATING_PLAYER = 'floating_player';
 export const DARK_MODE_TIMES = 'dark_mode_times';
 export const ENABLE_SYNC = 'enable_sync';
 export const TO_TRAY_WHEN_CLOSED = 'to_tray_when_closed';
+export const ENABLE_PUBLISH_PREVIEW = 'enable-publish-preview';

ui/modal/modalPublishPreview/index.js

@@ -1,19 +1,22 @@
 import { connect } from 'react-redux';
 import { doHideModal } from 'redux/actions/app';
 import ModalPublishPreview from './view';
-import { makeSelectPublishFormValue, selectPublishFormValues } from 'lbry-redux';
-import { selectFfmpegStatus } from 'redux/selectors/settings';
+import { makeSelectPublishFormValue, selectPublishFormValues, SETTINGS } from 'lbry-redux';
+import { selectFfmpegStatus, makeSelectClientSetting } from 'redux/selectors/settings';
 import { doPublishDesktop } from 'redux/actions/publish';
+import { doSetClientSetting } from 'redux/actions/settings';
 
 const select = state => ({
   ...selectPublishFormValues(state),
   isVid: makeSelectPublishFormValue('fileVid')(state),
   ffmpegStatus: selectFfmpegStatus(state),
+  enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state),
 });
 
 const perform = dispatch => ({
   publish: (filePath, preview) => dispatch(doPublishDesktop(filePath, preview)),
   closeModal: () => dispatch(doHideModal()),
+  setEnablePublishPreview: value => dispatch(doSetClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW, value)),
 });
 
 export default connect(select, perform)(ModalPublishPreview);

ui/modal/modalPublishPreview/view.jsx

@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import Button from 'component/button';
-import { Form } from 'component/common/form';
+import { Form, FormField } from 'component/common/form';
 import { Modal } from 'modal/modal';
 import Card from 'component/common/card';
 import Tag from 'component/tag';
@@ -31,6 +31,8 @@ type Props = {
   previewResponse: PublishResponse,
   publish: (?string, ?boolean) => void,
   closeModal: () => void,
+  enablePublishPreview: boolean,
+  setEnablePublishPreview: boolean => void,
 };
 
 class ModalPublishPreview extends React.PureComponent<Props> {
@@ -58,6 +60,11 @@ class ModalPublishPreview extends React.PureComponent<Props> {
     );
   }
 
+  togglePreviewEnabled() {
+    const { enablePublishPreview, setEnablePublishPreview } = this.props;
+    setEnablePublishPreview(!enablePublishPreview);
+  }
+
   render() {
     const {
       filePath,
@@ -78,6 +85,8 @@ class ModalPublishPreview extends React.PureComponent<Props> {
       ffmpegStatus = {},
       previewResponse,
       closeModal,
+      enablePublishPreview,
+      setEnablePublishPreview,
     } = this.props;
 
     const modalTitle = __('Confirm Publish');
@@ -145,6 +154,13 @@ class ModalPublishPreview extends React.PureComponent<Props> {
                   <Button button="link" label={__('Cancel')} onClick={closeModal} />
                 </div>
                 <p className="help">{__('Once the transaction is sent, it cannot be reversed.')}</p>
+                <FormField
+                  type="checkbox"
+                  name="sync_toggle"
+                  label={__('Skip preview and confirmation')}
+                  checked={!enablePublishPreview}
+                  onChange={() => setEnablePublishPreview(!enablePublishPreview)}
+                />
               </>
             }
           />

ui/page/settingsAdvanced/view.jsx

@@ -13,6 +13,7 @@ import { SETTINGS } from 'lbry-redux';
 import Card from 'component/common/card';
 import { getPasswordFromCookie } from 'util/saved-passwords';
 import Spinner from 'component/spinner';
+import PublishSettings from 'component/publishSettings';
 
 // @if TARGET='app'
 const IS_MAC = process.platform === 'darwin';
@@ -506,6 +507,8 @@ class SettingsPage extends React.PureComponent<Props, State> {
               />
             )}
 
+            <Card title={__('Publish Settings')} actions={<PublishSettings />} />
+
             {/* @if TARGET='app' */}
             {/* Auto launch in a hidden state doesn't work on mac https://github.com/Teamwork/node-auto-launch/issues/81 */}
             {!IS_MAC && <Card title={__('Startup preferences')} actions={<SettingAutoLaunch />} />}

ui/redux/reducers/settings.js

@@ -33,6 +33,7 @@ const defaultState = {
     [SETTINGS.FOLLOWING_ACKNOWLEDGED]: false,
     [SETTINGS.TAGS_ACKNOWLEDGED]: false,
     [SETTINGS.ENABLE_SYNC]: IS_WEB,
+    [SETTINGS.ENABLE_PUBLISH_PREVIEW]: true,
 
     // UI
     [SETTINGS.LANGUAGE]: settingLanguage.find(language => SUPPORTED_LANGUAGES[language]),