diff --git a/app/assets/javascripts/logs/components/environment_logs.vue b/app/assets/javascripts/logs/components/environment_logs.vue index b0acd69bae0923c7c276c62a1143ec45fc38527c..68ec2bc2f16c4deafe2448049414944b43af2729 100644 --- a/app/assets/javascripts/logs/components/environment_logs.vue +++ b/app/assets/javascripts/logs/components/environment_logs.vue @@ -13,7 +13,7 @@ import { import DateTimePicker from '~/vue_shared/components/date_time_picker/date_time_picker.vue'; import LogControlButtons from './log_control_buttons.vue'; -import { timeRanges, defaultTimeRange } from '~/monitoring/constants'; +import { timeRanges, defaultTimeRange } from '~/vue_shared/constants'; import { timeRangeFromUrl } from '~/monitoring/utils'; import { formatDate } from '../utils'; diff --git a/app/assets/javascripts/logs/stores/state.js b/app/assets/javascripts/logs/stores/state.js index e058f15b6b464ceb58692bd141d99ab1e98c3506..2c8f47294cc8f936066f4601be442c102fc6c937 100644 --- a/app/assets/javascripts/logs/stores/state.js +++ b/app/assets/javascripts/logs/stores/state.js @@ -1,4 +1,4 @@ -import { timeRanges, defaultTimeRange } from '~/monitoring/constants'; +import { timeRanges, defaultTimeRange } from '~/vue_shared/constants'; import { convertToFixedRange } from '~/lib/utils/datetime_range'; export default () => ({ diff --git a/app/assets/javascripts/monitoring/components/dashboard.vue b/app/assets/javascripts/monitoring/components/dashboard.vue index a0bd45bef5e135faaa2e7d18382acd0191df74d9..dbfb3e97c20309d5bdd8958eee770fa9831dde4d 100644 --- a/app/assets/javascripts/monitoring/components/dashboard.vue +++ b/app/assets/javascripts/monitoring/components/dashboard.vue @@ -31,7 +31,8 @@ import DashboardsDropdown from './dashboards_dropdown.vue'; import TrackEventDirective from '~/vue_shared/directives/track_event'; import { getAddMetricTrackingOptions, timeRangeToUrl, timeRangeFromUrl } from '../utils'; -import { defaultTimeRange, timeRanges, metricStates } from '../constants'; +import { metricStates } from '../constants'; +import { defaultTimeRange, timeRanges } from '~/vue_shared/constants'; export default { components: { diff --git a/app/assets/javascripts/monitoring/components/embed.vue b/app/assets/javascripts/monitoring/components/embed.vue index 826b73908a45870773aea28dc91350fd257a715f..6182b570e762ef9106e1a06cf1414ec8f32b1bab 100644 --- a/app/assets/javascripts/monitoring/components/embed.vue +++ b/app/assets/javascripts/monitoring/components/embed.vue @@ -3,7 +3,8 @@ import { mapActions, mapState, mapGetters } from 'vuex'; import PanelType from 'ee_else_ce/monitoring/components/panel_type.vue'; import { convertToFixedRange } from '~/lib/utils/datetime_range'; import { timeRangeFromUrl, removeTimeRangeParams } from '../utils'; -import { sidebarAnimationDuration, defaultTimeRange } from '../constants'; +import { sidebarAnimationDuration } from '../constants'; +import { defaultTimeRange } from '~/vue_shared/constants'; let sidebarMutationObserver; diff --git a/app/assets/javascripts/monitoring/constants.js b/app/assets/javascripts/monitoring/constants.js index ddf6c9878df0d292e5dc08814a6cd0783630416f..cc7f5af22594aea641e26531a2529198f8e7f44e 100644 --- a/app/assets/javascripts/monitoring/constants.js +++ b/app/assets/javascripts/monitoring/constants.js @@ -1,5 +1,3 @@ -import { __ } from '~/locale'; - export const PROMETHEUS_TIMEOUT = 120000; // TWO_MINUTES /** @@ -89,37 +87,3 @@ export const dateFormats = { timeOfDay: 'h:MM TT', default: 'dd mmm yyyy, h:MMTT', }; - -export const timeRanges = [ - { - label: __('30 minutes'), - duration: { seconds: 60 * 30 }, - }, - { - label: __('3 hours'), - duration: { seconds: 60 * 60 * 3 }, - }, - { - label: __('8 hours'), - duration: { seconds: 60 * 60 * 8 }, - default: true, - }, - { - label: __('1 day'), - duration: { seconds: 60 * 60 * 24 * 1 }, - }, - { - label: __('3 days'), - duration: { seconds: 60 * 60 * 24 * 3 }, - }, - { - label: __('1 week'), - duration: { seconds: 60 * 60 * 24 * 7 * 1 }, - }, - { - label: __('1 month'), - duration: { seconds: 60 * 60 * 24 * 30 }, - }, -]; - -export const defaultTimeRange = timeRanges.find(tr => tr.default); diff --git a/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue b/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue index 9ac687f5e2c690cc6275438367f69be3604c6b98..7b09337eb153ba9f2b61b8cf6352dcf224f58b52 100644 --- a/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue +++ b/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue @@ -43,6 +43,11 @@ export default { required: false, default: () => defaultTimeRanges, }, + customEnabled: { + type: Boolean, + required: false, + default: true, + }, }, data() { return { @@ -166,6 +171,7 @@ export default { > <div class="d-flex justify-content-between gl-p-2"> <gl-form-group + v-if="customEnabled" :label="__('Custom range')" label-for="custom-from-time" label-class="gl-pb-1" diff --git a/app/assets/javascripts/vue_shared/constants.js b/app/assets/javascripts/vue_shared/constants.js new file mode 100644 index 0000000000000000000000000000000000000000..63ce421271768dfc3788e6d14f1e65badbcca1f6 --- /dev/null +++ b/app/assets/javascripts/vue_shared/constants.js @@ -0,0 +1,56 @@ +import { __ } from '~/locale'; + +const INTERVALS = { + minute: 'minute', + hour: 'hour', + day: 'day', +}; + +export const timeRanges = [ + { + label: __('30 minutes'), + duration: { seconds: 60 * 30 }, + name: 'thirtyMinutes', + interval: INTERVALS.minute, + }, + { + label: __('3 hours'), + duration: { seconds: 60 * 60 * 3 }, + name: 'threeHours', + interval: INTERVALS.hour, + }, + { + label: __('8 hours'), + duration: { seconds: 60 * 60 * 8 }, + name: 'eightHours', + default: true, + interval: INTERVALS.hour, + }, + { + label: __('1 day'), + duration: { seconds: 60 * 60 * 24 * 1 }, + name: 'oneDay', + interval: INTERVALS.hour, + }, + { + label: __('3 days'), + duration: { seconds: 60 * 60 * 24 * 3 }, + name: 'threeDays', + interval: INTERVALS.hour, + }, + { + label: __('1 week'), + duration: { seconds: 60 * 60 * 24 * 7 * 1 }, + name: 'oneWeek', + interval: INTERVALS.day, + }, + { + label: __('1 month'), + duration: { seconds: 60 * 60 * 24 * 30 }, + name: 'oneMonth', + interval: INTERVALS.day, + }, +]; + +export const defaultTimeRange = timeRanges.find(tr => tr.default); +export const getTimeWindow = timeWindowName => timeRanges.find(tr => tr.name === timeWindowName); diff --git a/ee/app/assets/javascripts/threat_monitoring/components/threat_monitoring_filters.vue b/ee/app/assets/javascripts/threat_monitoring/components/threat_monitoring_filters.vue index 72dfb3b5ad4a92a6cb28126fa169a58ee1bc8680..096f0d7e921a2588bf6bd39223eb351f401358ae 100644 --- a/ee/app/assets/javascripts/threat_monitoring/components/threat_monitoring_filters.vue +++ b/ee/app/assets/javascripts/threat_monitoring/components/threat_monitoring_filters.vue @@ -1,7 +1,8 @@ <script> import { mapActions, mapGetters, mapState } from 'vuex'; import { GlFormGroup, GlDropdown, GlDropdownItem } from '@gitlab/ui'; -import { TIME_WINDOWS } from '../constants'; +import { timeRanges, defaultTimeRange } from '~/vue_shared/constants'; +import DateTimePicker from '~/vue_shared/components/date_time_picker/date_time_picker.vue'; export default { name: 'ThreatMonitoringFilters', @@ -9,6 +10,13 @@ export default { GlFormGroup, GlDropdown, GlDropdownItem, + DateTimePicker, + }, + data() { + return { + selectedTimeRange: defaultTimeRange, + timeRanges, + }; }, computed: { ...mapState('threatMonitoring', [ @@ -17,7 +25,7 @@ export default { 'isLoadingEnvironments', 'isLoadingWafStatistics', ]), - ...mapGetters('threatMonitoring', ['currentEnvironmentName', 'currentTimeWindowName']), + ...mapGetters('threatMonitoring', ['currentEnvironmentName']), isDisabled() { return ( this.isLoadingEnvironments || this.isLoadingWafStatistics || this.environments.length === 0 @@ -26,10 +34,12 @@ export default { }, methods: { ...mapActions('threatMonitoring', ['setCurrentEnvironmentId', 'setCurrentTimeWindow']), + onDateTimePickerInput(timeRange) { + this.selectedTimeRange = timeRange; + this.setCurrentTimeWindow(timeRange); + }, }, environmentFilterId: 'threat-monitoring-environment-filter', - showLastFilterId: 'threat-monitoring-show-last-filter', - timeWindows: TIME_WINDOWS, }; </script> @@ -63,25 +73,17 @@ export default { <gl-form-group :label="s__('ThreatMonitoring|Show last')" label-size="sm" - :label-for="$options.showLastFilterId" - class="col-sm-6 col-md-4 col-lg-3 col-xl-2" + label-for="threat-monitoring-time-window-dropdown" + class="col-sm-6 col-md-6 col-lg-4" > - <gl-dropdown - :id="$options.showLastFilterId" - ref="showLastDropdown" - class="mb-0 d-flex" - toggle-class="d-flex justify-content-between" - :text="currentTimeWindowName" + <date-time-picker + ref="dateTimePicker" + :custom-enabled="false" + :value="selectedTimeRange" + :options="timeRanges" :disabled="isDisabled" - > - <gl-dropdown-item - v-for="(timeWindowConfig, timeWindow) in $options.timeWindows" - :key="timeWindow" - ref="showLastDropdownItem" - @click="setCurrentTimeWindow(timeWindow)" - >{{ timeWindowConfig.name }}</gl-dropdown-item - > - </gl-dropdown> + @input="onDateTimePickerInput" + /> </gl-form-group> </div> </div> diff --git a/ee/app/assets/javascripts/threat_monitoring/constants.js b/ee/app/assets/javascripts/threat_monitoring/constants.js index a4a8b83c2fa5dc9063c99e4c025a641d1a28f245..4a71a445d5584c6d001cde0f5493ea63ba7e695f 100644 --- a/ee/app/assets/javascripts/threat_monitoring/constants.js +++ b/ee/app/assets/javascripts/threat_monitoring/constants.js @@ -1,39 +1,2 @@ -import { __ } from '~/locale'; - +/* eslint-disable import/prefer-default-export */ export const INVALID_CURRENT_ENVIRONMENT_NAME = '–'; - -const INTERVALS = { - minute: 'minute', - hour: 'hour', - day: 'day', -}; - -export const TIME_WINDOWS = { - thirtyMinutes: { - name: __('30 minutes'), - durationInMilliseconds: 30 * 60 * 1000, - interval: INTERVALS.minute, - }, - oneHour: { - name: __('1 hour'), - durationInMilliseconds: 60 * 60 * 1000, - interval: INTERVALS.minute, - }, - twentyFourHours: { - name: __('24 hours'), - durationInMilliseconds: 24 * 60 * 60 * 1000, - interval: INTERVALS.hour, - }, - sevenDays: { - name: __('7 days'), - durationInMilliseconds: 7 * 24 * 60 * 60 * 1000, - interval: INTERVALS.day, - }, - thirtyDays: { - name: __('30 days'), - durationInMilliseconds: 30 * 24 * 60 * 60 * 1000, - interval: INTERVALS.day, - }, -}; - -export const DEFAULT_TIME_WINDOW = 'thirtyDays'; diff --git a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/actions.js b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/actions.js index 470960771ba65bcd7211376cb12acc7a01f7f12f..46c24cb82fd9c2aeab2594d3336e8700fe78bb3c 100644 --- a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/actions.js +++ b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/actions.js @@ -64,7 +64,7 @@ export const setCurrentEnvironmentId = ({ commit, dispatch }, environmentId) => }; export const setCurrentTimeWindow = ({ commit, dispatch }, timeWindow) => { - commit(types.SET_CURRENT_TIME_WINDOW, timeWindow); + commit(types.SET_CURRENT_TIME_WINDOW, timeWindow.name); dispatch(`threatMonitoringWaf/fetchStatistics`, null, { root: true }); if (window.gon.features?.networkPolicyUi) { diff --git a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/getters.js b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/getters.js index 845e5b0593d67e9a57bdfefb9169f643e3228f1d..e22e25fcd5f00066ffa0f1c2004e9eeaf362133b 100644 --- a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/getters.js +++ b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/getters.js @@ -1,10 +1,7 @@ +/* eslint-disable import/prefer-default-export */ import { INVALID_CURRENT_ENVIRONMENT_NAME } from '../../../constants'; -import { getTimeWindowConfig } from '../../utils'; export const currentEnvironmentName = ({ currentEnvironmentId, environments }) => { const environment = environments.find(({ id }) => id === currentEnvironmentId); return environment ? environment.name : INVALID_CURRENT_ENVIRONMENT_NAME; }; - -export const currentTimeWindowName = ({ currentTimeWindow }) => - getTimeWindowConfig(currentTimeWindow).name; diff --git a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/state.js b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/state.js index c5b33253b8b5fc530e7448c1bd314e1132ba05ff..847a692b96cda6d0a4483c64d5a5573dc1a6b4d6 100644 --- a/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/state.js +++ b/ee/app/assets/javascripts/threat_monitoring/store/modules/threat_monitoring/state.js @@ -1,4 +1,4 @@ -import { DEFAULT_TIME_WINDOW } from '../../../constants'; +import { defaultTimeRange } from '~/vue_shared/constants'; export default () => ({ environmentsEndpoint: '', @@ -6,5 +6,5 @@ export default () => ({ isLoadingEnvironments: false, errorLoadingEnvironments: false, currentEnvironmentId: -1, - currentTimeWindow: DEFAULT_TIME_WINDOW, + currentTimeWindow: defaultTimeRange.name, }); diff --git a/ee/app/assets/javascripts/threat_monitoring/store/utils.js b/ee/app/assets/javascripts/threat_monitoring/store/utils.js index 49c65e319702ba015c771948d25e83057f6f45a5..9b6387460af2a6e4aabea5233e8e79c6f93b65bc 100644 --- a/ee/app/assets/javascripts/threat_monitoring/store/utils.js +++ b/ee/app/assets/javascripts/threat_monitoring/store/utils.js @@ -1,11 +1,17 @@ -import { TIME_WINDOWS, DEFAULT_TIME_WINDOW } from 'ee/threat_monitoring/constants'; +import { getTimeWindow, defaultTimeRange } from '~/vue_shared/constants'; +import { pick } from 'lodash'; -export const getTimeWindowConfig = timeWindow => - TIME_WINDOWS[timeWindow] || TIME_WINDOWS[DEFAULT_TIME_WINDOW]; +export const getTimeWindowConfig = timeWindow => { + const timeWindowObj = pick(getTimeWindow(timeWindow) || defaultTimeRange, 'duration', 'interval'); + return { + durationInMilliseconds: timeWindowObj.duration.seconds * 1000, + interval: timeWindowObj.interval, + }; +}; /** * Get the from/to/interval query parameters for the given time window. - * @param {string} timeWindow - The time window (keyof TIME_WINDOWS) + * @param {string} timeWindow - The time window name (from the array of objects timeRanges) * @param {number} to - Milliseconds past the epoch corresponding to the * returned `to` parameter * @returns {Object} Query parameters `from` and `to` are ISO 8601 dates and diff --git a/ee/changelogs/unreleased/extract_timerange_information_to_be_shared.yml b/ee/changelogs/unreleased/extract_timerange_information_to_be_shared.yml new file mode 100644 index 0000000000000000000000000000000000000000..710d09f9e3c2406243f391d4401723f72bc5db62 --- /dev/null +++ b/ee/changelogs/unreleased/extract_timerange_information_to_be_shared.yml @@ -0,0 +1,5 @@ +--- +title: Extract time range information to be reused +merge_request: 26431 +author: +type: changed diff --git a/ee/spec/frontend/threat_monitoring/components/threat_monitoring_filters_spec.js b/ee/spec/frontend/threat_monitoring/components/threat_monitoring_filters_spec.js index 59376853e06f8b10916e7bb439648d468f165038..d4f45034f218adba7691f0a750f9f3b2fe9e4f05 100644 --- a/ee/spec/frontend/threat_monitoring/components/threat_monitoring_filters_spec.js +++ b/ee/spec/frontend/threat_monitoring/components/threat_monitoring_filters_spec.js @@ -1,8 +1,10 @@ import { shallowMount } from '@vue/test-utils'; import createStore from 'ee/threat_monitoring/store'; import ThreatMonitoringFilters from 'ee/threat_monitoring/components/threat_monitoring_filters.vue'; -import { INVALID_CURRENT_ENVIRONMENT_NAME, TIME_WINDOWS } from 'ee/threat_monitoring/constants'; +import { INVALID_CURRENT_ENVIRONMENT_NAME } from 'ee/threat_monitoring/constants'; import { mockEnvironmentsResponse } from '../mock_data'; +import DateTimePicker from '~/vue_shared/components/date_time_picker/date_time_picker.vue'; +import { timeRanges, defaultTimeRange } from '~/vue_shared/constants'; const mockEnvironments = mockEnvironmentsResponse.environments; @@ -23,8 +25,7 @@ describe('ThreatMonitoringFilters component', () => { const findEnvironmentsDropdown = () => wrapper.find({ ref: 'environmentsDropdown' }); const findEnvironmentsDropdownItems = () => wrapper.findAll({ ref: 'environmentsDropdownItem' }); - const findShowLastDropdown = () => wrapper.find({ ref: 'showLastDropdown' }); - const findShowLastDropdownItems = () => wrapper.findAll({ ref: 'showLastDropdownItem' }); + const findShowLastDropdown = () => wrapper.find(DateTimePicker); afterEach(() => { wrapper.destroy(); @@ -92,22 +93,15 @@ describe('ThreatMonitoringFilters component', () => { }); it('has text set to the current time window name', () => { - const currentTimeWindowName = store.getters['threatMonitoring/currentTimeWindowName']; - expect(findShowLastDropdown().attributes().text).toBe(currentTimeWindowName); + expect(findShowLastDropdown().vm.value.label).toBe(defaultTimeRange.label); }); it('has dropdown items for each time window', () => { - const dropdownItems = findShowLastDropdownItems(); - - Object.entries(TIME_WINDOWS).forEach(([timeWindow, config], i) => { - const dropdownItem = dropdownItems.at(i); - expect(dropdownItem.text()).toBe(config.name); - - dropdownItem.vm.$emit('click'); - expect(store.dispatch).toHaveBeenCalledWith( - 'threatMonitoring/setCurrentTimeWindow', - timeWindow, - ); + const dropdownOptions = findShowLastDropdown().props('options'); + Object.entries(timeRanges).forEach(([index, timeWindow]) => { + const dropdownOption = dropdownOptions[index]; + expect(dropdownOption.interval).toBe(timeWindow.interval); + expect(dropdownOption.duration.seconds).toBe(timeWindow.duration.seconds); }); }); }); diff --git a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/actions_spec.js b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/actions_spec.js index af553e6e2b3ee97ff4067aee425a6a32189cf45c..65d4b04db8f9a0dd06ec9c45f267a4036aaa95bc 100644 --- a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/actions_spec.js +++ b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/actions_spec.js @@ -235,14 +235,14 @@ describe('Threat Monitoring actions', () => { }); describe('setCurrentTimeWindow', () => { - const timeWindow = 'foo'; + const timeWindow = { name: 'foo' }; it('commits the SET_CURRENT_TIME_WINDOW mutation and dispatches WAF fetch action', () => testAction( actions.setCurrentTimeWindow, timeWindow, state, - [{ type: types.SET_CURRENT_TIME_WINDOW, payload: timeWindow }], + [{ type: types.SET_CURRENT_TIME_WINDOW, payload: timeWindow.name }], [{ type: 'threatMonitoringWaf/fetchStatistics', payload: null }], )); @@ -254,7 +254,7 @@ describe('Threat Monitoring actions', () => { actions.setCurrentTimeWindow, timeWindow, state, - [{ type: types.SET_CURRENT_TIME_WINDOW, payload: timeWindow }], + [{ type: types.SET_CURRENT_TIME_WINDOW, payload: timeWindow.name }], [ { type: 'threatMonitoringWaf/fetchStatistics', payload: null }, { type: 'threatMonitoringNetworkPolicy/fetchStatistics', payload: null }, diff --git a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/getters_spec.js b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/getters_spec.js index fff3326cf7f5d6de44a6dca41d6f1cfbb325d188..adb88cc1d70d99a8a870fcac6a8c918a3059a188 100644 --- a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/getters_spec.js +++ b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring/getters_spec.js @@ -1,6 +1,6 @@ import createState from 'ee/threat_monitoring/store/modules/threat_monitoring/state'; import * as getters from 'ee/threat_monitoring/store/modules/threat_monitoring/getters'; -import { INVALID_CURRENT_ENVIRONMENT_NAME, TIME_WINDOWS } from 'ee/threat_monitoring/constants'; +import { INVALID_CURRENT_ENVIRONMENT_NAME } from 'ee/threat_monitoring/constants'; describe('threatMonitoring module getters', () => { let state; @@ -26,18 +26,4 @@ describe('threatMonitoring module getters', () => { }); }); }); - - describe('currentTimeWindowName', () => { - it('gives the correct name for a valid time window', () => { - Object.keys(TIME_WINDOWS).forEach(timeWindow => { - state.currentTimeWindow = timeWindow; - expect(getters.currentTimeWindowName(state)).toBe(TIME_WINDOWS[timeWindow].name); - }); - }); - - it('gives the default name for an invalid time window', () => { - state.currentTimeWindowName = 'foo'; - expect(getters.currentTimeWindowName(state)).toBe('30 days'); - }); - }); }); diff --git a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring_statistics/actions_spec.js b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring_statistics/actions_spec.js index 491dea4a7dd45fbd326e654e0310f1528e00bb84..8277e07a6ffc251cf39248ea59a320a02b4abf99 100644 --- a/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring_statistics/actions_spec.js +++ b/ee/spec/frontend/threat_monitoring/store/modules/threat_monitoring_statistics/actions_spec.js @@ -14,7 +14,7 @@ jest.mock('~/flash', () => jest.fn()); const statisticsEndpoint = 'statisticsEndpoint'; const timeRange = { - from: '2019-01-01T00:00:00.000Z', + from: '2019-01-30T16:00:00.000Z', to: '2019-01-31T00:00:00.000Z', }; @@ -101,7 +101,7 @@ describe('threatMonitoringStatistics actions', () => { .onGet(statisticsEndpoint, { params: { environment_id: currentEnvironmentId, - interval: 'day', + interval: 'hour', ...timeRange, }, }) diff --git a/ee/spec/frontend/threat_monitoring/store/utils_spec.js b/ee/spec/frontend/threat_monitoring/store/utils_spec.js index 67e6a9b14975f9f72f321161d6b47d8a8b16ee1a..353451e3766d95906e95eba19122cfc2685dea27 100644 --- a/ee/spec/frontend/threat_monitoring/store/utils_spec.js +++ b/ee/spec/frontend/threat_monitoring/store/utils_spec.js @@ -1,16 +1,22 @@ import { getTimeWindowConfig, getTimeWindowParams } from 'ee/threat_monitoring/store/utils'; -import { DEFAULT_TIME_WINDOW, TIME_WINDOWS } from 'ee/threat_monitoring/constants'; +import { defaultTimeRange, timeRanges } from '~/vue_shared/constants'; describe('threatMonitoring module utils', () => { describe('getTimeWindowConfig', () => { it('gives the correct config for a valid time window', () => { - Object.entries(TIME_WINDOWS).forEach(([timeWindow, expectedConfig]) => { - expect(getTimeWindowConfig(timeWindow)).toBe(expectedConfig); + Object.entries(timeRanges).forEach(([, timeWindow]) => { + const timeWindowConfig = getTimeWindowConfig(timeWindow.name); + expect(timeWindowConfig.interval).toBe(timeWindow.interval); + expect(timeWindowConfig.durationInMilliseconds).toBe(timeWindow.duration.seconds * 1000); }); }); it('gives the default name for an invalid time window', () => { - expect(getTimeWindowConfig('foo')).toBe(TIME_WINDOWS[DEFAULT_TIME_WINDOW]); + const timeWindowConfig = getTimeWindowConfig('foo'); + expect(timeWindowConfig.interval).toBe(defaultTimeRange.interval); + expect(timeWindowConfig.durationInMilliseconds).toBe( + defaultTimeRange.duration.seconds * 1000, + ); }); }); @@ -18,17 +24,19 @@ describe('threatMonitoring module utils', () => { const mockTimestamp = new Date(2020, 0, 1, 10).getTime(); it.each` - timeWindow | expectedFrom | interval - ${'thirtyMinutes'} | ${'2020-01-01T09:30:00.000Z'} | ${'minute'} - ${'oneHour'} | ${'2020-01-01T09:00:00.000Z'} | ${'minute'} - ${'twentyFourHours'} | ${'2019-12-31T10:00:00.000Z'} | ${'hour'} - ${'sevenDays'} | ${'2019-12-25T10:00:00.000Z'} | ${'day'} - ${'thirtyDays'} | ${'2019-12-02T10:00:00.000Z'} | ${'day'} - ${'foo'} | ${'2019-12-02T10:00:00.000Z'} | ${'day'} + timeWindowName | expectedFrom | interval + ${'thirtyMinutes'} | ${'2020-01-01T09:30:00.000Z'} | ${'minute'} + ${'threeHours'} | ${'2020-01-01T07:00:00.000Z'} | ${'hour'} + ${'eightHours'} | ${'2020-01-01T02:00:00.000Z'} | ${'hour'} + ${'oneDay'} | ${'2019-12-31T10:00:00.000Z'} | ${'hour'} + ${'threeDays'} | ${'2019-12-29T10:00:00.000Z'} | ${'hour'} + ${'oneWeek'} | ${'2019-12-25T10:00:00.000Z'} | ${'day'} + ${'oneMonth'} | ${'2019-12-02T10:00:00.000Z'} | ${'day'} + ${'foo'} | ${'2020-01-01T02:00:00.000Z'} | ${'hour'} `( - 'returns the expected params given "$timeWindow"', - ({ timeWindow, expectedFrom, interval }) => { - expect(getTimeWindowParams(timeWindow, mockTimestamp)).toEqual({ + 'returns the expected params given "$timeWindowName"', + ({ timeWindowName, expectedFrom, interval }) => { + expect(getTimeWindowParams(timeWindowName, mockTimestamp)).toEqual({ from: expectedFrom, to: '2020-01-01T10:00:00.000Z', interval, diff --git a/locale/gitlab.pot b/locale/gitlab.pot index c7ca9634e0ef48392639fcc99a4037efdc7fcd8d..56bb1b2e068dc11eb806071cbd1d73a939882106 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -708,9 +708,6 @@ msgstr "" msgid "20-29 contributions" msgstr "" -msgid "24 hours" -msgstr "" - msgid "2FA" msgstr "" @@ -723,9 +720,6 @@ msgstr "" msgid "3 hours" msgstr "" -msgid "30 days" -msgstr "" - msgid "30 minutes" msgstr "" @@ -747,9 +741,6 @@ msgstr "" msgid "404|Please contact your GitLab administrator if you think this is a mistake." msgstr "" -msgid "7 days" -msgstr "" - msgid "8 hours" msgstr "" diff --git a/spec/frontend/logs/stores/actions_spec.js b/spec/frontend/logs/stores/actions_spec.js index 1512797e1bc816d6d9feaf272201d8cffdc83806..cad2501c67cbc0da1c6b021d00a4b27bb970a104 100644 --- a/spec/frontend/logs/stores/actions_spec.js +++ b/spec/frontend/logs/stores/actions_spec.js @@ -13,7 +13,7 @@ import { fetchMoreLogsPrepend, } from '~/logs/stores/actions'; -import { defaultTimeRange } from '~/monitoring/constants'; +import { defaultTimeRange } from '~/vue_shared/constants'; import axios from '~/lib/utils/axios_utils'; import flash from '~/flash'; diff --git a/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap b/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap index 77f7f2e0609256d8797806aba8d17db7be17691e..e37043e5d4d437b287bb1d5a133d7bb488e57ccf 100644 --- a/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap +++ b/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap @@ -78,6 +78,7 @@ exports[`Dashboard template matches the default snapshot 1`] = ` label-size="sm" > <date-time-picker-stub + customenabled="true" options="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]" value="[object Object]" /> diff --git a/spec/frontend/monitoring/components/dashboard_url_time_spec.js b/spec/frontend/monitoring/components/dashboard_url_time_spec.js index 161c64dd74bfff2124bc0eb4e602961702e611b0..bf5a11a536e23d3d8ed783592d90e85d53ef21b0 100644 --- a/spec/frontend/monitoring/components/dashboard_url_time_spec.js +++ b/spec/frontend/monitoring/components/dashboard_url_time_spec.js @@ -7,7 +7,7 @@ import { mockProjectDir } from '../mock_data'; import Dashboard from '~/monitoring/components/dashboard.vue'; import { createStore } from '~/monitoring/stores'; -import { defaultTimeRange } from '~/monitoring/constants'; +import { defaultTimeRange } from '~/vue_shared/constants'; import { propsData } from '../init_utils'; jest.mock('~/flash');