Skip to content

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 use createMockApollo

Screenshots or screen recordings

loading loaded with error
Screen_Shot_2022-05-23_at_20.33.21 Screen_Shot_2022-05-23_at_20.33.08

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 its loading 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.

Related to #356659 (closed)

Edited by Ammar Alakkad

Merge request reports