[bug] infinite how-to upload status

[BenGamma]

Describe the bug Some users experienced infinite upload status in how-to submit modal.

To Reproduce Steps to reproduce the behavior:

1. Go to how-to/create
2. save a how-to
3. while uploading deactivate the wifi, so upload is uncomplete

Expected behavior User should have a better understanding of what is appening, with error message in case the upload fails.

Screenshots https://trello-attachments.s3.amazonaws.com/5dc6c7dbb782140a3bdcd40a/796x708/05b45d6fe6831061f4a0dca84fd268ae/6ada7d41398b-Screenshot_2019_11_09_at_13.49.01.png

Additional context Seems to append on the step images upload.

[BenGamma]

duplicate of #591

[chrismclarke]

@davehakkens @BenGamma - This issue recently resurfaced via discord, it's currently already labelled as high priority so would be good if we can encourage anybody interested to work on it.

More description/example at: https://github.com/ONEARMY/community-platform/issues/932

[chrismclarke]

Related (from other thread):

I think there might be a couple issues if for example a user is trying to simultaneously upload images with the same filename, and also linked to however the save draft system works and subsequently replacing/updating images. But I haven't figured out good ways to reproduce the other issues yet and so only posted this one.

[BenGamma]

Fell on the bug again. It's probably due to the fact that I'm uploading the same images again and again while testing, but still, we should provide a way to close the upload status popup when upload is stuck (user will not loose all his work writing the how-to).

1. We could add a small cross on top right of the pop up (that change the state to close popup) to allow user closing it (may be a bit dangerous as user like to click everywhere) but would be a easy quick fix.
2. By setting a timer we could display a message like : "upload seems stuck, click here to cancel and try again", after an upload step as been running for more than 10/15 seconds.
3. Clleaner way would probably be to detect the error server side, send error code back and update popup accordingly.

We probably want to trigger a hook to cancel upload but I'm not sure how this will work ?

[chrismclarke]

At this stage I'd say any fix would be worthwhile. A proper fix would be a medium amount of work, likely:

• bind the popup to the form own isSubmitting (?) status
• bind the form submit error to the store upload
• add relevant catches to the form upload to catch and pass on errors
• add image delete function to the backend

A bunch of similar stuff was done for the recent settings form refactor so could possibly be adapted, but still might take a bit of extra work (particularly if doing some general housekeeping on the form at the same time), so an interim solution would be great.

Until then I'd say probably just go for the x button option unless anyone's feeling more ambitious

[davehakkens]

What would the x button do?

• Making it able to re-upload again?
• Making it able to copy paste previous text to a new window to upload again?

[chrismclarke]

Pretty much, let the user dismiss the window that can then at least allow them to retry, or if not working copy-paste stuff they have written to try again another time. That's by far the simplest solution (1-liner)