feat: add file type filter in drop zone

vatesfr · Apr 21, 2022 · 23a8b03 · 23a8b03
1 parent 25fb509
commit 23a8b03
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/packages/xo-web/src/common/dropzone/index.js b/packages/xo-web/src/common/dropzone/index.js
@@ -10,17 +10,19 @@ export default class Dropzone extends Component {
     onDrop: PropTypes.func,
     message: PropTypes.node,
     multiple: PropTypes.bool,
+    accept: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
   }
 
   render() {
-    const { onDrop, message, multiple } = this.props
+    const { onDrop, message, multiple, accept } = this.props
 
     return (
       <ReactDropzone
         activeClassName={styles.activeDropzone}
         className={styles.dropzone}
         multiple={multiple}
         onDrop={onDrop}
+        accept={accept}
       >
         <div className={styles.dropzoneText}>{message}</div>
       </ReactDropzone>

diff --git a/packages/xo-web/src/xo-app/disk-import/index.js b/packages/xo-web/src/xo-app/disk-import/index.js
@@ -114,7 +114,11 @@ const DiskImport = decorate([
         </Row>
         {sr !== undefined && (
           <div>
-            <Dropzone onDrop={effects.handleDrop} message={_('dropDisksFiles')} />
+            <Dropzone
+              onDrop={effects.handleDrop}
+              message={_('dropDisksFiles')}
+              accept={sr.content_type === 'iso' ? '.iso' : '.vhd,.vmdk'}
+            />
             {loadingDisks && <Icon icon='loading' />}
             {disks.length > 0 && (
               <div>