show loading spinner (/throbber) after clicking a button while request is processing

[olis1996]

A spinning circle has been implemented which is displayed on the "create stream" button during request processing. There is one thing about my implementation which I'm not happy about: the spinner's svg file can't be placed inside the public/images folder, because the framework (?) only allows resources which are located in the src folder.

I added a 2 second delay after clicking the button, so the animation is visible for a longer period. This is supposed to make it easier to give feedback and I will remove that delay before completing the PR.

What do you think about my approach? I'm really looking forward to your feedback.

[ChrisRousey]

Looks good 👍🏼 You could create a src/resources folder for the svg in my opinion. There is also a way to point at the public folder to access the resources, but it seems overly complicated to just access resources from a different location 😅

[olis1996]

Thank you very much for your feedback. I adapted my implementation according to your requests. There is three minor things left, which bother me: 1) The button changes its width depending on which content is displayed (text or spinner). I tried a fixed size of 150px, which worked, but I don't think that is the desired approach. 2) The spinner is not vertically centered and I dont know how to change that. (I suppose the text is not centered either, but it doesn't bother in that case) 3) It is not possible to disable the "Update stream" anchor element while waiting for the response. I guess it is not easily changed to a button element, right?

[olis1996]

Create + Edit Pipeline + Deployment buttons now have a loading spinner, too

[sonarcloud[bot]]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
No Duplication information