kobalte icon indicating copy to clipboard operation
kobalte copied to clipboard

Inconsistent behaviour of `FileField`'s `onFileChange`

Open maciek50322 opened this issue 9 months ago • 1 comments

Describe the bug onFileChage sometimes reports only changed files, but on delete click reports all previously accepted files + last rejected files

To Reproduce Steps to reproduce the behavior:

  1. Use something like that
    <FileField
      multiple
      onFileChange={(e) => console.log(e)}
    >
    <FileField.Trigger>
      Choose
    </FileField.Trigger>
    <FileField.HiddenInput />
      <FileField.ItemList>
        {(file) => {
          return (
            <FileField.Item>
              <FileField.ItemName />
              <FileField.ItemDeleteTrigger>
                  DELETE
              </FileField.ItemDeleteTrigger>
            </FileField.Item>
          );
        }}
      </FileField.ItemList>
    </FileField>
    
  2. Add files one by one (without error) - see logs of only newly added files one by one
  3. Delete some file with trigger - see log of all previously added files
  • Extra behaviour: If you make file reject just before clicking delete, you'll get same reject report on deleting

Expected behavior onFileChange should always report consistently all accepted files (and rejected just once - as they are rejected) or always report only changed files - so no report on delete

Eg.

From onProcessFiles:

// trigger on change
mergedProps.onFileChange?.({ acceptedFiles, rejectedFiles });

removeFile:

// trigger on change
mergedProps.onFileChange?.({
  acceptedFiles: unwrap(acceptedFilesState),
  rejectedFiles: unwrap(rejectedFilesState),
});

To onProcessFiles:

// trigger on change
mergedProps.onFileChange?.({ 
  acceptedFiles: unwrap(acceptedFilesState), 
  rejectedFiles 
});

removeFile:

// trigger on change
mergedProps.onFileChange?.({
  acceptedFiles: unwrap(acceptedFilesState),
  rejectedFiles: [],
});

maciek50322 avatar Mar 17 '25 09:03 maciek50322

+1

vish9812 avatar May 27 '25 15:05 vish9812