Add latest changes from gitlab-org/gitlab@master

6 files changed, 75 insertions, 2 deletions

diff --git a/app/assets/javascripts/operation_settings/components/form_group/dashboard_timezone.vue b/app/assets/javascripts/operation_settings/components/form_group/dashboard_timezone.vue
new file mode 100644
index 00000000000..42c9d876595
--- /dev/null
+++ b/app/assets/javascripts/operation_settings/components/form_group/dashboard_timezone.vue
@@ -0,0 +1,60 @@
+<script>
+import { s__ } from '~/locale';
+import { mapState, mapActions } from 'vuex';
+import { GlFormGroup, GlFormSelect } from '@gitlab/ui';
+import { timezones } from '~/monitoring/format_date';
+
+export default {
+  components: {
+    GlFormGroup,
+    GlFormSelect,
+  },
+  computed: {
+    ...mapState(['dashboardTimezone']),
+    dashboardTimezoneModel: {
+      get() {
+        return this.dashboardTimezone.selected;
+      },
+      set(selected) {
+        this.setDashboardTimezone(selected);
+      },
+    },
+    options() {
+      return [
+        {
+          value: timezones.LOCAL,
+          text: s__("MetricsSettings|User's local timezone"),
+        },
+        {
+          value: timezones.UTC,
+          text: s__('MetricsSettings|UTC (Coordinated Universal Time)'),
+        },
+      ];
+    },
+  },
+  methods: {
+    ...mapActions(['setDashboardTimezone']),
+  },
+};
+</script>
+
+<template>
+  <gl-form-group
+    :label="s__('MetricsSettings|Dashboard timezone')"
+    label-for="dashboard-timezone-setting"
+  >
+    <template #description>
+      {{
+        s__(
+          "MetricsSettings|Choose whether to display dashboard metrics in UTC or the user's local timezone.",
+        )
+      }}
+    </template>
+
+    <gl-form-select
+      id="dashboard-timezone-setting"
+      v-model="dashboardTimezoneModel"
+      :options="options"
+    />
+  </gl-form-group>
+</template>
diff --git a/app/assets/javascripts/operation_settings/components/metrics_settings.vue b/app/assets/javascripts/operation_settings/components/metrics_settings.vue
index ebf486162fc..77c356e5a7f 100644
--- a/app/assets/javascripts/operation_settings/components/metrics_settings.vue
+++ b/app/assets/javascripts/operation_settings/components/metrics_settings.vue
@@ -2,12 +2,14 @@
 import { mapState, mapActions } from 'vuex';
 import { GlDeprecatedButton, GlLink } from '@gitlab/ui';
 import ExternalDashboard from './form_group/external_dashboard.vue';
+import DashboardTimezone from './form_group/dashboard_timezone.vue';
 
 export default {
   components: {
     GlDeprecatedButton,
     GlLink,
     ExternalDashboard,
+    DashboardTimezone,
   },
   computed: {
     ...mapState(['helpPage']),
@@ -40,6 +42,7 @@ export default {
     </div>
     <div class="settings-content">
       <form>
+        <dashboard-timezone />
         <external-dashboard />
         <gl-deprecated-button variant="success" @click="saveChanges">
           {{ __('Save Changes') }}
diff --git a/app/assets/javascripts/operation_settings/store/actions.js b/app/assets/javascripts/operation_settings/store/actions.js
index 62d00ac50e3..122acb6bdcf 100644
--- a/app/assets/javascripts/operation_settings/store/actions.js
+++ b/app/assets/javascripts/operation_settings/store/actions.js
@@ -7,11 +7,15 @@ import * as mutationTypes from './mutation_types';
 export const setExternalDashboardUrl = ({ commit }, url) =>
   commit(mutationTypes.SET_EXTERNAL_DASHBOARD_URL, url);
 
+export const setDashboardTimezone = ({ commit }, selected) =>
+  commit(mutationTypes.SET_DASHBOARD_TIMEZONE, selected);
+
 export const saveChanges = ({ state, dispatch }) =>
   axios
     .patch(state.operationsSettingsEndpoint, {
       project: {
         metrics_setting_attributes: {
+          dashboard_timezone: state.dashboardTimezone.selected,
           external_dashboard_url: state.externalDashboard.url,
         },
       },
diff --git a/app/assets/javascripts/operation_settings/store/mutation_types.js b/app/assets/javascripts/operation_settings/store/mutation_types.js
index 237d2b6122f..92543fd7f03 100644
--- a/app/assets/javascripts/operation_settings/store/mutation_types.js
+++ b/app/assets/javascripts/operation_settings/store/mutation_types.js
@@ -1,3 +1,2 @@
-/* eslint-disable import/prefer-default-export */
-
 export const SET_EXTERNAL_DASHBOARD_URL = 'SET_EXTERNAL_DASHBOARD_URL';
+export const SET_DASHBOARD_TIMEZONE = 'SET_DASHBOARD_TIMEZONE';
diff --git a/app/assets/javascripts/operation_settings/store/mutations.js b/app/assets/javascripts/operation_settings/store/mutations.js
index eb495839616..f55717f6c98 100644
--- a/app/assets/javascripts/operation_settings/store/mutations.js
+++ b/app/assets/javascripts/operation_settings/store/mutations.js
@@ -4,4 +4,7 @@ export default {
   [types.SET_EXTERNAL_DASHBOARD_URL](state, url) {
     state.externalDashboard.url = url;
   },
+  [types.SET_DASHBOARD_TIMEZONE](state, selected) {
+    state.dashboardTimezone.selected = selected;
+  },
 };
diff --git a/app/assets/javascripts/operation_settings/store/state.js b/app/assets/javascripts/operation_settings/store/state.js
index 5376f6b32e6..07e3095f4e9 100644
--- a/app/assets/javascripts/operation_settings/store/state.js
+++ b/app/assets/javascripts/operation_settings/store/state.js
@@ -5,4 +5,8 @@ export default (initialState = {}) => ({
     url: initialState.externalDashboardUrl,
     helpPage: initialState.externalDashboardHelpPage,
   },
+  dashboardTimezone: {
+    selected: initialState.dashboardTimezoneSetting,
+    helpPage: initialState.dashboardTimezoneHelpPage,
+  },
 });