Skip to content

G
gitlab-ce
Commit d2cc4ddb authored by Phil Hughes's avatar Phil Hughes
Browse files
Options

Merge branch '327647_01-geo-node-beta-new-edit-actions' into 'master' 

Geo Status Page 2.0 - Edit Actions

See merge request gitlab-org/gitlab!59686
parents 1ec8b0be 36bf7bf9
Hide whitespace changes
Inline Side-by-side
Showing with 57 additions and 30 deletions
ee/app/assets/javascripts/geo_nodes_beta/components/header/geo_node_actions.vue
View file @ d2cc4ddb
......@@ -9,10 +9,9 @@ export default {
GeoNodeActionsDesktop,
},
props: {
primary: {
type: Boolean,
required: false,
default: false,
node: {
type: Object,
required: true,
},
},
};
......@@ -20,7 +19,7 @@ export default {
<template>
<div>
<geo-node-actions-mobile class="gl-lg-display-none" :primary="primary" />
<geo-node-actions-desktop class="gl-display-none gl-lg-display-flex" :primary="primary" />
<geo-node-actions-mobile class="gl-lg-display-none" :node="node" />
<geo-node-actions-desktop class="gl-display-none gl-lg-display-flex" :node="node" />
</div>
</template>
ee/app/assets/javascripts/geo_nodes_beta/components/header/geo_node_actions_desktop.vue
View file @ d2cc4ddb
......@@ -12,10 +12,9 @@ export default {
GlButton,
},
props: {
primary: {
type: Boolean,
required: false,
default: false,
node: {
type: Object,
required: true,
},
},
};
......@@ -23,11 +22,13 @@ export default {
<template>
<div>
<gl-button class="gl-mr-3">{{ $options.i18n.editButtonLabel }}</gl-button>
<gl-button class="gl-mr-3" :href="node.webEditUrl">{{
$options.i18n.editButtonLabel
}}</gl-button>
<gl-button
variant="danger"
category="secondary"
:disabled="primary"
:disabled="node.primary"
data-testid="geo-desktop-remove-action"
>{{ $options.i18n.removeButtonLabel }}</gl-button
>
......
ee/app/assets/javascripts/geo_nodes_beta/components/header/geo_node_actions_mobile.vue
View file @ d2cc4ddb
......@@ -14,15 +14,14 @@ export default {
GlIcon,
},
props: {
primary: {
type: Boolean,
required: false,
default: false,
node: {
type: Object,
required: true,
},
},
computed: {
dropdownRemoveClass() {
return this.primary ? 'gl-text-gray-400' : 'gl-text-red-500';
return this.node.primary ? 'gl-text-gray-400' : 'gl-text-red-500';
},
},
};
......@@ -33,8 +32,8 @@ export default {
<template #button-content>
<gl-icon name="ellipsis_h" />
</template>
<gl-dropdown-item>{{ $options.i18n.editButtonLabel }}</gl-dropdown-item>
<gl-dropdown-item :disabled="primary" data-testid="geo-mobile-remove-action">
<gl-dropdown-item :href="node.webEditUrl">{{ $options.i18n.editButtonLabel }}</gl-dropdown-item>
<gl-dropdown-item :disabled="node.primary" data-testid="geo-mobile-remove-action">
<span :class="dropdownRemoveClass">{{ $options.i18n.removeButtonLabel }}</span>
</gl-dropdown-item>
</gl-dropdown>
......
ee/app/assets/javascripts/geo_nodes_beta/components/header/geo_node_header.vue
View file @ d2cc4ddb
......@@ -71,7 +71,7 @@ export default {
</div>
</div>
<div class="gl-display-flex gl-align-items-center gl-justify-content-end">
<geo-node-actions :primary="node.primary" />
<geo-node-actions :node="node" />
</div>
</div>
</template>
ee/spec/frontend/geo_nodes_beta/components/header/geo_node_actions_desktop_spec.js
View file @ d2cc4ddb
......@@ -2,7 +2,11 @@ import { GlButton } from '@gitlab/ui';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import Vuex from 'vuex';
import GeoNodeActionsDesktop from 'ee/geo_nodes_beta/components/header/geo_node_actions_desktop.vue';
import { MOCK_PRIMARY_VERSION, MOCK_REPLICABLE_TYPES } from 'ee_jest/geo_nodes_beta/mock_data';
import {
MOCK_NODES,
MOCK_PRIMARY_VERSION,
MOCK_REPLICABLE_TYPES,
} from 'ee_jest/geo_nodes_beta/mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -11,7 +15,7 @@ describe('GeoNodeActionsDesktop', () => {
let wrapper;
const defaultProps = {
primary: true,
node: MOCK_NODES[0],
};
const createComponent = (initialState, props) => {
......@@ -54,6 +58,12 @@ describe('GeoNodeActionsDesktop', () => {
'Remove',
]);
});
it('renders edit link correctly', () => {
expect(findGeoDesktopActionsButtons().at(0).attributes('href')).toBe(
MOCK_NODES[0].webEditUrl,
);
});
});
describe.each`
......@@ -62,11 +72,11 @@ describe('GeoNodeActionsDesktop', () => {
${false} | ${undefined}
`(`conditionally`, ({ primary, disabled }) => {
beforeEach(() => {
createComponent(null, { primary });
createComponent(null, { node: { primary } });
});
describe(`when primary is ${primary}`, () => {
it('disables the Desktop Remove button', () => {
it(`does ${primary ? '' : 'not '}disable the Desktop Remove button`, () => {
expect(findGeoDesktopActionsRemoveButton().attributes('disabled')).toBe(disabled);
});
});
......
ee/spec/frontend/geo_nodes_beta/components/header/geo_node_actions_mobile_spec.js
View file @ d2cc4ddb
......@@ -2,7 +2,11 @@ import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import Vuex from 'vuex';
import GeoNodeActionsMobile from 'ee/geo_nodes_beta/components/header/geo_node_actions_mobile.vue';
import { MOCK_PRIMARY_VERSION, MOCK_REPLICABLE_TYPES } from 'ee_jest/geo_nodes_beta/mock_data';
import {
MOCK_NODES,
MOCK_PRIMARY_VERSION,
MOCK_REPLICABLE_TYPES,
} from 'ee_jest/geo_nodes_beta/mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -11,7 +15,7 @@ describe('GeoNodeActionsMobile', () => {
let wrapper;
const defaultProps = {
primary: true,
node: MOCK_NODES[0],
};
const createComponent = (initialState, props) => {
......@@ -59,6 +63,12 @@ describe('GeoNodeActionsMobile', () => {
'Remove',
]);
});
it('renders edit link correctly', () => {
expect(findGeoMobileActionsDropdownItems().at(0).attributes('href')).toBe(
MOCK_NODES[0].webEditUrl,
);
});
});
describe.each`
......@@ -67,11 +77,13 @@ describe('GeoNodeActionsMobile', () => {
${false} | ${undefined} | ${'gl-text-red-500'}
`(`conditionally`, ({ primary, disabled, dropdownClass }) => {
beforeEach(() => {
createComponent(null, { primary });
createComponent(null, { node: { primary } });
});
describe(`when primary is ${primary}`, () => {
it('disables the Mobile Remove dropdown item and adds proper class', () => {
it(`does ${
primary ? '' : 'not '
}disable the Mobile Remove dropdown item and adds proper class`, () => {
expect(findGeoMobileActionsRemoveDropdownItem().attributes('disabled')).toBe(disabled);
expect(findGeoMobileActionsRemoveDropdownItem().find('span').classes(dropdownClass)).toBe(
true,
......
ee/spec/frontend/geo_nodes_beta/components/header/geo_node_actions_spec.js
View file @ d2cc4ddb
......@@ -3,7 +3,11 @@ import Vuex from 'vuex';
import GeoNodeActions from 'ee/geo_nodes_beta/components/header/geo_node_actions.vue';
import GeoNodeActionsDesktop from 'ee/geo_nodes_beta/components/header/geo_node_actions_desktop.vue';
import GeoNodeActionsMobile from 'ee/geo_nodes_beta/components/header/geo_node_actions_mobile.vue';
import { MOCK_PRIMARY_VERSION, MOCK_REPLICABLE_TYPES } from 'ee_jest/geo_nodes_beta/mock_data';
import {
MOCK_NODES,
MOCK_PRIMARY_VERSION,
MOCK_REPLICABLE_TYPES,
} from 'ee_jest/geo_nodes_beta/mock_data';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -12,7 +16,7 @@ describe('GeoNodeActions', () => {
let wrapper;
const defaultProps = {
primary: true,
node: MOCK_NODES[0],
};
const createComponent = (initialState, props) => {
......
ee/spec/frontend/geo_nodes_beta/mock_data.js
View file @ d2cc4ddb
......@@ -140,6 +140,7 @@ export const MOCK_NODES = [
replicationSlotsUsedCount: 0,
version: '10.4.0-pre',
revision: 'b93c51849b',
webEditUrl: 'http://127.0.0.1:3001/admin/geo/nodes/1',
},
{
id: 2,
......@@ -209,6 +210,7 @@ export const MOCK_NODE_STATUSES_RES = [
replication_slots_used_count: 0,
version: '10.4.0-pre',
revision: 'b93c51849b',
web_edit_url: 'http://127.0.0.1:3001/admin/geo/nodes/1',
},
{
geo_node_id: 2,
......
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7