Commit b4fc3612 authored by Brandon Labuschagne's avatar Brandon Labuschagne Committed by Natalia Tepluhina

Migrate cycle analytics daterange

The GlDaterangePicker has been replaced with the shared analytics
Daterange component.

The next iteration will be to apply a 6 month max limit on the
component.
parent 45d440d0
<script> <script>
import { GlEmptyState, GlDaterangePicker, GlLoadingIcon } from '@gitlab/ui'; import { GlEmptyState, GlLoadingIcon } from '@gitlab/ui';
import { mapActions, mapState, mapGetters } from 'vuex'; import { mapActions, mapState, mapGetters } from 'vuex';
import { getDateInPast } from '~/lib/utils/datetime_utility'; import { getDateInPast } from '~/lib/utils/datetime_utility';
import { featureAccessLevel } from '~/pages/projects/shared/permissions/constants'; import { featureAccessLevel } from '~/pages/projects/shared/permissions/constants';
...@@ -9,6 +9,7 @@ import GroupsDropdownFilter from '../../shared/components/groups_dropdown_filter ...@@ -9,6 +9,7 @@ import GroupsDropdownFilter from '../../shared/components/groups_dropdown_filter
import ProjectsDropdownFilter from '../../shared/components/projects_dropdown_filter.vue'; import ProjectsDropdownFilter from '../../shared/components/projects_dropdown_filter.vue';
import Scatterplot from '../../shared/components/scatterplot.vue'; import Scatterplot from '../../shared/components/scatterplot.vue';
import { LAST_ACTIVITY_AT, dateFormats } from '../../shared/constants'; import { LAST_ACTIVITY_AT, dateFormats } from '../../shared/constants';
import DateRange from '../../shared/components/daterange.vue';
import StageDropdownFilter from './stage_dropdown_filter.vue'; import StageDropdownFilter from './stage_dropdown_filter.vue';
import SummaryTable from './summary_table.vue'; import SummaryTable from './summary_table.vue';
import StageTable from './stage_table.vue'; import StageTable from './stage_table.vue';
...@@ -17,13 +18,13 @@ import TasksByTypeChart from './tasks_by_type_chart.vue'; ...@@ -17,13 +18,13 @@ import TasksByTypeChart from './tasks_by_type_chart.vue';
export default { export default {
name: 'CycleAnalytics', name: 'CycleAnalytics',
components: { components: {
DateRange,
GlLoadingIcon, GlLoadingIcon,
GlEmptyState, GlEmptyState,
GroupsDropdownFilter, GroupsDropdownFilter,
ProjectsDropdownFilter, ProjectsDropdownFilter,
SummaryTable, SummaryTable,
StageTable, StageTable,
GlDaterangePicker,
StageDropdownFilter, StageDropdownFilter,
Scatterplot, Scatterplot,
TasksByTypeChart, TasksByTypeChart,
...@@ -89,18 +90,6 @@ export default { ...@@ -89,18 +90,6 @@ export default {
shouldDisplayTasksByTypeChart() { shouldDisplayTasksByTypeChart() {
return !this.isLoading && !this.isLoadingTasksByTypeChart; return !this.isLoading && !this.isLoadingTasksByTypeChart;
}, },
dateRange: {
get() {
return { startDate: this.startDate, endDate: this.endDate };
},
set({ startDate, endDate }) {
this.setDateRange({
startDate,
endDate,
});
},
},
hasDateRangeSet() { hasDateRangeSet() {
return this.startDate && this.endDate; return this.startDate && this.endDate;
}, },
...@@ -227,14 +216,11 @@ export default { ...@@ -227,14 +216,11 @@ export default {
v-if="shouldDisplayFilters" v-if="shouldDisplayFilters"
class="ml-0 ml-md-auto mt-2 mt-md-0 d-flex flex-column flex-md-row align-items-md-center justify-content-md-end" class="ml-0 ml-md-auto mt-2 mt-md-0 d-flex flex-column flex-md-row align-items-md-center justify-content-md-end"
> >
<gl-daterange-picker <date-range
v-model="dateRange" :start-date="startDate"
class="d-flex flex-column flex-lg-row js-daterange-picker" :end-date="endDate"
:default-start-date="startDate" class="js-daterange-picker"
:default-end-date="endDate" @change="setDateRange"
start-picker-class="d-flex flex-column flex-lg-row align-items-lg-center mr-lg-2"
end-picker-class="d-flex flex-column flex-lg-row align-items-lg-center"
theme="animate-picker"
/> />
</div> </div>
</div> </div>
......
...@@ -3,7 +3,7 @@ import Vuex from 'vuex'; ...@@ -3,7 +3,7 @@ import Vuex from 'vuex';
import Vue from 'vue'; import Vue from 'vue';
import store from 'ee/analytics/cycle_analytics/store'; import store from 'ee/analytics/cycle_analytics/store';
import Component from 'ee/analytics/cycle_analytics/components/base.vue'; import Component from 'ee/analytics/cycle_analytics/components/base.vue';
import { GlEmptyState, GlDaterangePicker } from '@gitlab/ui'; import { GlEmptyState } from '@gitlab/ui';
import axios from 'axios'; import axios from 'axios';
import MockAdapter from 'axios-mock-adapter'; import MockAdapter from 'axios-mock-adapter';
import GroupsDropdownFilter from 'ee/analytics/shared/components/groups_dropdown_filter.vue'; import GroupsDropdownFilter from 'ee/analytics/shared/components/groups_dropdown_filter.vue';
...@@ -13,6 +13,7 @@ import StageTable from 'ee/analytics/cycle_analytics/components/stage_table.vue' ...@@ -13,6 +13,7 @@ import StageTable from 'ee/analytics/cycle_analytics/components/stage_table.vue'
import 'bootstrap'; import 'bootstrap';
import '~/gl_dropdown'; import '~/gl_dropdown';
import Scatterplot from 'ee/analytics/shared/components/scatterplot.vue'; import Scatterplot from 'ee/analytics/shared/components/scatterplot.vue';
import Daterange from 'ee/analytics/shared/components/daterange.vue';
import waitForPromises from 'helpers/wait_for_promises'; import waitForPromises from 'helpers/wait_for_promises';
import httpStatusCodes from '~/lib/utils/http_status'; import httpStatusCodes from '~/lib/utils/http_status';
import * as mockData from '../mock_data'; import * as mockData from '../mock_data';
...@@ -89,7 +90,7 @@ describe('Cycle Analytics component', () => { ...@@ -89,7 +90,7 @@ describe('Cycle Analytics component', () => {
}; };
const displaysDateRangePicker = flag => { const displaysDateRangePicker = flag => {
expect(wrapper.find(GlDaterangePicker).exists()).toBe(flag); expect(wrapper.find(Daterange).exists()).toBe(flag);
}; };
const displaysSummaryTable = flag => { const displaysSummaryTable = flag => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment