Spike - investigate migrating Shared filter bar from Vuex to Apollo + Graphql

Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.

• Close this issue

Background

Vuex has been deemed legacy and we no longer recommended as our preferred option for frontend store management

We should investigate the work required to migrate from our REST + Vuex apis, to Graphql + Apollo. This issue specifically covers the Shared filter bar used across various analytics pages and other areas.

Links

• Migrating from Vuex
• Graphql guide

Concerns

• Shared component used in multiple locations
  • app/assets/javascripts/add_context_commits_modal/store/index.js
  • app/assets/javascripts/analytics/cycle_analytics/store/index.js
  • ee/app/assets/javascripts/analytics/code_review_analytics/store/index.js
  • ee/app/assets/javascripts/analytics/cycle_analytics/store/index.js
  • ee/app/assets/javascripts/analytics/merge_request_analytics/components/throughput_chart.stories.js
  • ee/app/assets/javascripts/analytics/merge_request_analytics/components/throughput_table.stories.js
  • ee/app/assets/javascripts/analytics/merge_request_analytics/store/index.js

Goals / possible questions to answer

• API - REST to Graphql
  • Do we have the graphql queries/mutations for all the requests needed
  • What are the gaps? Can we partially migrate to graphql
• Data store - Vuex to Apollo
  • Is it a single flat store, or a collection of vuex modules? Can modules be separated?
  • Is there an existing vuex store, or a custom solution
  • Are there shared modules used e.g. filters
• Tests
  • Do we have feature tests, do they appear to be sufficient?
  • Do we have unit tests?
• Other ??