Set `accept` attribute to `image/*` in ImageUpload (#989)

That way, browsers will suggest to the users to upload an image file instead of any kind of file.

The behaviour is in-line with Element's, which specifies the same attribute when selecting an avatar.

Please note that it does not prevent users from uploading non-image files as avatars, as browsers interpret that attribute as a mere suggestion, which can be bypassed in the file select dialog.

Partially fixes #982.

diff --git a/src/app/molecules/image-upload/ImageUpload.jsx b/src/app/molecules/image-upload/ImageUpload.jsx
index 34d0d4be1cf3cb54b2f7ef5be341b5b78a3ebfa0..53fc7e161bfdd95b552116bd33c4a6fd105dae03 100644 (file)
--- a/src/app/molecules/image-upload/ImageUpload.jsx
+++ b/src/app/molecules/image-upload/ImageUpload.jsx
@@ -74,7 +74,7 @@ function ImageUpload({
           <Text variant="b3">{uploadPromise ? 'Cancel' : 'Remove'}</Text>
         </button>
       )}
-      <input onChange={uploadImage} style={{ display: 'none' }} ref={uploadImageRef} type="file" />
+      <input onChange={uploadImage} style={{ display: 'none' }} ref={uploadImageRef} type="file" accept="image/*" />
     </div>
   );
 }