Merge pull request #2034 from chrisza4/limit-file-upload-type

Limit thumbnail file upload type

CHANGELOG.md

@@ -10,13 +10,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
  * Focus on search bar with {cmd,ctrl} + "l" ([#2003](https://github.com/lbryio/lbry-desktop/pull/2003))
  * Add support for clickable channel names on explore page headings ([#2023](https://github.com/lbryio/lbry-desktop/pull/2023))
  * Content loading placeholder styles on FileCard/FileTile ([#2022](https://github.com/lbryio/lbry-desktop/pull/2022))
- 
+
 ### Changed
  * Make tooltip smarter ([#1979](https://github.com/lbryio/lbry-desktop/pull/1979))
  * Change channel pages to have 48 items instead of 10 ([#2002](https://github.com/lbryio/lbry-desktop/pull/2002))
  * Update to https ([#2016](https://github.com/lbryio/lbry-desktop/pull/2016))
  * Simplify FileCard and FileTile component styling ([#2011](https://github.com/lbryio/lbry-desktop/pull/2011))
  * Credit card verification messaging ([#2025](https://github.com/lbryio/lbry-desktop/pull/2025))
+ * Limit file type can be uploaded as thumbnail for publishing ([#2034](https://github.com/lbryio/lbry-desktop/pull/2034))
 
 ### Fixed
  * Fixed Transactions filter menu collides with transaction table ([#2005](https://github.com/lbryio/lbry-desktop/pull/2005))

src/renderer/component/common/file-selector.jsx

@@ -5,12 +5,18 @@ import Button from 'component/button';
 import { FormRow } from 'component/common/form';
 import path from 'path';
 
+type FileFilters = {
+  name: string,
+  extensions: string[],
+};
+
 type Props = {
   type: string,
   currentPath: ?string,
   onFileChosen: (string, string) => void,
   fileLabel?: string,
   directoryLabel?: string,
+  filters?: FileFilters[],
 };
 
 class FileSelector extends React.PureComponent<Props> {
@@ -29,6 +35,7 @@ class FileSelector extends React.PureComponent<Props> {
       {
         properties:
           this.props.type === 'file' ? ['openFile'] : ['openDirectory', 'createDirectory'],
+        filters: this.props.filters,
       },
       paths => {
         if (!paths) {

src/renderer/component/publishForm/view.jsx

@@ -52,7 +52,7 @@ type Props = {
   clearPublish: () => void,
   resolveUri: string => void,
   scrollToTop: () => void,
-  prepareEdit: ({}) => void,
+  prepareEdit: (claim: any, uri: string) => void,
   resetThumbnailStatus: () => void,
   amountNeededForTakeover: ?number,
 };
@@ -107,11 +107,7 @@ class PublishForm extends React.PureComponent<Props> {
 
   handleFileChange(filePath: string, fileName: string) {
     const { updatePublishForm, channel, name } = this.props;
-    const newFileParams: {
-      filePath: string,
-      name?: string,
-      uri?: string,
-    } = { filePath };
+    const newFileParams: UpdatePublishFormData = { filePath };
 
     if (!name) {
       const parsedFileName = fileName.replace(regexInvalidURI, '');
@@ -127,7 +123,7 @@ class PublishForm extends React.PureComponent<Props> {
     const { channel, updatePublishForm } = this.props;
 
     if (!name) {
-      updatePublishForm({ name, nameError: undefined });
+      updatePublishForm({ nameError: undefined });
       return;
     }
 
@@ -149,7 +145,7 @@ class PublishForm extends React.PureComponent<Props> {
 
   handleChannelChange(channelName: string) {
     const { name, updatePublishForm } = this.props;
-    const form = { channel: channelName };
+    const form: UpdatePublishFormData = { channel: channelName };
 
     if (name) {
       form.uri = this.getNewUri(name, channelName);
@@ -217,10 +213,10 @@ class PublishForm extends React.PureComponent<Props> {
 
     const publishingLicenseUrl = licenseType === COPYRIGHT ? '' : licenseUrl;
 
-    const publishParams = {
-      filePath,
-      bid: this.props.bid,
-      title: this.props.title,
+    const publishParams: PublishParams = {
+      filePath: filePath || undefined,
+      bid: this.props.bid || undefined,
+      title: this.props.title || '',
       thumbnail: this.props.thumbnail,
       description: this.props.description,
       language: this.props.language,
@@ -228,16 +224,16 @@ class PublishForm extends React.PureComponent<Props> {
       license: publishingLicense,
       licenseUrl: publishingLicenseUrl,
       otherLicenseDescription,
-      name: this.props.name,
+      name: this.props.name || undefined,
       contentIsFree: this.props.contentIsFree,
       price: this.props.price,
-      uri: this.props.uri,
+      uri: this.props.uri || undefined,
       channel: this.props.channel,
       isStillEditing: this.props.isStillEditing,
     };
 
     // Editing a claim
-    if (!filePath && myClaimForUri) {
+    if (!filePath && myClaimForUri && myClaimForUri.value) {
       const { source } = myClaimForUri.value.stream;
       publishParams.sources = source;
     }

src/renderer/component/selectThumbnail/view.jsx

@@ -51,6 +51,12 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
       thumbnailPath,
       resetThumbnailStatus,
     } = this.props;
+    const filters = [
+      {
+        name: __('Thumbnail Image'),
+        extensions: ['png', 'jpg', 'jpeg', 'gif'],
+      },
+    ];
     const { thumbnailError, thumbnailErrorImage } = this.state;
     const thumbnailSrc =
       !thumbnail || thumbnailError ? Native.imagePath(thumbnailErrorImage) : thumbnail;
@@ -111,6 +117,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
               <FileSelector
                 currentPath={thumbnailPath}
                 fileLabel={__('Choose Thumbnail')}
+                filters={filters}
                 onFileChosen={path => openModal({ id: MODALS.CONFIRM_THUMBNAIL_UPLOAD }, { path })}
               />
             )}

src/renderer/page/settings/view.jsx

@@ -16,6 +16,7 @@ type DaemonSettings = {
   download_directory: string,
   disable_max_key_fee: boolean,
   share_usage_data: boolean,
+  max_key_fee?: Price,
 };
 
 type Props = {
@@ -34,6 +35,7 @@ type Props = {
   autoDownload: boolean,
   encryptWallet: () => void,
   decryptWallet: () => void,
+  updateWalletStatus: () => void,
   walletEncrypted: boolean,
   osNotificationsEnabled: boolean,
 };
@@ -65,10 +67,8 @@ class SettingsPage extends React.PureComponent<Props, State> {
   }
 
   componentDidMount() {
-    const { props } = this;
-
-    props.getThemes();
-    props.updateWalletStatus();
+    this.props.getThemes();
+    this.props.updateWalletStatus();
   }
 
   onRunOnStartChange(event: SyntheticInputEvent<*>) {
@@ -126,18 +126,22 @@ class SettingsPage extends React.PureComponent<Props, State> {
   }
 
   onChangeEncryptWallet() {
-    const { props } = this;
-    props.walletEncrypted ? props.decryptWallet() : props.encryptWallet();
-  }
-
-  setDaemonSetting(name: string, value: boolean | string | Price) {
-    this.props.setDaemonSetting(name, value);
+    const { decryptWallet, walletEncrypted, encryptWallet } = this.props;
+    if (walletEncrypted) {
+      decryptWallet();
+    } else {
+      encryptWallet();
+    }
   }
 
   onDesktopNotificationsChange(event: SyntheticInputEvent<*>) {
     this.props.setClientSetting(settings.OS_NOTIFICATIONS_ENABLED, event.target.checked);
   }
 
+  setDaemonSetting(name: string, value: boolean | string | Price) {
+    this.props.setDaemonSetting(name, value);
+  }
+
   clearCache() {
     this.setState({
       clearingCache: true,
@@ -346,7 +350,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
               <FormField
                 type="checkbox"
                 name="encrypt_wallet"
-                onChange={e => this.onChangeEncryptWallet(e)}
+                onChange={() => this.onChangeEncryptWallet()}
                 checked={walletEncrypted}
                 postfix={__('Encrypt my wallet with a custom password.')}
                 helper={

src/renderer/redux/actions/publish.js

@@ -20,6 +20,7 @@ import fs from 'fs';
 import path from 'path';
 import { CC_LICENSES, COPYRIGHT, OTHER } from 'constants/licenses';
 import type { Dispatch, GetState } from 'types/redux';
+import type { Source } from 'types/claim';
 
 type Action = UpdatePublishFormAction | { type: ACTIONS.CLEAR_PUBLISH };
 
@@ -67,10 +68,12 @@ export const doClearPublish = () => (dispatch: Dispatch<Action>): Promise<Action
 export const doUpdatePublishForm = (publishFormValue: UpdatePublishFormData) => (
   dispatch: Dispatch<Action>
 ): UpdatePublishFormAction =>
-  dispatch({
-    type: ACTIONS.UPDATE_PUBLISH_FORM,
-    data: { ...publishFormValue },
-  });
+  dispatch(
+    ({
+      type: ACTIONS.UPDATE_PUBLISH_FORM,
+      data: { ...publishFormValue },
+    }: UpdatePublishFormAction)
+  );
 
 export const doUploadThumbnail = (filePath: string, nsfw: boolean) => (
   dispatch: Dispatch<Action>
@@ -155,7 +158,7 @@ export const doPrepareEdit = (claim: any, uri: string) => (dispatch: Dispatch<Ac
     title,
   } = metadata;
 
-  const publishData = {
+  const publishData: UpdatePublishFormData = {
     name,
     channel: channelName,
     bid: amount,
@@ -226,17 +229,18 @@ export const doPublish = (params: PublishParams) => (
     licenseUrl,
     language,
     thumbnail,
+    fee: fee || undefined,
+    description: description || undefined,
   };
 
-  if (fee) {
-    metadata.fee = fee;
-  }
-
-  if (description) {
-    metadata.description = description;
-  }
-
-  const publishPayload = {
+  const publishPayload: {
+    name: ?string,
+    channel_id: string,
+    bid: ?number,
+    metadata: ?any,
+    file_path?: string,
+    sources?: Source,
+  } = {
     name,
     channel_id: channelId,
     bid,

src/renderer/redux/reducers/publish.js

@@ -4,6 +4,7 @@ import { buildURI } from 'lbry-redux';
 import * as ACTIONS from 'constants/action_types';
 import * as THUMBNAIL_STATUSES from 'constants/thumbnail_upload_statuses';
 import { CHANNEL_ANONYMOUS } from 'constants/claim';
+import type { Source } from 'types/claim';
 
 type PublishState = {
   editingURI: ?string,
@@ -53,6 +54,8 @@ export type UpdatePublishFormData = {
   bidError?: string,
   otherLicenseDescription?: string,
   licenseUrl?: string,
+  licenseType?: string,
+  uri?: string,
 };
 
 export type UpdatePublishFormAction = {
@@ -61,32 +64,27 @@ export type UpdatePublishFormAction = {
 };
 
 export type PublishParams = {
-  name: string,
-  bid: number,
-  filePath: string,
+  name?: string,
+  bid?: number,
+  filePath?: string,
   description: ?string,
   language: string,
-  publishingLicense: string,
-  publishingLicenseUrl: string,
+  publishingLicense?: string,
+  publishingLicenseUrl?: string,
   thumbnail: ?string,
   nsfw: boolean,
   channel: string,
-  channelId: string,
+  channelId?: string,
   title: string,
   contentIsFree: boolean,
-  uri: string,
+  uri?: string,
   license: ?string,
   licenseUrl: ?string,
   price: {
     currency: string,
     amount: number,
   },
-  source?: {
-    contentType: string,
-    source: string,
-    sourceType: string,
-    version: string,
-  },
+  sources?: Source,
 };
 
 const defaultState: PublishState = {

src/renderer/types/claim.js

@@ -1,6 +1,14 @@
 // @flow
 
 // Currently incomplete
+
+export type Source = {
+  contentType: string,
+  source: string,
+  sourceType: string,
+  version: string,
+};
+
 export type Metadata = {
   nsfw: boolean,
   title: string,
@@ -36,6 +44,7 @@ export type Claim = {
     },
     stream: {
       metadata: Metadata,
+      source: Source,
     },
   },
 };