debian-mirror-gitlab/app/assets/javascripts/environments/mixins/environments_mixin.js

228 lines
6.6 KiB
JavaScript
Raw Normal View History

2018-03-17 18:26:18 +05:30
/**
* Common code between environmets app and folder view
*/
import _ from 'underscore';
import Visibility from 'visibilityjs';
2019-07-07 11:18:12 +05:30
import EnvironmentsStore from 'ee_else_ce/environments/stores/environments_store';
2018-03-17 18:26:18 +05:30
import Poll from '../../lib/utils/poll';
2018-12-13 13:39:08 +05:30
import { getParameterByName } from '../../lib/utils/common_utils';
2018-03-17 18:26:18 +05:30
import { s__ } from '../../locale';
import Flash from '../../flash';
import eventHub from '../event_hub';
import EnvironmentsService from '../services/environments_service';
2019-09-04 21:01:54 +05:30
import tablePagination from '../../vue_shared/components/pagination/table_pagination.vue';
2018-03-17 18:26:18 +05:30
import environmentTable from '../components/environments_table.vue';
import tabs from '../../vue_shared/components/navigation_tabs.vue';
import container from '../components/container.vue';
2017-09-10 17:25:29 +05:30
export default {
2018-03-17 18:26:18 +05:30
components: {
environmentTable,
container,
tabs,
tablePagination,
},
data() {
const store = new EnvironmentsStore();
return {
store,
state: store.state,
isLoading: false,
isMakingRequest: false,
scope: getParameterByName('scope') || 'available',
page: getParameterByName('page') || '1',
requestData: {},
2018-11-18 11:00:15 +05:30
environmentInStopModal: {},
2019-07-07 11:18:12 +05:30
environmentInRollbackModal: {},
2018-03-17 18:26:18 +05:30
};
},
2017-09-10 17:25:29 +05:30
methods: {
saveData(resp) {
2018-11-08 19:23:39 +05:30
this.isLoading = false;
2019-07-07 11:18:12 +05:30
// Prevent the absence of the nested flag from causing mismatches
const response = this.filterNilValues(resp.config.params);
const request = this.filterNilValues(this.requestData);
if (_.isEqual(response, request)) {
2018-11-08 19:23:39 +05:30
this.store.storeAvailableCount(resp.data.available_count);
this.store.storeStoppedCount(resp.data.stopped_count);
this.store.storeEnvironments(resp.data.environments);
2020-03-09 13:42:32 +05:30
this.store.setReviewAppDetails(resp.data.review_app);
2018-11-08 19:23:39 +05:30
this.store.setPagination(resp.headers);
}
2017-09-10 17:25:29 +05:30
},
2018-03-17 18:26:18 +05:30
2019-07-07 11:18:12 +05:30
filterNilValues(obj) {
return _.omit(obj, value => _.isUndefined(value) || _.isNull(value));
},
2018-03-17 18:26:18 +05:30
/**
* Handles URL and query parameter changes.
* When the user uses the pagination or the tabs,
* - update URL
* - Make API request to the server with new parameters
* - Update the polling function
* - Update the internal state
*/
updateContent(parameters) {
this.updateInternalState(parameters);
// fetch new data
2018-12-13 13:39:08 +05:30
return this.service
.fetchEnvironments(this.requestData)
2019-07-07 11:18:12 +05:30
.then(response => {
this.successCallback(response);
this.poll.enable({ data: this.requestData, response });
2018-03-17 18:26:18 +05:30
})
.catch(() => {
this.errorCallback();
// restart polling
this.poll.restart();
});
},
errorCallback() {
this.isLoading = false;
Flash(s__('Environments|An error occurred while fetching the environments.'));
},
2020-03-09 13:42:32 +05:30
postAction({
endpoint,
errorMessage = s__('Environments|An error occurred while making the request.'),
}) {
2018-03-17 18:26:18 +05:30
if (!this.isMakingRequest) {
this.isLoading = true;
2018-12-13 13:39:08 +05:30
this.service
.postAction(endpoint)
2018-03-17 18:26:18 +05:30
.then(() => this.fetchEnvironments())
2020-03-09 13:42:32 +05:30
.catch(err => {
2018-03-17 18:26:18 +05:30
this.isLoading = false;
2020-03-09 13:42:32 +05:30
Flash(_.isFunction(errorMessage) ? errorMessage(err.response.data) : errorMessage);
2018-03-17 18:26:18 +05:30
});
}
},
fetchEnvironments() {
this.isLoading = true;
2018-12-13 13:39:08 +05:30
return this.service
.fetchEnvironments(this.requestData)
2018-03-17 18:26:18 +05:30
.then(this.successCallback)
.catch(this.errorCallback);
},
2018-11-18 11:00:15 +05:30
updateStopModal(environment) {
this.environmentInStopModal = environment;
},
2019-07-07 11:18:12 +05:30
updateRollbackModal(environment) {
this.environmentInRollbackModal = environment;
},
2018-11-18 11:00:15 +05:30
stopEnvironment(environment) {
const endpoint = environment.stop_path;
2018-12-13 13:39:08 +05:30
const errorMessage = s__(
'Environments|An error occurred while stopping the environment, please try again',
);
2018-11-18 11:00:15 +05:30
this.postAction({ endpoint, errorMessage });
},
2019-07-07 11:18:12 +05:30
rollbackEnvironment(environment) {
const { retryUrl, isLastDeployment } = environment;
const errorMessage = isLastDeployment
? s__('Environments|An error occurred while re-deploying the environment, please try again')
: s__(
'Environments|An error occurred while rolling back the environment, please try again',
);
this.postAction({ endpoint: retryUrl, errorMessage });
},
2020-03-09 13:42:32 +05:30
cancelAutoStop(autoStopPath) {
const errorMessage = ({ message }) =>
message ||
s__('Environments|An error occurred while canceling the auto stop, please try again');
this.postAction({ endpoint: autoStopPath, errorMessage });
},
2018-03-17 18:26:18 +05:30
},
computed: {
tabs() {
return [
{
name: s__('Available'),
scope: 'available',
count: this.state.availableCounter,
isActive: this.scope === 'available',
},
{
name: s__('Stopped'),
scope: 'stopped',
count: this.state.stoppedCounter,
isActive: this.scope === 'stopped',
},
];
},
},
/**
* Fetches all the environments and stores them.
* Toggles loading property.
*/
created() {
this.service = new EnvironmentsService(this.endpoint);
2019-03-02 22:35:43 +05:30
this.requestData = { page: this.page, scope: this.scope, nested: true };
2018-03-17 18:26:18 +05:30
this.poll = new Poll({
resource: this.service,
2018-11-08 19:23:39 +05:30
method: 'fetchEnvironments',
2018-03-17 18:26:18 +05:30
data: this.requestData,
successCallback: this.successCallback,
errorCallback: this.errorCallback,
2018-12-13 13:39:08 +05:30
notificationCallback: isMakingRequest => {
2018-03-17 18:26:18 +05:30
this.isMakingRequest = isMakingRequest;
},
});
if (!Visibility.hidden()) {
this.isLoading = true;
this.poll.makeRequest();
} else {
this.fetchEnvironments();
}
Visibility.change(() => {
if (!Visibility.hidden()) {
this.poll.restart();
} else {
this.poll.stop();
}
});
eventHub.$on('postAction', this.postAction);
2018-11-18 11:00:15 +05:30
eventHub.$on('requestStopEnvironment', this.updateStopModal);
eventHub.$on('stopEnvironment', this.stopEnvironment);
2019-07-07 11:18:12 +05:30
eventHub.$on('requestRollbackEnvironment', this.updateRollbackModal);
eventHub.$on('rollbackEnvironment', this.rollbackEnvironment);
2020-03-09 13:42:32 +05:30
eventHub.$on('cancelAutoStop', this.cancelAutoStop);
2018-03-17 18:26:18 +05:30
},
2018-11-18 11:00:15 +05:30
beforeDestroy() {
eventHub.$off('postAction', this.postAction);
eventHub.$off('requestStopEnvironment', this.updateStopModal);
eventHub.$off('stopEnvironment', this.stopEnvironment);
2019-07-07 11:18:12 +05:30
eventHub.$off('requestRollbackEnvironment', this.updateRollbackModal);
eventHub.$off('rollbackEnvironment', this.rollbackEnvironment);
2020-03-09 13:42:32 +05:30
eventHub.$off('cancelAutoStop', this.cancelAutoStop);
2017-09-10 17:25:29 +05:30
},
};