question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Status wont change for accept/unaccepted types on Dropzone

See original GitHub issue

What package has an issue

@mantine/dropzone

Describe the bug

When i select/drop files onto drop zone, the “status” doesnt change at all. Either i upload an image or a document, it wont judge the mime type , causing accepted and rejected to be always false.

I am using mantine 3.4.0 with dropzone also on 3.4.0


 <Dropzone
                  className="mt-10"
                  onDrop={(file) => {
                    console.log(file);
                  }}
                  maxSize={3 * 1024 ** 2}
                  accept={[
                    "image/png",
                    "image/jpeg",
                    "image/jpg",
                    "image/sgv+xml",
                    "image/gif",
                  ]}
                  loading={loadingUpload}
                >
                  {(status) => (
                    <Group
                      position="center"
                      spacing="xl"
                      style={{ minHeight: 220, pointerEvents: "none" }}
                    >
                      <ImageUploadIcon
                        status={status}
                        style={{
                          width: 80,
                          height: 80,
                        }}
                      />

                      <div>
                        <Text size="sm" inline>
                          Drag images here or click to select files
                        </Text>
                        <Text size="sm" color="dimmed" inline mt={7}>
                          Attach as many files as you like, each file should not
                          exceed 5mb
                        </Text>
                      </div>
                    </Group>
                  )}
                </Dropzone>

In which browser did the problem occur

All

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 response

Possible fix

I have no idea what went wrong.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:22 (11 by maintainers)

github_iconTop GitHub Comments

1reaction
dukesxcommented, Jan 5, 2022

@Ultra-Instinct-05 I will post one as soon as possible but a busy with my Clinic. I am closing this for now.

0reactions
imranbarbhuiyacommented, Oct 15, 2022

Oh, I thought it’ll change the state when we upload a file. But if it’s only for drag then It’s working fine. Also thanks for the quick response

Read more comments on GitHub >

github_iconTop Results From Across the Web

Accepting specific file types - react-dropzone
By providing accept prop you can make the dropzone accept specific file types and reject the others. The value must be an object...
Read more >
Dropzone: change acceptedFiles dynamically - Stack Overflow
Change the acceptedFiles option after a user adds a file to tell Dropzone what file types may be accepted. This technically could be...
Read more >
pass rejection reason to onDropRejected callback #752 - GitHub
I recently ran into this issue where files are being rejected with the same code and files that were being accepted the day...
Read more >
react-dropzone
Files are accepted or rejected based on the accept , multiple , minSize and maxSize props. accept must be a valid MIME type...
Read more >
React Dropzone and File Uploads in React - Upmostly
In this tutorial, we'll learn how to use React Dropzone to create an awesome file ... a message if the user tries to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found