Abort not working on autoUpload = false OR Who to remove one file from the List?

[LukasOchmann]

Describe the bug
When autoUpload is false and abort is called the item will not be removed .

Expected behavior
Abort deletes the file from the list OR a remove method is provided.

Versions
"@rpldy/uploady": "^0.8.3",
"@rpldy/upload-drop-zone": "^0.8.3",
"@rpldy/uploader": "^0.8.3",
"@rpldy/sender": "^0.8.0",
"@rpldy/shared": "^0.8.0",

Code

const FileItems = () => {
  const abort = useItemAbort();
  const [files, setFiles] = useState([]);
  useBatchAddListener((batch: Batch) => {
    setFiles(prevState => [...prevState, ...batch.items]);
  });

  useItemAbortListener((batch: BatchItem) => {
    debugger;
  });

  useBatchAbortListener(batch => {
    debugger;
  });

  useAllAbortListener(() => {
    debugger;
  });

  return files.map(file => <FileItem file={file} onClick={() => abort(file.id)} />)
}

const App = () => {
  return <Uploady autoUpload={false} >
      <FileItems />  
   </Uploady
}

[yoavniran]

@LukasOchmann is this the actual code youre using?
the hooks you use in this code are outside the context provider. So this wont work.

You should actually be getting an error.

If this isnt the actual code, please provide an updated version or codesandbox

[LukasOchmann]

It is an reduces version. My Example was wrong.

[LukasOchmann]

@yoavniran i created a Sandbox: https://codesandbox.io/s/vibrant-cdn-b25h6?fontsize=14&hidenavigation=1&theme=dark

[yoavniran]

There are a few things going on here:

• Currently abort cannot be used on items that are not already uploading.

• There is currently no way to clear pending uploads (autoUploads = false) from the UI components. The Uploader instance does have a clearPending method but its not exposed to the UploadyContext API.

• clearPending doesnt have the granularity to remove a single item, only all pending batches

• there's a bug in your codesandbox, line 43, youre calling the abort method when passing it to the button onClick instead of when the button is clicked. This wont work of course but Im guessing its just a mistake in the sandbox and not your actual code.

• even if everything worked as you need. You would need to remove the aborted file from your UI (files state). Probably using using the abort event listeners.

With all that in mind, I will need to think of a way to make it easy to remove pending batch items. I think modifying the abort methods is the best approach since it will make it a single flow instead of having implementations decide which flow to use based on internal Uploader state. WDYT?

I will look into adding this as a feature soon.

[LukasOchmann]

Thank you for your Response and for accepting it as an enhancement,

yes line 43 was a mistake, i was in a hurry....

i also prefer an solution wich modifies the abort method. With an extra method for that usecase i had to evaluate the current files state instead of simply aborting it.

As an alternativ to exposing the Uploder instance, could the Uplody take a prop "instance" wich takes in an custom Uploder Instance? or maybe an higher order Component withCustomUploder

[yoavniran]

I wouldnt like to expose the uploader instance unless there's a very strong case for it

In any case, Ive a solution I believe will work nicely. Abort will take care of pending uploads and Uploady context will have the clearPending method available.

This way you'll be able to cancel individual (pending) uploads or all of them together