Remove groups_select from global namespace & simplifies the code
This commit is contained in:
Filipa Lacerda
Phil Hughes
parent
a1aa4f00c2
commit
fed51d1eaa
4 changed files with 78 additions and 114 deletions
|
|
@ -13,7 +13,7 @@ import GroupLabelSubscription from './group_label_subscription';
|
|||
/* global LineHighlighter */
|
||||
import BuildArtifacts from './build_artifacts';
|
||||
import CILintEditor from './ci_lint_editor';
|
||||
/* global GroupsSelect */
|
||||
import groupsSelect from './groups_select';
|
||||
/* global Search */
|
||||
/* global Admin */
|
||||
/* global NamespaceSelects */
|
||||
|
|
@ -414,7 +414,7 @@ import Diff from './diff';
|
|||
break;
|
||||
case 'projects:project_members:index':
|
||||
memberExpirationDate('.js-access-expiration-date-groups');
|
||||
new GroupsSelect();
|
||||
groupsSelect();
|
||||
memberExpirationDate();
|
||||
new Members();
|
||||
new UsersSelect();
|
||||
|
|
|
|||
|
|
@ -1,121 +1,86 @@
|
|||
/* eslint-disable func-names, space-before-function-paren, no-var, wrap-iife, one-var,
|
||||
camelcase, one-var-declaration-per-line, quotes, object-shorthand,
|
||||
prefer-arrow-callback, comma-dangle, consistent-return, yoda,
|
||||
prefer-rest-params, prefer-spread, no-unused-vars, prefer-template,
|
||||
promise/catch-or-return */
|
||||
import Api from './api';
|
||||
import { normalizeCRLFHeaders } from './lib/utils/common_utils';
|
||||
|
||||
var slice = [].slice;
|
||||
export default function groupsSelect() {
|
||||
// Needs to be accessible in rspec
|
||||
window.GROUP_SELECT_PER_PAGE = 20;
|
||||
$('.ajax-groups-select').each(function setAjaxGroupsSelect2() {
|
||||
const $select = $(this);
|
||||
const allAvailable = $select.data('all-available');
|
||||
const skipGroups = $select.data('skip-groups') || [];
|
||||
$select.select2({
|
||||
placeholder: 'Search for a group',
|
||||
multiple: $select.hasClass('multiselect'),
|
||||
minimumInputLength: 0,
|
||||
ajax: {
|
||||
url: Api.buildUrl(Api.groupsPath),
|
||||
dataType: 'json',
|
||||
quietMillis: 250,
|
||||
transport(params) {
|
||||
return $.ajax(params)
|
||||
.then((data, status, xhr) => {
|
||||
const results = data || [];
|
||||
|
||||
window.GroupsSelect = (function() {
|
||||
function GroupsSelect() {
|
||||
$('.ajax-groups-select').each((function(_this) {
|
||||
const self = _this;
|
||||
|
||||
return function(i, select) {
|
||||
var all_available, skip_groups;
|
||||
const $select = $(select);
|
||||
all_available = $select.data('all-available');
|
||||
skip_groups = $select.data('skip-groups') || [];
|
||||
|
||||
$select.select2({
|
||||
placeholder: "Search for a group",
|
||||
multiple: $select.hasClass('multiselect'),
|
||||
minimumInputLength: 0,
|
||||
ajax: {
|
||||
url: Api.buildUrl(Api.groupsPath),
|
||||
dataType: 'json',
|
||||
quietMillis: 250,
|
||||
transport: function (params) {
|
||||
$.ajax(params).then((data, status, xhr) => {
|
||||
const results = data || [];
|
||||
|
||||
const headers = normalizeCRLFHeaders(xhr.getAllResponseHeaders());
|
||||
const currentPage = parseInt(headers['X-PAGE'], 10) || 0;
|
||||
const totalPages = parseInt(headers['X-TOTAL-PAGES'], 10) || 0;
|
||||
const more = currentPage < totalPages;
|
||||
|
||||
return {
|
||||
results,
|
||||
pagination: {
|
||||
more,
|
||||
},
|
||||
};
|
||||
}).then(params.success).fail(params.error);
|
||||
},
|
||||
data: function (search, page) {
|
||||
return {
|
||||
search,
|
||||
page,
|
||||
per_page: GroupsSelect.PER_PAGE,
|
||||
all_available,
|
||||
};
|
||||
},
|
||||
results: function (data, page) {
|
||||
if (data.length) return { results: [] };
|
||||
|
||||
const groups = data.length ? data : data.results || [];
|
||||
const more = data.pagination ? data.pagination.more : false;
|
||||
const results = groups.filter(group => skip_groups.indexOf(group.id) === -1);
|
||||
const headers = normalizeCRLFHeaders(xhr.getAllResponseHeaders());
|
||||
const currentPage = parseInt(headers['X-PAGE'], 10) || 0;
|
||||
const totalPages = parseInt(headers['X-TOTAL-PAGES'], 10) || 0;
|
||||
const more = currentPage < totalPages;
|
||||
|
||||
return {
|
||||
results,
|
||||
page,
|
||||
more,
|
||||
pagination: {
|
||||
more,
|
||||
},
|
||||
};
|
||||
},
|
||||
},
|
||||
initSelection: function(element, callback) {
|
||||
var id;
|
||||
id = $(element).val();
|
||||
if (id !== "") {
|
||||
return Api.group(id, callback);
|
||||
}
|
||||
},
|
||||
formatResult: function() {
|
||||
var args;
|
||||
args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
|
||||
return self.formatResult.apply(self, args);
|
||||
},
|
||||
formatSelection: function() {
|
||||
var args;
|
||||
args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
|
||||
return self.formatSelection.apply(self, args);
|
||||
},
|
||||
dropdownCssClass: "ajax-groups-dropdown select2-infinite",
|
||||
// we do not want to escape markup since we are displaying html in results
|
||||
escapeMarkup: function(m) {
|
||||
return m;
|
||||
}
|
||||
});
|
||||
})
|
||||
.then(params.success)
|
||||
.fail(params.error);
|
||||
},
|
||||
data(search, page) {
|
||||
return {
|
||||
search,
|
||||
page,
|
||||
per_page: window.GROUP_SELECT_PER_PAGE,
|
||||
all_available: allAvailable,
|
||||
};
|
||||
},
|
||||
results(data, page) {
|
||||
if (data.length) return { results: [] };
|
||||
|
||||
self.dropdown = document.querySelector('.select2-infinite .select2-results');
|
||||
const groups = data.length ? data : data.results || [];
|
||||
const more = data.pagination ? data.pagination.more : false;
|
||||
const results = groups.filter(group => skipGroups.indexOf(group.id) === -1);
|
||||
|
||||
$select.on('select2-loaded', self.forceOverflow.bind(self));
|
||||
};
|
||||
})(this));
|
||||
}
|
||||
return {
|
||||
results,
|
||||
page,
|
||||
more,
|
||||
};
|
||||
},
|
||||
},
|
||||
// eslint-disable-next-line consistent-return
|
||||
initSelection(element, callback) {
|
||||
const id = $(element).val();
|
||||
if (id !== '') {
|
||||
return Api.group(id, callback);
|
||||
}
|
||||
},
|
||||
formatResult(object) {
|
||||
return `<div class='group-result'> <div class='group-name'>${object.full_name}</div> <div class='group-path'>${object.full_path}</div> </div>`;
|
||||
},
|
||||
formatSelection(object) {
|
||||
return object.full_name;
|
||||
},
|
||||
dropdownCssClass: 'ajax-groups-dropdown select2-infinite',
|
||||
// we do not want to escape markup since we are displaying html in results
|
||||
escapeMarkup(m) {
|
||||
return m;
|
||||
},
|
||||
});
|
||||
|
||||
GroupsSelect.prototype.formatResult = function(group) {
|
||||
var avatar;
|
||||
if (group.avatar_url) {
|
||||
avatar = group.avatar_url;
|
||||
} else {
|
||||
avatar = gon.default_avatar_url;
|
||||
}
|
||||
return "<div class='group-result'> <div class='group-name'>" + group.full_name + "</div> <div class='group-path'>" + group.full_path + "</div> </div>";
|
||||
};
|
||||
|
||||
GroupsSelect.prototype.formatSelection = function(group) {
|
||||
return group.full_name;
|
||||
};
|
||||
|
||||
GroupsSelect.prototype.forceOverflow = function (e) {
|
||||
this.dropdown.style.height = `${Math.floor(this.dropdown.scrollHeight)}px`;
|
||||
};
|
||||
|
||||
GroupsSelect.PER_PAGE = 20;
|
||||
|
||||
return GroupsSelect;
|
||||
})();
|
||||
$select.on('select2-loaded', () => {
|
||||
const dropdown = document.querySelector('.select2-infinite .select2-results');
|
||||
dropdown.style.height = `${Math.floor(dropdown.scrollHeight)}px`;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -55,7 +55,6 @@ import './gl_dropdown';
|
|||
import './gl_field_error';
|
||||
import './gl_field_errors';
|
||||
import './gl_form';
|
||||
import './groups_select';
|
||||
import './header';
|
||||
import './importer_status';
|
||||
import './issuable_index';
|
||||
|
|
|
|||
|
|
@ -149,7 +149,7 @@ feature 'Project > Members > Share with Group', :js do
|
|||
create(:group).add_owner(master)
|
||||
|
||||
visit project_settings_members_path(project)
|
||||
execute_script 'GroupsSelect.PER_PAGE = 1;'
|
||||
execute_script 'GROUP_SELECT_PER_PAGE = 1;'
|
||||
open_select2 '#link_group_id'
|
||||
end
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue