Add skeleton loader for usage_quota's storage
What does this MR do and why?
- Adds a skeleton loader to statistics-card giving more useful feedback to users, and update namespace storage app to utilize it
- Refactor
storage_usage_statistics_spec.js
to usecreateMockApollo
Screenshots or screen recordings
loading | loaded | with error |
---|---|---|
How to set up and validate locally
- Navigate to a group's usage quota > storage
- Observe the loader after the page loads
- (alternatively from Vue DevTools locate
<storage-usage-statistics>
and manually update itsloading
prop) - To test the error alert you can mess the
ee/app/assets/javascripts/usage_quotas/storage/queries/namespace_storage.query.graphql
query to throw an error (like rename$fullPath
to some gibberish😄 )
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #356659 (closed)
Edited by Ammar Alakkad