Filepond makes a GET request to the root of my server when removing a preloaded local file [Bug]

[JeanSamGirard]

Is there an existing issue for this?

• I have searched the existing issues

Have you updated React FilePond, FilePond, and all plugins?

• I have updated FilePond and its plugins

Describe the bug

When using the option type:"local" to load files in filepond a GET request to the server is made to load the file, this works as intended. But when I click on the (X) to remove the loaded file, a seemingly useless GET request is sent to the server again, but this time not at the load end-point, but at the index of the server (Which is not a valid end-point in my case and causes http 404).

Plugins used :
"filepond-plugin-get-file": "^1.0.7",
"filepond-plugin-image-exif-orientation": "^1.0.11",
"filepond-plugin-image-preview": "^4.6.11",

Reproduction

Here is my React Functional component that contains Filepond :

// Filepond
import { FilePond, File, registerPlugin } from 'react-filepond';
import FilePondPluginImageExifOrientation from 'filepond-plugin-image-exif-orientation';
import FilePondPluginImagePreview from 'filepond-plugin-image-preview';
import FilePondPluginGetFile from 'filepond-plugin-get-file';
import 'filepond/dist/filepond.min.css';
import 'filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css';
import 'filepond-plugin-get-file/dist/filepond-plugin-get-file.min.css';
import { useController } from 'react-hook-form';
registerPlugin(
    FilePondPluginImageExifOrientation,
    FilePondPluginImagePreview,
    FilePondPluginGetFile
);

export default function FileField({
    name,
    control,
    rules,
    defaultValue = null,
    isMultiple,
    fileTypes,
    component_id,
}) {
    const [files, setFiles] = useState(defaultValue || []);

    // useController from react-hook-form probably has no impact here
    const { field } = useController({ name, control, rules, defaultValue });
    const pond = useRef(null);

    const handleChange = () => {
        let files = pond.current.getFiles();
        // Set the value of the control field
        field.onChange(
            files.map((f) => {
                return { source: f.serverId, options: { type: 'local' } };
            })
        );
        field.onBlur();
    };

    return (
        <div className='px-4 py-4 rounded bg-window-accent'>
            <FilePond
                ref={(ref) => (pond.current = ref)}
                files={files}
                onupdatefiles={setFiles}
                onprocessfile={handleChange}
                onremovefile={handleChange}
                required={rules.required.value}
                allowMultiple={isMultiple}
                server={`/api/files/${(component_id}`} 
                name={'file'}
                acceptedFileTypes={fileTypes}
                disabled={rules.disabled}
            />
        </div>
    );
}

Environment

- Device: Thinkpad laptop
- OS: Windows 10
- Browser: Chrome and FireFox (latest)
- React version: 17

[rikschennink]

Does this also happen when you remove filepond-plugin-get-file plugin?

[JeanSamGirard]

Does this also happen when you remove filepond-plugin-get-file plugin?

Yes I tried to remove that plugin I thought it was the culprit at first, but it still happened

Edit :
It also does the same for files set with type:"limbo" right after calling Revert and successfully reverting the file

But it does not do so for newly uploaded files that are not in the defaultvalue.

[rikschennink]

I'll look into it when I have some time.