Loading bar does not disappear after uploading file.

[trych]

Nature of issue?

• Found a bug

Details about the bug:

• Web browser and version: Current Chrome and Firefox
• Operating System: current macOS
• Steps to reproduce this bug:

After successfully uploading a file (and having it appear in the sidebar), the loading bar of this upload stays in place instead of disappearing. So I see this and have no feedback, if the upload was successful or is still in progress:

[catarak]

thanks for making this issue! i believe this only happens for certain file types, which are plaintext files (.js, .css, .txt, .csv, etc) that are uploaded directly to the web editor rather than to aws.

[ashu8912]

#375 #375 (comment)

[adrijshikhar]

@catarak i would like to work on this issue, can you please assign it to me?

[MohdImran001]

Hii @catarak, I would like to work on this issue.

[catarak]

@MohdImran001 go ahead!

[MohdImran001]

Hii @catarak, I would also like to change the color of the progress bar to Amaranth (#ed225d) to match the current theme.

[MohdImran001]

Hii @catarak, I have fixed this issue. Please review my PR #1630

[MohdImran001]

Hii @catarak, this line of code in the uploader.js file is not working and the progress bar is still visible after a successful upload. I tried changing its width to 0 and display property to 'none but nothing works.

file.previewElement.querySelector('.dz-upload').style.width = '100%';

After experimenting a little bit I found out that this works perfectly in a function passed in the success parameter of dropzone configuration. Please refer to the code below. This works perfectly for all file types.

In createDropzone() method, in FileUploader.js.

success: (file, response) => {
        file.previewElement.classList.remove('dz-error');
        file.previewElement.classList.add('dz-success');
        file.previewElement.querySelector('.dz-progress').style.display = 'none';
}

[catarak]

I think the title of this issue is confusing. I decided to make it match the the way that other file types are uploaded, rather than remove the progress bar. Here they are side by side:

[trych]

In what way is the title confusing?

I decided to make it match the the way that other file types are uploaded, rather than remove the progress bar. Here they are side by side:

Do I understand this right that the fix is to have the upload progress bars not disappear at all anymore? In what way is this helpful and how do I know when my upload is finished?

[catarak]

Do I understand this right that the fix is to have the upload progress bars not disappear at all anymore?

Ahhh sorry that this is confusing! There's an animation that shows the progress bar filling up. Before this fix, the progress bar would just remain unfilled for text files.