react-images-upload - npm Package Compare versions

Comparing version 1.2.7 to 1.2.8

compiled.js

@@ -45,2 +45,7 @@ 'use strict';
 
+var ERROR = {
+  NOT_SUPPORTED_EXTENSION: 'NOT_SUPPORTED_EXTENSION',
+  FILESIZE_TOO_LARGE: 'FILESIZE_TOO_LARGE'
+};
+
 var ReactImageUploadComponent = function (_React$Component) {
@@ -57,4 +62,3 @@ _inherits(ReactImageUploadComponent, _React$Component);
       files: [],
-      notAcceptedFileType: [],
-      notAcceptedFileSize: []
+      fileErrors: []
     };
@@ -110,27 +114,40 @@ _this.inputElement = '';
       var allFilePromises = [];
+      var fileErrors = [];
 
       // Iterate over all uploaded files
       for (var i = 0; i < files.length; i++) {
-        var f = files[i];
+        var file = files[i];
+        var fileError = {
+          name: file.name
+        };
         // Check for file extension
-        if (!this.hasExtension(f.name)) {
-          var newArray = this.state.notAcceptedFileType.slice();
-          newArray.push(f.name);
-          this.setState({ notAcceptedFileType: newArray });
+        if (!this.hasExtension(file.name)) {
+          fileError = Object.assign(fileError, {
+            type: ERROR.NOT_SUPPORTED_EXTENSION
+          });
+          fileErrors.push(fileError);
           continue;
         }
         // Check for file size
-        if (f.size > this.props.maxFileSize) {
-          var _newArray = this.state.notAcceptedFileSize.slice();
-          _newArray.push(f.name);
-          this.setState({ notAcceptedFileSize: _newArray });
+        if (file.size > this.props.maxFileSize) {
+          fileError = Object.assign(fileError, {
+            type: ERROR.FILESIZE_TOO_LARGE
+          });
+          fileErrors.push(fileError);
           continue;
         }
 
-        allFilePromises.push(this.readFile(f));
+        allFilePromises.push(this.readFile(file));
       }
 
+      this.setState({
+        fileErrors: fileErrors
+      });
+
+      var singleImage = this.props.singleImage;
+
+
       Promise.all(allFilePromises).then(function (newFilesData) {
-        var dataURLs = _this2.state.pictures.slice();
-        var files = _this2.state.files.slice();
+        var dataURLs = singleImage ? [] : _this2.state.pictures.slice();
+        var files = singleImage ? [] : _this2.state.files.slice();
 
@@ -207,28 +224,14 @@ newFilesData.forEach(function (newFileData) {
 
-      var notAccepted = '';
-      if (this.state.notAcceptedFileType.length > 0) {
-        notAccepted = this.state.notAcceptedFileType.map(function (error, index) {
-          return _react2.default.createElement(
-            'div',
-            { className: 'errorMessage ' + _this4.props.errorClass, key: index, style: _this4.props.errorStyle },
-            '* ',
-            error,
-            ' ',
-            _this4.props.fileTypeError
-          );
-        });
-      }
-      if (this.state.notAcceptedFileSize.length > 0) {
-        notAccepted = this.state.notAcceptedFileSize.map(function (error, index) {
-          return _react2.default.createElement(
-            'div',
-            { className: 'errorMessage ' + _this4.props.errorClass, key: index, style: _this4.props.errorStyle },
-            '* ',
-            error,
-            ' ',
-            _this4.props.fileSizeError
-          );
-        });
-      }
-      return notAccepted;
+      var fileErrors = this.state.fileErrors;
+
+      return fileErrors.map(function (fileError, index) {
+        return _react2.default.createElement(
+          'div',
+          { className: 'errorMessage ' + _this4.props.errorClass, key: index, style: _this4.props.errorStyle },
+          '* ',
+          fileError.name,
+          ' ',
+          fileError.type === ERROR.FILESIZE_TOO_LARGE ? _this4.props.fileSizeError : _this4.props.fileTypeError
+        );
+      });
     }
@@ -235,0 +238,0 @@

index.d.ts

@@ -6,3 +6,3 @@ import { Component } from 'react'
   fileContainerStyle?: object
-  onChange?: (files: File[]) => void
+  onChange?: (files: File[],pictures:string[]) => void
   buttonClassName?: string
@@ -9,0 +9,0 @@ buttonStyles?: object

index.js

@@ -15,2 +15,7 @@ import React from 'react';
 
+const ERROR = {
+  NOT_SUPPORTED_EXTENSION: 'NOT_SUPPORTED_EXTENSION',
+  FILESIZE_TOO_LARGE: 'FILESIZE_TOO_LARGE'
+}
+
 class ReactImageUploadComponent extends React.Component {
@@ -22,4 +27,3 @@ constructor(props) {
       files: [],
-      notAcceptedFileType: [],
-      notAcceptedFileSize: []
+      fileErrors: []
     };
@@ -61,27 +65,39 @@ this.inputElement = '';
     const allFilePromises = [];
+    const fileErrors = [];
 
     // Iterate over all uploaded files
     for (let i = 0; i < files.length; i++) {
-      let f = files[i];
+      let file = files[i];
+      let fileError = {
+        name: file.name,
+      };
       // Check for file extension
-      if (!this.hasExtension(f.name)) {
-        const newArray = this.state.notAcceptedFileType.slice();
-        newArray.push(f.name);
-        this.setState({notAcceptedFileType: newArray});
+      if (!this.hasExtension(file.name)) {
+        fileError = Object.assign(fileError, {
+          type: ERROR.NOT_SUPPORTED_EXTENSION
+        });
+        fileErrors.push(fileError);
         continue;
       }
       // Check for file size
-      if(f.size > this.props.maxFileSize) {
-        const newArray = this.state.notAcceptedFileSize.slice();
-        newArray.push(f.name);
-        this.setState({notAcceptedFileSize: newArray});
+      if(file.size > this.props.maxFileSize) {
+        fileError = Object.assign(fileError, {
+          type: ERROR.FILESIZE_TOO_LARGE
+        });
+        fileErrors.push(fileError);
         continue;
       }
 
-      allFilePromises.push(this.readFile(f));
+      allFilePromises.push(this.readFile(file));
     }
 
+    this.setState({
+      fileErrors
+    });
+
+    const {singleImage} = this.props;
+
     Promise.all(allFilePromises).then(newFilesData => {
-      const dataURLs = this.state.pictures.slice();
-      const files = this.state.files.slice();
+      const dataURLs = singleImage?[]:this.state.pictures.slice();
+      const files = singleImage?[]:this.state.files.slice();
 
@@ -138,22 +154,10 @@ newFilesData.forEach(newFileData => {
   renderErrors() {
-    let notAccepted = '';
-    if (this.state.notAcceptedFileType.length > 0) {
-      notAccepted = this.state.notAcceptedFileType.map((error, index) => {
-        return (
-          <div className={'errorMessage ' + this.props.errorClass} key={index} style={this.props.errorStyle}>
-            * {error} {this.props.fileTypeError}
-          </div>
-        )
-      });
-    }
-    if (this.state.notAcceptedFileSize.length > 0) {
-      notAccepted = this.state.notAcceptedFileSize.map((error, index) => {
-        return (
-          <div className={'errorMessage ' + this.props.errorClass} key={index} style={this.props.errorStyle}>
-            * {error} {this.props.fileSizeError}
-          </div>
-        )
-      });
-    }
-    return notAccepted;
+    const { fileErrors } = this.state;
+    return fileErrors.map((fileError, index) => {
+      return (
+        <div className={'errorMessage ' + this.props.errorClass} key={index} style={this.props.errorStyle}>
+          * {fileError.name} {fileError.type === ERROR.FILESIZE_TOO_LARGE ? this.props.fileSizeError: this.props.fileTypeError}
+        </div>
+      );
+    });
   }
@@ -160,0 +164,0 @@

package.json

 {
   "name": "react-images-upload",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "private": false,
@@ -11,4 +11,4 @@ "main": "compiled.js",
   "dependencies": {
-    "react": "^16.2.0",
-    "react-flip-move": "^3.0.1"
+    "react": "^16.12.0",
+    "react-flip-move": "^3.0.4"
   },
@@ -39,4 +39,4 @@ "scripts": {
     "babel-cli": "^6.26.0",
-    "babel-core": "^6.26.0",
-    "babel-loader": "^7.1.4",
+    "babel-core": "^6.26.3",
+    "babel-loader": "^7.1.5",
     "babel-preset-env": "^1.6.1",
@@ -43,0 +43,0 @@ "babel-preset-react": "^6.24.1"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

29434

decreased by-0.89%

Lines of code

766

decreased by-0.13%

Dependency changes

• Updatedreact@^16.12.0

• Updatedreact-flip-move@^3.0.4