2021-02-14 13:09:20 -05:00
|
|
|
import { GlToast } from '@gitlab/ui';
|
2020-09-11 20:08:44 -04:00
|
|
|
import Vue from 'vue';
|
2020-09-17 14:10:12 -04:00
|
|
|
import Vuex from 'vuex';
|
2021-05-11 14:10:36 -04:00
|
|
|
import { parseDataAttributes } from '~/members/utils';
|
2021-05-19 20:10:36 -04:00
|
|
|
import MembersTabs from './components/members_tabs.vue';
|
|
|
|
import { MEMBER_TYPES } from './constants';
|
2021-01-21 07:09:05 -05:00
|
|
|
import membersStore from './store';
|
2020-09-11 20:08:44 -04:00
|
|
|
|
2021-05-19 20:10:36 -04:00
|
|
|
export const initMembersApp = (el, options) => {
|
2020-09-11 20:08:44 -04:00
|
|
|
if (!el) {
|
|
|
|
return () => {};
|
|
|
|
}
|
|
|
|
|
2020-09-17 14:10:12 -04:00
|
|
|
Vue.use(Vuex);
|
2020-10-15 17:09:12 -04:00
|
|
|
Vue.use(GlToast);
|
2020-09-17 14:10:12 -04:00
|
|
|
|
2021-08-11 14:10:52 -04:00
|
|
|
const {
|
|
|
|
sourceId,
|
|
|
|
canManageMembers,
|
|
|
|
canExportMembers,
|
|
|
|
exportCsvPath,
|
|
|
|
...vuexStoreAttributes
|
|
|
|
} = parseDataAttributes(el);
|
2021-04-01 08:08:56 -04:00
|
|
|
|
2021-05-19 20:10:36 -04:00
|
|
|
const modules = Object.keys(MEMBER_TYPES).reduce((accumulator, namespace) => {
|
|
|
|
const namespacedOptions = options[namespace];
|
|
|
|
|
|
|
|
if (!namespacedOptions) {
|
|
|
|
return accumulator;
|
|
|
|
}
|
|
|
|
|
|
|
|
const {
|
|
|
|
tableFields = [],
|
|
|
|
tableAttrs = {},
|
|
|
|
tableSortableFields = [],
|
|
|
|
requestFormatter = () => {},
|
|
|
|
filteredSearchBar = { show: false },
|
|
|
|
} = namespacedOptions;
|
|
|
|
|
|
|
|
return {
|
|
|
|
...accumulator,
|
2021-04-13 17:11:25 -04:00
|
|
|
[namespace]: membersStore({
|
2021-05-19 20:10:36 -04:00
|
|
|
...vuexStoreAttributes[namespace],
|
2021-04-13 17:11:25 -04:00
|
|
|
tableFields,
|
|
|
|
tableAttrs,
|
|
|
|
tableSortableFields,
|
|
|
|
requestFormatter,
|
|
|
|
filteredSearchBar,
|
|
|
|
}),
|
2021-05-19 20:10:36 -04:00
|
|
|
};
|
|
|
|
}, {});
|
|
|
|
|
|
|
|
const store = new Vuex.Store({ modules });
|
2020-09-17 14:10:12 -04:00
|
|
|
|
2020-09-11 20:08:44 -04:00
|
|
|
return new Vue({
|
|
|
|
el,
|
2021-05-19 20:10:36 -04:00
|
|
|
components: { MembersTabs },
|
2020-09-17 14:10:12 -04:00
|
|
|
store,
|
2021-04-01 08:08:56 -04:00
|
|
|
provide: {
|
|
|
|
currentUserId: gon.current_user_id || null,
|
|
|
|
sourceId,
|
|
|
|
canManageMembers,
|
2021-08-11 14:10:52 -04:00
|
|
|
canExportMembers,
|
|
|
|
exportCsvPath,
|
2021-04-01 08:08:56 -04:00
|
|
|
},
|
2021-05-19 20:10:36 -04:00
|
|
|
render: (createElement) => createElement('members-tabs'),
|
2020-09-11 20:08:44 -04:00
|
|
|
});
|
|
|
|
};
|