@mantine/dropzone not working with Ubuntu 22.04.1 LTS + Chrome 104.x

[vipindigiqt]

What package has an issue

@mantine/dropzone

Describe the bug

Dropzone isn't working properly on the mentioned version of Ubuntu 22 + Chrome

However, it works perfectly on Firefox.

Chrome :- Version 104.0.5112.101 (Official Build) (64-bit)

Ubuntu :- Ubuntu 22.04.1 LTS

What version of @mantine/hooks page do you have in package.json?

5.0.2

If possible, please include a link to a codesandbox with the reproduced problem

No response

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

No

Possible fix

No response

[rtivital]

Issue with react-dropzone, not Mantine – react-dropzone/react-dropzone#1222

[coltoneshaw]

@rtivital - In that GH issue they suggestion useFsAccessApi to false. Do we have any way to set this through the dropzone Mantine library? I'm using electron with macOS and hitting what seems to be a similar issue. Still debugging it. When I console.log the file object returned from onDrop it seems the path property is an empty string. It worked in v4.x. I'm working on upgrading my app to Mantine v5.x and experiencing this.

[rtivital]

@coltoneshaw I can change that, but, unfortunately, I do not have any device to test that it works as expected, maybe you would want to validate this and send a PR?

[nmay231]

@rtivital This is the same bug as described in a discord post. Setting useFsAccessApi to false does resolve the issue (I use Ubuntu 22.04 as well), but it has some potential issues for onFileDialogCancel as seen here. It's up to you to decide if it's worth the trouble.

I was going to try fixing it upstream in react-dropzone using a better workaround by setting description when setting accept Chromium bug details, but I haven't gotten to it yet since I was having issues installing node-sass for some reason.

[coltoneshaw]

@rtivital - I'm more than happy to test any fix for this, just let me know.

[rtivital]

Yeah, sure @coltoneshaw, I would appreciate your help with this

[jhanschoo]

This is ultimately a GTK or chromium bug I think. I've opened an issue in chromium, before realizing a better one has been filed from chancing upon this thread https://bugs.chromium.org/p/chromium/issues/detail?id=1350487 . The useFsAccessApi=false workaround is effective, and many browsers (Firefox, Safari, Chrome on Android, Brave) don't support the Filesystem Access API anyway.

[rtivital]

Alright, then to fix this issue set useFsAccessApi prop to false

[SrBrahma]

@rtivital this is fixed in react-dropzone@14.2.3: react-dropzone/react-dropzone#1222 (comment)

Can you please update the dep version?

Created #2746