Commit ddd3997d authored by Miguel Rincon's avatar Miguel Rincon

Merge branch 'astoicescu/allowOotbDashboardsToBeCloned' into 'master'

Allow all out of the box dashboards to be cloned (frontend)

See merge request gitlab-org/gitlab!36433
parents 1c74698e f3b93e3f
...@@ -129,8 +129,8 @@ export default { ...@@ -129,8 +129,8 @@ export default {
'operationsSettingsPath', 'operationsSettingsPath',
]), ]),
...mapGetters('monitoringDashboard', ['selectedDashboard', 'filteredEnvironments']), ...mapGetters('monitoringDashboard', ['selectedDashboard', 'filteredEnvironments']),
isSystemDashboard() { isOutOfTheBoxDashboard() {
return this.selectedDashboard?.system_dashboard; return this.selectedDashboard?.out_of_the_box_dashboard;
}, },
shouldShowEnvironmentsDropdownNoMatchedMsg() { shouldShowEnvironmentsDropdownNoMatchedMsg() {
return !this.environmentsLoading && this.filteredEnvironments.length === 0; return !this.environmentsLoading && this.filteredEnvironments.length === 0;
...@@ -417,7 +417,7 @@ export default { ...@@ -417,7 +417,7 @@ export default {
:project-path="projectPath" :project-path="projectPath"
/> />
<template v-if="isSystemDashboard"> <template v-if="isOutOfTheBoxDashboard">
<gl-new-dropdown-divider /> <gl-new-dropdown-divider />
<gl-new-dropdown-item <gl-new-dropdown-item
ref="duplicateDashboardItem" ref="duplicateDashboardItem"
......
...@@ -44,8 +44,8 @@ export default { ...@@ -44,8 +44,8 @@ export default {
computed: { computed: {
...mapState('monitoringDashboard', ['allDashboards']), ...mapState('monitoringDashboard', ['allDashboards']),
...mapGetters('monitoringDashboard', ['selectedDashboard']), ...mapGetters('monitoringDashboard', ['selectedDashboard']),
isSystemDashboard() { isOutOfTheBoxDashboard() {
return this.selectedDashboard?.system_dashboard; return this.selectedDashboard?.out_of_the_box_dashboard;
}, },
selectedDashboardText() { selectedDashboardText() {
return this.selectedDashboard?.display_name; return this.selectedDashboard?.display_name;
...@@ -139,7 +139,7 @@ export default { ...@@ -139,7 +139,7 @@ export default {
This Duplicate Dashboard item will be removed from the dashboards dropdown This Duplicate Dashboard item will be removed from the dashboards dropdown
in https://gitlab.com/gitlab-org/gitlab/-/issues/223223 in https://gitlab.com/gitlab-org/gitlab/-/issues/223223
--> -->
<template v-if="isSystemDashboard"> <template v-if="isOutOfTheBoxDashboard">
<gl-dropdown-divider /> <gl-dropdown-divider />
<gl-dropdown-item v-gl-modal="modalId" data-testid="duplicateDashboardItem"> <gl-dropdown-item v-gl-modal="modalId" data-testid="duplicateDashboardItem">
......
---
title: Allow self monitoring dashboard to be duplicated
merge_request: 36433
author:
type: fixed
...@@ -4,7 +4,11 @@ import DashboardHeader from '~/monitoring/components/dashboard_header.vue'; ...@@ -4,7 +4,11 @@ import DashboardHeader from '~/monitoring/components/dashboard_header.vue';
import DuplicateDashboardModal from '~/monitoring/components/duplicate_dashboard_modal.vue'; import DuplicateDashboardModal from '~/monitoring/components/duplicate_dashboard_modal.vue';
import CreateDashboardModal from '~/monitoring/components/create_dashboard_modal.vue'; import CreateDashboardModal from '~/monitoring/components/create_dashboard_modal.vue';
import { setupAllDashboards } from '../store_utils'; import { setupAllDashboards } from '../store_utils';
import { dashboardGitResponse, dashboardHeaderProps } from '../mock_data'; import {
dashboardGitResponse,
selfMonitoringDashboardGitResponse,
dashboardHeaderProps,
} from '../mock_data';
import { redirectTo, mergeUrlParams } from '~/lib/utils/url_utility'; import { redirectTo, mergeUrlParams } from '~/lib/utils/url_utility';
jest.mock('~/lib/utils/url_utility', () => ({ jest.mock('~/lib/utils/url_utility', () => ({
...@@ -95,28 +99,47 @@ describe('Dashboard header', () => { ...@@ -95,28 +99,47 @@ describe('Dashboard header', () => {
}); });
}); });
describe('when the selected dashboard is the system dashboard', () => { const duplicableCases = [
null, // When no path is specified, it uses the default dashboard path.
dashboardGitResponse[0].path,
dashboardGitResponse[2].path,
selfMonitoringDashboardGitResponse[0].path,
];
describe.each(duplicableCases)(
'when the selected dashboard can be duplicated',
dashboardPath => {
it('contains a "Create New" menu item and a "Duplicate Dashboard" menu item', () => { it('contains a "Create New" menu item and a "Duplicate Dashboard" menu item', () => {
store.state.monitoringDashboard.projectPath = 'https://path/to/project'; store.state.monitoringDashboard.projectPath = 'https://path/to/project';
setupAllDashboards(store); setupAllDashboards(store, dashboardPath);
return wrapper.vm.$nextTick().then(() => { return wrapper.vm.$nextTick().then(() => {
expect(findCreateDashboardMenuItem().exists()).toBe(true); expect(findCreateDashboardMenuItem().exists()).toBe(true);
expect(findCreateDashboardDuplicateItem().exists()).toBe(true); expect(findCreateDashboardDuplicateItem().exists()).toBe(true);
}); });
}); });
}); },
);
describe('when the selected dashboard is not the system dashboard', () => { const nonDuplicableCases = [
dashboardGitResponse[1].path,
selfMonitoringDashboardGitResponse[1].path,
];
describe.each(nonDuplicableCases)(
'when the selected dashboard cannot be duplicated',
dashboardPath => {
it('contains a "Create New" menu item and no "Duplicate Dashboard" menu item', () => { it('contains a "Create New" menu item and no "Duplicate Dashboard" menu item', () => {
store.state.monitoringDashboard.projectPath = 'https://path/to/project'; store.state.monitoringDashboard.projectPath = 'https://path/to/project';
setupAllDashboards(store, dashboardPath);
return wrapper.vm.$nextTick().then(() => { return wrapper.vm.$nextTick().then(() => {
expect(findCreateDashboardMenuItem().exists()).toBe(true); expect(findCreateDashboardMenuItem().exists()).toBe(true);
expect(findCreateDashboardDuplicateItem().exists()).toBe(false); expect(findCreateDashboardDuplicateItem().exists()).toBe(false);
}); });
}); });
}); },
);
}); });
describe('actions menu modals', () => { describe('actions menu modals', () => {
......
...@@ -3,7 +3,7 @@ import { GlDropdownItem, GlIcon } from '@gitlab/ui'; ...@@ -3,7 +3,7 @@ import { GlDropdownItem, GlIcon } from '@gitlab/ui';
import DashboardsDropdown from '~/monitoring/components/dashboards_dropdown.vue'; import DashboardsDropdown from '~/monitoring/components/dashboards_dropdown.vue';
import { dashboardGitResponse } from '../mock_data'; import { dashboardGitResponse, selfMonitoringDashboardGitResponse } from '../mock_data';
const defaultBranch = 'master'; const defaultBranch = 'master';
const modalId = 'duplicateDashboardModalId'; const modalId = 'duplicateDashboardModalId';
...@@ -150,12 +150,18 @@ describe('DashboardsDropdown', () => { ...@@ -150,12 +150,18 @@ describe('DashboardsDropdown', () => {
}); });
}); });
describe('when the selected dashboard can be duplicated', () => { const duplicableCases = [
dashboardGitResponse[0],
dashboardGitResponse[2],
selfMonitoringDashboardGitResponse[0],
];
describe.each(duplicableCases)('when the selected dashboard can be duplicated', dashboard => {
let duplicateDashboardAction; let duplicateDashboardAction;
let modalDirective; let modalDirective;
beforeEach(() => { beforeEach(() => {
[mockSelectedDashboard] = dashboardGitResponse; mockSelectedDashboard = dashboard;
modalDirective = jest.fn(); modalDirective = jest.fn();
duplicateDashboardAction = jest.fn().mockResolvedValue(); duplicateDashboardAction = jest.fn().mockResolvedValue();
...@@ -205,9 +211,13 @@ describe('DashboardsDropdown', () => { ...@@ -205,9 +211,13 @@ describe('DashboardsDropdown', () => {
}); });
}); });
describe('when the selected dashboard can not be duplicated', () => { const nonDuplicableCases = [dashboardGitResponse[1], selfMonitoringDashboardGitResponse[1]];
describe.each(nonDuplicableCases)(
'when the selected dashboard can not be duplicated',
dashboard => {
beforeEach(() => { beforeEach(() => {
[, mockSelectedDashboard] = dashboardGitResponse; mockSelectedDashboard = dashboard;
wrapper = createComponent(); wrapper = createComponent();
}); });
...@@ -218,7 +228,8 @@ describe('DashboardsDropdown', () => { ...@@ -218,7 +228,8 @@ describe('DashboardsDropdown', () => {
expect(findItems()).toHaveLength(dashboardGitResponse.length); expect(findItems()).toHaveLength(dashboardGitResponse.length);
expect(item.length).toBe(0); expect(item.length).toBe(0);
}); });
}); },
);
describe('when a dashboard gets selected by the user', () => { describe('when a dashboard gets selected by the user', () => {
beforeEach(() => { beforeEach(() => {
......
...@@ -12,6 +12,7 @@ const customDashboardsData = new Array(30).fill(null).map((_, idx) => ({ ...@@ -12,6 +12,7 @@ const customDashboardsData = new Array(30).fill(null).map((_, idx) => ({
display_name: `Custom Dashboard ${idx}`, display_name: `Custom Dashboard ${idx}`,
can_edit: true, can_edit: true,
system_dashboard: false, system_dashboard: false,
out_of_the_box_dashboard: false,
project_blob_path: `${mockProjectDir}/blob/master/dashboards/.gitlab/dashboards/dashboard_${idx}.yml`, project_blob_path: `${mockProjectDir}/blob/master/dashboards/.gitlab/dashboards/dashboard_${idx}.yml`,
path: `.gitlab/dashboards/dashboard_${idx}.yml`, path: `.gitlab/dashboards/dashboard_${idx}.yml`,
starred: false, starred: false,
...@@ -302,6 +303,7 @@ export const dashboardGitResponse = [ ...@@ -302,6 +303,7 @@ export const dashboardGitResponse = [
display_name: 'Default', display_name: 'Default',
can_edit: false, can_edit: false,
system_dashboard: true, system_dashboard: true,
out_of_the_box_dashboard: true,
project_blob_path: null, project_blob_path: null,
path: 'config/prometheus/common_metrics.yml', path: 'config/prometheus/common_metrics.yml',
starred: false, starred: false,
...@@ -312,6 +314,44 @@ export const dashboardGitResponse = [ ...@@ -312,6 +314,44 @@ export const dashboardGitResponse = [
display_name: 'dashboard.yml', display_name: 'dashboard.yml',
can_edit: true, can_edit: true,
system_dashboard: false, system_dashboard: false,
out_of_the_box_dashboard: false,
project_blob_path: `${mockProjectDir}/-/blob/master/.gitlab/dashboards/dashboard.yml`,
path: '.gitlab/dashboards/dashboard.yml',
starred: true,
user_starred_path: `${mockProjectDir}/metrics_user_starred_dashboards?dashboard_path=.gitlab/dashboards/dashboard.yml`,
},
{
default: false,
display_name: 'Pod Health',
can_edit: false,
system_dashboard: false,
out_of_the_box_dashboard: true,
project_blob_path: null,
path: 'config/prometheus/pod_metrics.yml',
starred: false,
user_starred_path: `${mockProjectDir}/metrics_user_starred_dashboards?dashboard_path=config/prometheus/pod_metrics.yml`,
},
...customDashboardsData,
];
export const selfMonitoringDashboardGitResponse = [
{
default: true,
display_name: 'Default',
can_edit: false,
system_dashboard: false,
out_of_the_box_dashboard: true,
project_blob_path: null,
path: 'config/prometheus/self_monitoring_default.yml',
starred: false,
user_starred_path: `${mockProjectDir}/metrics_user_starred_dashboards?dashboard_path=config/prometheus/self_monitoring_default.yml`,
},
{
default: false,
display_name: 'dashboard.yml',
can_edit: true,
system_dashboard: false,
out_of_the_box_dashboard: false,
project_blob_path: `${mockProjectDir}/-/blob/master/.gitlab/dashboards/dashboard.yml`, project_blob_path: `${mockProjectDir}/-/blob/master/.gitlab/dashboards/dashboard.yml`,
path: '.gitlab/dashboards/dashboard.yml', path: '.gitlab/dashboards/dashboard.yml',
starred: true, starred: true,
......
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