debian-mirror-gitlab/app/assets/javascripts/protected_branches/protected_branch_edit.js

177 lines
5.3 KiB
JavaScript
Raw Normal View History

2020-10-24 23:57:45 +05:30
import { find } from 'lodash';
import axios from '~/lib/utils/axios_utils';
2019-07-31 22:56:46 +05:30
import { __ } from '~/locale';
2021-03-11 19:13:27 +05:30
import AccessDropdown from '~/projects/settings/access_dropdown';
import { deprecatedCreateFlash as flash } from '../flash';
import { ACCESS_LEVELS, LEVEL_TYPES } from './constants';
2016-09-13 17:45:13 +05:30
2017-09-10 17:25:29 +05:30
export default class ProtectedBranchEdit {
constructor(options) {
2020-10-24 23:57:45 +05:30
this.hasLicense = options.hasLicense;
this.$wraps = {};
this.hasChanges = false;
2017-09-10 17:25:29 +05:30
this.$wrap = options.$wrap;
this.$allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
this.$allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
2021-04-17 20:07:23 +05:30
this.$forcePushToggle = this.$wrap.find('.js-force-push-toggle');
2020-10-24 23:57:45 +05:30
this.$codeOwnerToggle = this.$wrap.find('.js-code-owner-toggle');
this.$wraps[ACCESS_LEVELS.MERGE] = this.$allowedToMergeDropdown.closest(
`.${ACCESS_LEVELS.MERGE}-container`,
);
this.$wraps[ACCESS_LEVELS.PUSH] = this.$allowedToPushDropdown.closest(
`.${ACCESS_LEVELS.PUSH}-container`,
);
2016-09-13 17:45:13 +05:30
2017-09-10 17:25:29 +05:30
this.buildDropdowns();
2020-10-24 23:57:45 +05:30
this.bindEvents();
}
bindEvents() {
2021-04-17 20:07:23 +05:30
this.$forcePushToggle.on('click', this.onForcePushToggleClick.bind(this));
2020-10-24 23:57:45 +05:30
if (this.hasLicense) {
this.$codeOwnerToggle.on('click', this.onCodeOwnerToggleClick.bind(this));
}
}
2021-04-17 20:07:23 +05:30
onForcePushToggleClick() {
this.$forcePushToggle.toggleClass('is-checked');
this.$forcePushToggle.prop('disabled', true);
const formData = {
allow_force_push: this.$forcePushToggle.hasClass('is-checked'),
};
this.updateProtectedBranch(formData, () => this.$forcePushToggle.prop('disabled', false));
}
2020-10-24 23:57:45 +05:30
onCodeOwnerToggleClick() {
this.$codeOwnerToggle.toggleClass('is-checked');
this.$codeOwnerToggle.prop('disabled', true);
const formData = {
code_owner_approval_required: this.$codeOwnerToggle.hasClass('is-checked'),
};
2021-04-17 20:07:23 +05:30
this.updateProtectedBranch(formData, () => this.$codeOwnerToggle.prop('disabled', false));
2020-10-24 23:57:45 +05:30
}
2021-04-17 20:07:23 +05:30
updateProtectedBranch(formData, callback) {
2020-10-24 23:57:45 +05:30
axios
.patch(this.$wrap.data('url'), {
protected_branch: formData,
})
2021-04-17 20:07:23 +05:30
.then(callback)
2020-10-24 23:57:45 +05:30
.catch(() => {
flash(__('Failed to update branch!'));
});
2017-09-10 17:25:29 +05:30
}
2016-09-13 17:45:13 +05:30
2017-09-10 17:25:29 +05:30
buildDropdowns() {
// Allowed to merge dropdown
2020-10-24 23:57:45 +05:30
this[`${ACCESS_LEVELS.MERGE}_dropdown`] = new AccessDropdown({
accessLevel: ACCESS_LEVELS.MERGE,
accessLevelsData: gon.merge_access_levels,
2017-09-10 17:25:29 +05:30
$dropdown: this.$allowedToMergeDropdown,
2020-10-24 23:57:45 +05:30
onSelect: this.onSelectOption.bind(this),
onHide: this.onDropdownHide.bind(this),
hasLicense: this.hasLicense,
2017-09-10 17:25:29 +05:30
});
2016-09-13 17:45:13 +05:30
2017-09-10 17:25:29 +05:30
// Allowed to push dropdown
2020-10-24 23:57:45 +05:30
this[`${ACCESS_LEVELS.PUSH}_dropdown`] = new AccessDropdown({
accessLevel: ACCESS_LEVELS.PUSH,
accessLevelsData: gon.push_access_levels,
2017-09-10 17:25:29 +05:30
$dropdown: this.$allowedToPushDropdown,
2020-10-24 23:57:45 +05:30
onSelect: this.onSelectOption.bind(this),
onHide: this.onDropdownHide.bind(this),
hasLicense: this.hasLicense,
2017-09-10 17:25:29 +05:30
});
}
2016-09-13 17:45:13 +05:30
2020-10-24 23:57:45 +05:30
onSelectOption() {
this.hasChanges = true;
}
2016-09-13 17:45:13 +05:30
2020-10-24 23:57:45 +05:30
onDropdownHide() {
if (!this.hasChanges) {
return;
}
2017-08-17 22:00:37 +05:30
2020-10-24 23:57:45 +05:30
this.hasChanges = true;
this.updatePermissions();
}
updatePermissions() {
const formData = Object.keys(ACCESS_LEVELS).reduce((acc, level) => {
const accessLevelName = ACCESS_LEVELS[level];
const inputData = this[`${accessLevelName}_dropdown`].getInputData(accessLevelName);
acc[`${accessLevelName}_attributes`] = inputData;
return acc;
}, {});
2016-09-13 17:45:13 +05:30
2018-12-13 13:39:08 +05:30
axios
.patch(this.$wrap.data('url'), {
2020-10-24 23:57:45 +05:30
protected_branch: formData,
2018-12-13 13:39:08 +05:30
})
2020-10-24 23:57:45 +05:30
.then(({ data }) => {
this.hasChanges = false;
2021-03-08 18:12:59 +05:30
Object.keys(ACCESS_LEVELS).forEach((level) => {
2020-10-24 23:57:45 +05:30
const accessLevelName = ACCESS_LEVELS[level];
// The data coming from server will be the new persisted *state* for each dropdown
this.setSelectedItemsToDropdown(data[accessLevelName], `${accessLevelName}_dropdown`);
});
2018-12-13 13:39:08 +05:30
this.$allowedToMergeDropdown.enable();
this.$allowedToPushDropdown.enable();
})
.catch(() => {
this.$allowedToMergeDropdown.enable();
this.$allowedToPushDropdown.enable();
2020-10-24 23:57:45 +05:30
flash(__('Failed to update branch!'));
2018-12-13 13:39:08 +05:30
});
2017-09-10 17:25:29 +05:30
}
2020-10-24 23:57:45 +05:30
setSelectedItemsToDropdown(items = [], dropdownName) {
2021-03-08 18:12:59 +05:30
const itemsToAdd = items.map((currentItem) => {
2020-10-24 23:57:45 +05:30
if (currentItem.user_id) {
// Do this only for users for now
// get the current data for selected items
const selectedItems = this[dropdownName].getSelectedItems();
const currentSelectedItem = find(selectedItems, {
user_id: currentItem.user_id,
});
return {
id: currentItem.id,
user_id: currentItem.user_id,
type: LEVEL_TYPES.USER,
persisted: true,
name: currentSelectedItem.name,
username: currentSelectedItem.username,
avatar_url: currentSelectedItem.avatar_url,
};
} else if (currentItem.group_id) {
return {
id: currentItem.id,
group_id: currentItem.group_id,
type: LEVEL_TYPES.GROUP,
persisted: true,
};
}
return {
id: currentItem.id,
access_level: currentItem.access_level,
type: LEVEL_TYPES.ROLE,
persisted: true,
};
});
this[dropdownName].setSelectedItems(itemsToAdd);
}
2017-09-10 17:25:29 +05:30
}