summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--app/assets/javascripts/environments/components/environment.vue13
-rw-r--r--app/assets/javascripts/environments/components/environment_actions.vue18
-rw-r--r--app/assets/javascripts/environments/components/environment_item.vue22
-rw-r--r--app/assets/javascripts/environments/components/environment_rollback.vue19
-rw-r--r--app/assets/javascripts/environments/components/environment_stop.vue18
-rw-r--r--app/assets/javascripts/environments/components/environments_table.vue9
-rw-r--r--changelogs/unreleased/31156-environments-vue-service.yml4
-rw-r--r--spec/javascripts/environments/environment_actions_spec.js12
-rw-r--r--spec/javascripts/environments/environment_rollback_spec.js24
-rw-r--r--spec/javascripts/environments/environment_stop_spec.js10
10 files changed, 32 insertions, 117 deletions
diff --git a/app/assets/javascripts/environments/components/environment.vue b/app/assets/javascripts/environments/components/environment.vue
index f319d6ca0c8..b11b02042df 100644
--- a/app/assets/javascripts/environments/components/environment.vue
+++ b/app/assets/javascripts/environments/components/environment.vue
@@ -71,6 +71,7 @@ export default {
eventHub.$on('refreshEnvironments', this.fetchEnvironments);
eventHub.$on('toggleFolder', this.toggleFolder);
+ eventHub.$on('postAction', this.postAction);
},
beforeDestroyed() {
@@ -140,6 +141,17 @@ export default {
new Flash('An error occurred while fetching the environments.');
});
},
+
+ postAction(endpoint) {
+ this.service.postAction(endpoint)
+ .then(() => {
+ this.fetchEnvironments();
+ })
+ .catch(() => {
+ // eslint-disable-next-line no-new
+ new Flash('An error occured while making the request.');
+ });
+ },
},
};
</script>
@@ -217,7 +229,6 @@ export default {
:environments="state.environments"
:can-create-deployment="canCreateDeploymentParsed"
:can-read-environment="canReadEnvironmentParsed"
- :service="service"
:is-loading-folder-content="isLoadingFolderContent" />
</div>
diff --git a/app/assets/javascripts/environments/components/environment_actions.vue b/app/assets/javascripts/environments/components/environment_actions.vue
index e81c97260d7..63bffe8a998 100644
--- a/app/assets/javascripts/environments/components/environment_actions.vue
+++ b/app/assets/javascripts/environments/components/environment_actions.vue
@@ -1,7 +1,4 @@
<script>
-/* global Flash */
-/* eslint-disable no-new */
-
import playIconSvg from 'icons/_icon_play.svg';
import eventHub from '../event_hub';
@@ -12,11 +9,6 @@ export default {
required: false,
default: () => [],
},
-
- service: {
- type: Object,
- required: true,
- },
},
data() {
@@ -38,15 +30,7 @@ export default {
$(this.$refs.tooltip).tooltip('destroy');
- this.service.postAction(endpoint)
- .then(() => {
- this.isLoading = false;
- eventHub.$emit('refreshEnvironments');
- })
- .catch(() => {
- this.isLoading = false;
- new Flash('An error occured while making the request.');
- });
+ eventHub.$emit('postAction', endpoint);
},
isActionDisabled(action) {
diff --git a/app/assets/javascripts/environments/components/environment_item.vue b/app/assets/javascripts/environments/components/environment_item.vue
index 73679de6039..0ffe9ea17fa 100644
--- a/app/assets/javascripts/environments/components/environment_item.vue
+++ b/app/assets/javascripts/environments/components/environment_item.vue
@@ -46,11 +46,6 @@ export default {
required: false,
default: false,
},
-
- service: {
- type: Object,
- required: true,
- },
},
computed: {
@@ -543,31 +538,34 @@ export default {
<actions-component
v-if="hasManualActions && canCreateDeployment"
- :service="service"
- :actions="manualActions"/>
+ :actions="manualActions"
+ />
<external-url-component
v-if="externalURL && canReadEnvironment"
- :external-url="externalURL"/>
+ :external-url="externalURL"
+ />
<monitoring-button-component
v-if="monitoringUrl && canReadEnvironment"
- :monitoring-url="monitoringUrl"/>
+ :monitoring-url="monitoringUrl"
+ />
<terminal-button-component
v-if="model && model.terminal_path"
- :terminal-path="model.terminal_path"/>
+ :terminal-path="model.terminal_path"
+ />
<stop-component
v-if="hasStopAction && canCreateDeployment"
:stop-url="model.stop_path"
- :service="service"/>
+ />
<rollback-component
v-if="canRetry && canCreateDeployment"
:is-last-deployment="isLastDeployment"
:retry-url="retryUrl"
- :service="service"/>
+ />
</div>
</td>
</tr>
diff --git a/app/assets/javascripts/environments/components/environment_rollback.vue b/app/assets/javascripts/environments/components/environment_rollback.vue
index f139f24036f..44b8730fd09 100644
--- a/app/assets/javascripts/environments/components/environment_rollback.vue
+++ b/app/assets/javascripts/environments/components/environment_rollback.vue
@@ -1,6 +1,4 @@
<script>
-/* global Flash */
-/* eslint-disable no-new */
/**
* Renders Rollback or Re deploy button in environments table depending
* of the provided property `isLastDeployment`.
@@ -20,11 +18,6 @@ export default {
type: Boolean,
default: true,
},
-
- service: {
- type: Object,
- required: true,
- },
},
data() {
@@ -37,17 +30,7 @@ export default {
onClick() {
this.isLoading = true;
- $(this.$el).tooltip('destroy');
-
- this.service.postAction(this.retryUrl)
- .then(() => {
- this.isLoading = false;
- eventHub.$emit('refreshEnvironments');
- })
- .catch(() => {
- this.isLoading = false;
- new Flash('An error occured while making the request.');
- });
+ eventHub.$emit('postAction', this.retryUrl);
},
},
};
diff --git a/app/assets/javascripts/environments/components/environment_stop.vue b/app/assets/javascripts/environments/components/environment_stop.vue
index 11e9aff7b92..f483ea7e937 100644
--- a/app/assets/javascripts/environments/components/environment_stop.vue
+++ b/app/assets/javascripts/environments/components/environment_stop.vue
@@ -1,6 +1,4 @@
<script>
-/* global Flash */
-/* eslint-disable no-new, no-alert */
/**
* Renders the stop "button" that allows stop an environment.
* Used in environments table.
@@ -13,11 +11,6 @@ export default {
type: String,
default: '',
},
-
- service: {
- type: Object,
- required: true,
- },
},
data() {
@@ -34,20 +27,13 @@ export default {
methods: {
onClick() {
+ // eslint-disable-next-line no-alert
if (confirm('Are you sure you want to stop this environment?')) {
this.isLoading = true;
$(this.$el).tooltip('destroy');
- this.service.postAction(this.retryUrl)
- .then(() => {
- this.isLoading = false;
- eventHub.$emit('refreshEnvironments');
- })
- .catch(() => {
- this.isLoading = false;
- new Flash('An error occured while making the request.', 'alert');
- });
+ eventHub.$emit('postAction', this.stopUrl);
}
},
},
diff --git a/app/assets/javascripts/environments/components/environments_table.vue b/app/assets/javascripts/environments/components/environments_table.vue
index 87f7cb4a536..15eedaf76e1 100644
--- a/app/assets/javascripts/environments/components/environments_table.vue
+++ b/app/assets/javascripts/environments/components/environments_table.vue
@@ -28,11 +28,6 @@ export default {
default: false,
},
- service: {
- type: Object,
- required: true,
- },
-
isLoadingFolderContent: {
type: Boolean,
required: false,
@@ -78,7 +73,7 @@ export default {
:model="model"
:can-create-deployment="canCreateDeployment"
:can-read-environment="canReadEnvironment"
- :service="service" />
+ />
<template v-if="model.isFolder && model.isOpen && model.children && model.children.length > 0">
<tr v-if="isLoadingFolderContent">
@@ -96,7 +91,7 @@ export default {
:model="children"
:can-create-deployment="canCreateDeployment"
:can-read-environment="canReadEnvironment"
- :service="service" />
+ />
<tr>
<td
diff --git a/changelogs/unreleased/31156-environments-vue-service.yml b/changelogs/unreleased/31156-environments-vue-service.yml
new file mode 100644
index 00000000000..8b899ed9861
--- /dev/null
+++ b/changelogs/unreleased/31156-environments-vue-service.yml
@@ -0,0 +1,4 @@
+---
+title: Fix environments vue architecture to match documentation
+merge_request:
+author:
diff --git a/spec/javascripts/environments/environment_actions_spec.js b/spec/javascripts/environments/environment_actions_spec.js
index 676bf61cfd9..596d812c724 100644
--- a/spec/javascripts/environments/environment_actions_spec.js
+++ b/spec/javascripts/environments/environment_actions_spec.js
@@ -4,7 +4,6 @@ import actionsComp from '~/environments/components/environment_actions.vue';
describe('Actions Component', () => {
let ActionsComponent;
let actionsMock;
- let spy;
let component;
beforeEach(() => {
@@ -26,13 +25,9 @@ describe('Actions Component', () => {
},
];
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
component = new ActionsComponent({
propsData: {
actions: actionsMock,
- service: {
- postAction: spy,
- },
},
}).$mount();
});
@@ -48,13 +43,6 @@ describe('Actions Component', () => {
).toEqual(actionsMock.length);
});
- it('should call the service when an action is clicked', () => {
- component.$el.querySelector('.dropdown').click();
- component.$el.querySelector('.js-manual-action-link').click();
-
- expect(spy).toHaveBeenCalledWith(actionsMock[0].play_path);
- });
-
it('should render a disabled action when it\'s not playable', () => {
expect(
component.$el.querySelector('.dropdown-menu li:last-child button').getAttribute('disabled'),
diff --git a/spec/javascripts/environments/environment_rollback_spec.js b/spec/javascripts/environments/environment_rollback_spec.js
index 25397714a76..eb8e49d81fe 100644
--- a/spec/javascripts/environments/environment_rollback_spec.js
+++ b/spec/javascripts/environments/environment_rollback_spec.js
@@ -4,11 +4,9 @@ import rollbackComp from '~/environments/components/environment_rollback.vue';
describe('Rollback Component', () => {
const retryURL = 'https://gitlab.com/retry';
let RollbackComponent;
- let spy;
beforeEach(() => {
RollbackComponent = Vue.extend(rollbackComp);
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
});
it('Should render Re-deploy label when isLastDeployment is true', () => {
@@ -17,9 +15,6 @@ describe('Rollback Component', () => {
propsData: {
retryUrl: retryURL,
isLastDeployment: true,
- service: {
- postAction: spy,
- },
},
}).$mount();
@@ -32,28 +27,9 @@ describe('Rollback Component', () => {
propsData: {
retryUrl: retryURL,
isLastDeployment: false,
- service: {
- postAction: spy,
- },
},
}).$mount();
expect(component.$el.querySelector('span').textContent).toContain('Rollback');
});
-
- it('should call the service when the button is clicked', () => {
- const component = new RollbackComponent({
- propsData: {
- retryUrl: retryURL,
- isLastDeployment: false,
- service: {
- postAction: spy,
- },
- },
- }).$mount();
-
- component.$el.click();
-
- expect(spy).toHaveBeenCalledWith(retryURL);
- });
});
diff --git a/spec/javascripts/environments/environment_stop_spec.js b/spec/javascripts/environments/environment_stop_spec.js
index 942e4aaabd4..8131f1e5b11 100644
--- a/spec/javascripts/environments/environment_stop_spec.js
+++ b/spec/javascripts/environments/environment_stop_spec.js
@@ -4,20 +4,15 @@ import stopComp from '~/environments/components/environment_stop.vue';
describe('Stop Component', () => {
let StopComponent;
let component;
- let spy;
const stopURL = '/stop';
beforeEach(() => {
StopComponent = Vue.extend(stopComp);
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
spyOn(window, 'confirm').and.returnValue(true);
component = new StopComponent({
propsData: {
stopUrl: stopURL,
- service: {
- postAction: spy,
- },
},
}).$mount();
});
@@ -26,9 +21,4 @@ describe('Stop Component', () => {
expect(component.$el.tagName).toEqual('BUTTON');
expect(component.$el.getAttribute('title')).toEqual('Stop');
});
-
- it('should call the service when an action is clicked', () => {
- component.$el.click();
- expect(spy).toHaveBeenCalled();
- });
});