react-dropzone not working with Ubuntu and Google Chrome

I have implemented a file Drag and Drop component using react-dropzone like the following:

import React, { useCallback } from 'react'
import { useDropzone } from 'react-dropzone'

function FileDragAndDrop(): JSX.Element {
  const onDrop = useCallback((acceptedFiles: File[]) => {
    console.log(acceptedFiles)
  }, [])

  const { getRootProps, getInputProps, isDragActive } = useDropzone({
    onDrop,
  })

  const getClassName = (className: any, isActive: any): any => {
    if (!isActive) return className
    return `${className} ${className}-active`
  }

  return (
    <div
      className={`${getClassName('dropzone', isDragActive)}  h-full`}
      {...getRootProps()}
    >
      <input className="dropzone-input " {...getInputProps()} />
      <div className="text-center h-full">
        {isDragActive ? (
          <p className="dropzone-content">Release to drop the files here</p>
        ) : (
          <p className="dropzone-content">
            Drag and drop some files here, or click to select files
          </p>
        )}
      </div>
    </div>
  )
}

export default FileDragAndDrop

Using Windows 11 with Google Chrome version 103.0.5060.134 everything works as expected. Unfortunately, with Ubuntu 21.10 and Google Chrome version 103.0.5060.134 it's not working. The problem here is only with the dropzone, since an upload through the input works.

Currently, I have tried this only with Google Chrome, but I will try different browsers and keep this question updated if I can get more information.

EDIT: Ubuntu and Firefox 103 work. Ubuntu and Brave 1.41.100 not working.

Can somebody give me a hint how to solve this issue that cause me already days of struggling.