Merge branch 'mw-pa-refactor-filter-actions' into 'master'

Productivity Analytics: Refactor setPath action

See merge request gitlab-org/gitlab!21166

ee/app/assets/javascripts/analytics/productivity_analytics/filtered_search_productivity_analytics.js

 import ProductivityAnalyticsFilteredSearchTokenKeys from './productivity_analytics_filtered_search_token_keys';
 import FilteredSearchManager from '~/filtered_search/filtered_search_manager';
+import { urlParamsToObject } from '~/lib/utils/common_utils';
 import store from './store';
 
 export default class FilteredSearchProductivityAnalytics extends FilteredSearchManager {
@@ -19,6 +20,7 @@ export default class FilteredSearchProductivityAnalytics extends FilteredSearchM
    * Updates filters in productivity analytics store
    */
   updateObject = path => {
-    store.dispatch('filters/setPath', path);
+    const filters = urlParamsToObject(path);
+    store.dispatch('filters/setFilters', filters);
   };
 }

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/filters/actions.js

@@ -29,8 +29,15 @@ export const setProjectPath = ({ commit, dispatch }, projectPath) => {
   });
 };
 
-export const setPath = ({ commit, dispatch }, path) => {
-  commit(types.SET_PATH, path);
+export const setFilters = (
+  { commit, dispatch },
+  { author_username, label_name, milestone_title },
+) => {
+  commit(types.SET_FILTERS, {
+    authorUsername: author_username,
+    labelName: label_name,
+    milestoneTitle: milestone_title,
+  });
 
   dispatch('charts/resetMainChartSelection', true, { root: true });
 

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/filters/getters.js

 import dateFormat from 'dateformat';
-import { urlParamsToObject } from '~/lib/utils/common_utils';
 import { getDateInPast, beginOfDayTime, endOfDayTime } from '~/lib/utils/datetime_utility';
 import { chartKeys, scatterPlotAddonQueryDays } from '../../../constants';
 import { dateFormats } from '../../../../shared/constants';
@@ -21,8 +20,15 @@ import { dateFormats } from '../../../../shared/constants';
  *
  */
 export const getCommonFilterParams = state => chartKey => {
-  const { groupNamespace, projectPath, filters, startDate, endDate } = state;
-  const { author_username, milestone_title, label_name } = urlParamsToObject(filters);
+  const {
+    groupNamespace,
+    projectPath,
+    startDate,
+    endDate,
+    authorUsername,
+    labelName,
+    milestoneTitle,
+  } = state;
 
   // for the scatterplot we need to remove 30 days from the state's merged_at_after date
   const mergedAtAfterDate =
@@ -33,9 +39,9 @@ export const getCommonFilterParams = state => chartKey => {
   return {
     group_id: groupNamespace,
     project_id: projectPath,
-    author_username,
-    milestone_title,
-    label_name,
+    author_username: authorUsername,
+    milestone_title: milestoneTitle,
+    label_name: labelName,
     merged_at_after: `${mergedAtAfterDate}${beginOfDayTime}`,
     merged_at_before: `${dateFormat(endDate, dateFormats.isoDate)}${endOfDayTime}`,
   };

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/filters/mutation_types.js

 export const SET_GROUP_NAMESPACE = 'SET_GROUP_NAMESPACE';
 export const SET_PROJECT_PATH = 'SET_PROJECT_PATH';
-export const SET_PATH = 'SET_PATH';
+export const SET_FILTERS = 'SET_FILTERS';
 export const SET_DATE_RANGE = 'SET_DATE_RANGE';

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/filters/mutations.js

@@ -8,8 +8,10 @@ export default {
   [types.SET_PROJECT_PATH](state, projectPath) {
     state.projectPath = projectPath;
   },
-  [types.SET_PATH](state, path) {
-    state.filters = path;
+  [types.SET_FILTERS](state, { authorUsername, labelName, milestoneTitle }) {
+    state.authorUsername = authorUsername;
+    state.labelName = labelName;
+    state.milestoneTitle = milestoneTitle;
   },
   [types.SET_DATE_RANGE](state, { startDate, endDate }) {
     state.startDate = startDate;

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/filters/state.js

 export default () => ({
   groupNamespace: null,
   projectPath: null,
-  filters: '',
+  authorUsername: null,
+  labelName: [],
+  milestoneTitle: null,
   startDate: null,
   endDate: null,
 });

ee/spec/frontend/analytics/productivity_analytics/store/actions_spec.js

 import testAction from 'helpers/vuex_action_helper';
 import * as actions from 'ee/analytics/productivity_analytics/store/actions';
 import SET_ENDPOINT from 'ee/analytics/productivity_analytics/store/mutation_types';
-import getInitialState from 'ee/analytics/productivity_analytics/store/modules/filters/state';
+import getInitialState from 'ee/analytics/productivity_analytics/store/state';
 
 describe('Productivity analytics actions', () => {
   describe('setEndpoint', () => {

ee/spec/frontend/analytics/productivity_analytics/store/modules/filters/actions_spec.js

 import * as actions from 'ee/analytics/productivity_analytics/store/modules/filters/actions';
 import * as types from 'ee/analytics/productivity_analytics/store/modules/filters/mutation_types';
+import testAction from 'helpers/vuex_action_helper';
 import { chartKeys } from 'ee/analytics/productivity_analytics/constants';
+import getInitialState from 'ee/analytics/productivity_analytics/store/modules/filters/state';
 
 describe('Productivity analytics filter actions', () => {
   let store;
@@ -9,7 +11,6 @@ describe('Productivity analytics filter actions', () => {
   const endDate = new Date(currentYear, 8, 7);
   const groupNamespace = 'gitlab-org';
   const projectPath = 'gitlab-org/gitlab-test';
-  const path = 'author_username=root';
 
   beforeEach(() => {
     store = {
@@ -82,12 +83,12 @@ describe('Productivity analytics filter actions', () => {
     });
   });
 
-  describe('setPath', () => {
-    it('commits the SET_PATH mutation', done => {
+  describe('setFilters', () => {
+    it('commits the SET_FILTERS mutation', done => {
       actions
-        .setPath(store, path)
+        .setFilters(store, { author_username: 'root' })
         .then(() => {
-          expect(store.commit).toHaveBeenCalledWith(types.SET_PATH, path);
+          expect(store.commit).toHaveBeenCalledWith(types.SET_FILTERS, { authorUsername: 'root' });
 
           expect(store.dispatch.mock.calls[0]).toEqual([
             'charts/resetMainChartSelection',
@@ -117,9 +118,9 @@ describe('Productivity analytics filter actions', () => {
   describe('setDateRange', () => {
     it('commits the SET_DATE_RANGE mutation and fetches data by default', done => {
       actions
-        .setPath(store, { startDate, endDate })
+        .setDateRange(store, { startDate, endDate })
         .then(() => {
-          expect(store.commit).toHaveBeenCalledWith(types.SET_PATH, { startDate, endDate });
+          expect(store.commit).toHaveBeenCalledWith(types.SET_DATE_RANGE, { startDate, endDate });
 
           expect(store.dispatch.mock.calls[0]).toEqual([
             'charts/resetMainChartSelection',
@@ -145,18 +146,19 @@ describe('Productivity analytics filter actions', () => {
         .catch(done.fail);
     });
 
-    it("commits the SET_DATE_RANGE mutation and doesn't fetch data when fetchData=false", done => {
-      actions
-        .setPath(store, { fetchData: false, startDate, endDate })
-        .then(() => {
-          expect(store.commit).toHaveBeenCalledWith(types.SET_PATH, {
-            fetchData: false,
-            startDate,
-            endDate,
-          });
-        })
-        .then(done)
-        .catch(done.fail);
-    });
+    it("commits the SET_DATE_RANGE mutation and doesn't fetch data when skipFetch=true", done =>
+      testAction(
+        actions.setDateRange,
+        { skipFetch: true, startDate, endDate },
+        getInitialState(),
+        [
+          {
+            type: types.SET_DATE_RANGE,
+            payload: { startDate, endDate },
+          },
+        ],
+        [],
+        done,
+      ));
   });
 });

ee/spec/frontend/analytics/productivity_analytics/store/modules/filters/getters_spec.js

@@ -17,7 +17,9 @@ describe('Productivity analytics filter getters', () => {
       state = {
         groupNamespace: 'gitlab-org',
         projectPath: 'gitlab-org/gitlab-test',
-        filters: '?author_username=root&milestone_title=foo&label_name[]=labelxyz',
+        authorUsername: 'root',
+        milestoneTitle: 'foo',
+        labelName: ['labelxyz'],
         startDate,
         endDate,
       };

ee/spec/frontend/analytics/productivity_analytics/store/modules/filters/mutations_spec.js

@@ -27,12 +27,16 @@ describe('Productivity analytics filter mutations', () => {
     });
   });
 
-  describe(types.SET_PATH, () => {
-    it('sets the filters string', () => {
-      const path = '?author_username=root&milestone_title=foo&label_name[]=labelxyz';
-      mutations[types.SET_PATH](state, path);
-
-      expect(state.filters).toBe(path);
+  describe(types.SET_FILTERS, () => {
+    it('sets the authorUsername, milestoneTitle and labelName', () => {
+      const authorUsername = 'root';
+      const labelName = ['my label', 'yet another label'];
+      const milestoneTitle = 'my milestone';
+      mutations[types.SET_FILTERS](state, { authorUsername, labelName, milestoneTitle });
+
+      expect(state.authorUsername).toBe(authorUsername);
+      expect(state.labelName).toBe(labelName);
+      expect(state.milestoneTitle).toBe(milestoneTitle);
     });
   });