diff --git a/lib/gui/app/components/image-selector/image-selector.tsx b/lib/gui/app/components/image-selector/image-selector.tsx index 10ab240c..a95795e2 100644 --- a/lib/gui/app/components/image-selector/image-selector.tsx +++ b/lib/gui/app/components/image-selector/image-selector.tsx @@ -19,7 +19,6 @@ import * as _ from 'lodash'; import { GPTPartition, MBRPartition } from 'partitioninfo'; import * as path from 'path'; import * as React from 'react'; -import { default as Dropzone } from 'react-dropzone'; import { Modal } from 'rendition'; import { default as styled } from 'styled-components'; @@ -102,7 +101,7 @@ export class ImageSelector extends React.Component< this.openImageSelector = this.openImageSelector.bind(this); this.reselectImage = this.reselectImage.bind(this); - this.handleOnDrop = this.handleOnDrop.bind(this); + this.onDrop = this.onDrop.bind(this); this.showSelectedImageDetails = this.showSelectedImageDetails.bind(this); } @@ -286,14 +285,23 @@ export class ImageSelector extends React.Component< } } - private handleOnDrop(acceptedFiles: Array<{ path: string }>) { - const [file] = acceptedFiles; - + private onDrop(event: React.DragEvent) { + const [file] = event.dataTransfer.files; if (file) { this.selectImageByPath(file.path); } } + private onDragOver(event: React.DragEvent) { + // Needed to get onDrop events on div elements + event.preventDefault(); + } + + private onDragEnter(event: React.DragEvent) { + // Needed to get onDrop events on div elements + event.preventDefault(); + } + private showSelectedImageDetails() { analytics.logEvent('Show selected image tooltip', { imagePath: selectionState.getImagePath(), @@ -321,18 +329,18 @@ export class ImageSelector extends React.Component< return ( <> -
- - {({ getRootProps, getInputProps }) => ( -
- - -
- )} -
+
+
+ +
{hasImage ? ( diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json index 09594d53..e12c1428 100644 --- a/npm-shrinkwrap.json +++ b/npm-shrinkwrap.json @@ -1578,11 +1578,6 @@ "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz", "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==" }, - "attr-accept": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.0.0.tgz", - "integrity": "sha512-I9SDP4Wvh2ItYYoafEg8hFpsBe96pfQ+eabceShXt3sw2fbIP96+Aoj9zZE0vkZNAkXXzHJATVRuWz+h9FxJxQ==" - }, "aws-sign2": { "version": "0.7.0", "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz", @@ -5864,14 +5859,6 @@ "bluebird": "^3.5.3" } }, - "file-selector": { - "version": "0.1.12", - "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.1.12.tgz", - "integrity": "sha512-Kx7RTzxyQipHuiqyZGf+Nz4vY9R1XGxuQl/hLoJwq+J4avk/9wxxgZyHKtbyIPJmbD4A66DWGYfyykWNpcYutQ==", - "requires": { - "tslib": "^1.9.0" - } - }, "file-type": { "version": "8.1.0", "resolved": "https://registry.npmjs.org/file-type/-/file-type-8.1.0.tgz", @@ -10585,28 +10572,6 @@ "scheduler": "^0.17.0" } }, - "react-dropzone": { - "version": "10.2.1", - "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-10.2.1.tgz", - "integrity": "sha512-Me5nOu8hK9/Xyg5easpdfJ6SajwUquqYR/2YTdMotsCUgJ1pHIIwNsv0n+qcIno0tWR2V2rVQtj2r/hXYs2TnQ==", - "requires": { - "attr-accept": "^2.0.0", - "file-selector": "^0.1.12", - "prop-types": "^15.7.2" - }, - "dependencies": { - "prop-types": { - "version": "15.7.2", - "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz", - "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==", - "requires": { - "loose-envify": "^1.4.0", - "object-assign": "^4.1.1", - "react-is": "^16.8.1" - } - } - } - }, "react-google-recaptcha": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-2.0.1.tgz", diff --git a/package.json b/package.json index 9077581e..05c74718 100644 --- a/package.json +++ b/package.json @@ -75,7 +75,6 @@ "pretty-bytes": "^5.3.0", "react": "^16.8.5", "react-dom": "^16.8.5", - "react-dropzone": "^10.2.1", "redux": "^3.5.2", "rendition": "^11.24.0", "request": "^2.81.0",