add uploader files number control (#4451)

* add uploader files number control

* update sentence bug

frontend/src/components/file-uploader/file-uploader.js

@@ -2,7 +2,7 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import Resumablejs from '@seafile/resumablejs';
 import MD5 from 'MD5';
-import { enableResumableFileUpload, resumableUploadFileBlockSize, maxUploadFileSize } from '../../utils/constants';
+import { resumableUploadFileBlockSize, maxUploadFileSize, maxNumberOfFilesForFileupload } from '../../utils/constants';
 import { seafileAPI } from '../../utils/seafile-api';
 import { Utils } from '../../utils/utils';
 import { gettext } from '../../utils/constants';
@@ -17,12 +17,10 @@ const propTypes = {
   filetypes: PropTypes.array,
   chunkSize: PropTypes.number,
   withCredentials: PropTypes.bool,
-  maxFiles: PropTypes.number,
   testMethod: PropTypes.string,
   testChunks: PropTypes.number,
   simultaneousUploads: PropTypes.number,
   fileParameterName: PropTypes.string,
-  maxFilesErrorCallback: PropTypes.func,
   minFileSizeErrorCallback: PropTypes.func,
   fileTypeErrorCallback: PropTypes.func,
   dragAndDrop: PropTypes.bool.isRequired,
@@ -62,7 +60,7 @@ class FileUploader extends React.Component {
       target: '',
       query: this.setQuery || {},
       fileType: this.props.filetypes,
-      maxFiles: this.props.maxFiles,
+      maxFiles: maxNumberOfFilesForFileupload || undefined,
       maxFileSize: maxUploadFileSize * 1000 * 1000 || undefined,
       testMethod: this.props.testMethod || 'post',
       testChunks: this.props.testChunks || false,
@@ -104,10 +102,10 @@ class FileUploader extends React.Component {
   }
 
   bindCallbackHandler = () => {
-    let {maxFilesErrorCallback, minFileSizeErrorCallback, fileTypeErrorCallback } = this.props;
+    let { minFileSizeErrorCallback, fileTypeErrorCallback } = this.props;
 
-    if (maxFilesErrorCallback) {
+    if (this.maxFilesErrorCallback) {
-      this.resumable.opts.maxFilesErrorCallback = this.props.maxFilesErrorCallback;
+      this.resumable.opts.maxFilesErrorCallback = this.maxFilesErrorCallback;
     }
 
     if (minFileSizeErrorCallback) {
@@ -141,6 +139,16 @@ class FileUploader extends React.Component {
     this.resumable.on('dragstart', this.onDragStart.bind(this));
   }
 
+  maxFilesErrorCallback = (files, errorCount) => {
+    let maxFiles = maxNumberOfFilesForFileupload;
+    let message = gettext('Please upload no more than {maxFiles} files at a time.');
+    if (maxFiles === 1) {
+      message = gettext('Please upload no more than {maxFiles} file at a time.');
+    } 
+    message = message.replace('{maxFiles}', maxFiles);
+    toaster.danger(message);
+  }
+
   maxFileSizeErrorCallback = (file) => {
     let { forbidUploadFileList } = this.state;
     forbidUploadFileList.push(file);

frontend/src/utils/constants.js

@@ -55,6 +55,7 @@ export const canInvitePeople = window.app.pageOptions.canInvitePeople;
 export const canLockUnlockFile = window.app.pageOptions.canLockUnlockFile;
 export const customNavItems = window.app.pageOptions.customNavItems;
 export const maxUploadFileSize = window.app.pageOptions.maxUploadFileSize;
+export const maxNumberOfFilesForFileupload = window.app.pageOptions.maxNumberOfFilesForFileupload;
 
 export const curNoteMsg = window.app.pageOptions.curNoteMsg;
 export const curNoteID = window.app.pageOptions.curNoteID;

seahub/templates/base_for_react.html

@@ -94,7 +94,9 @@
             {% if max_upload_file_size > 0 %}
             maxUploadFileSize: {{ max_upload_file_size }},
             {% endif %}
-
+            {% if max_number_of_files_for_fileupload > 0 %}
+            maxNumberOfFilesForFileupload: {{ max_number_of_files_for_fileupload }},
+            {% endif %}
             {% if request.user.is_authenticated and request.cur_note %}
             curNoteMsg: '{{ request.cur_note.message|urlize|escapejs }}',
             curNoteID: '{{ request.cur_note.id }}',

seahub/views/__init__.py

@@ -1264,6 +1264,7 @@ def react_fake_view(request, **kwargs):
         'storages': get_library_storages(request),
         'enable_repo_snapshot_label': settings.ENABLE_REPO_SNAPSHOT_LABEL,
         'resumable_upload_file_block_size': settings.RESUMABLE_UPLOAD_FILE_BLOCK_SIZE,
+        'max_number_of_files_for_fileupload': settings.MAX_NUMBER_OF_FILES_FOR_FILEUPLOAD,
         'share_link_expire_days_default': settings.SHARE_LINK_EXPIRE_DAYS_DEFAULT,
         'share_link_expire_days_min': SHARE_LINK_EXPIRE_DAYS_MIN,
         'share_link_expire_days_max': SHARE_LINK_EXPIRE_DAYS_MAX,