Improve media library upload progress indicator

[adamsilverstein]

When uploading in the media library, the progress bar shows the upload progress of the image.

Once the image is fully uploaded WordPress creates the sub-sized images used to serve images on the front end. Depending on your configuration (theme, plugins, server), and the upload size this can take quite a while to complete. During sub-sized image creation, the progress bar for the image shows as "full". Finally, when the image sub size generation completes, the image changes from a gray box to the thumbnail of the uploaded image and if multiple images have been uploaded, the uploader moves on to the next image. Screencast attached.

The problem here is that no progress is shown for the image regeneration phase.

Uploading in the block editor works a bit differently: as soon as the image is dropped onto the editor to upload, a grayed out version of the image is shown with a spinner. The spinner spins during the upload and continues spinning during sub-size creation. Finally, when all sub sizes are created, the image becomes fully saturated and the spinner goes away. Looks like this is changing to a progress bar though, see ​https://github.com/WordPress/gutenberg/issues/13984 & ​https://github.com/WordPress/gutenberg/tree/trunk/packages/block-editor/src/components/media-upload-progress

Two potential improvements we could make in the media library:

1. immediately show the thumbnail of the dropped image instead of the gray box
2. switch to a spinner entirely, or for the image regeneration phase or try to show actual progress. The challenge with showing progress is we don't know how long the request will take on the server.