83 lines
2.8 KiB
JavaScript
83 lines
2.8 KiB
JavaScript
import IssuableFilteredSearchTokenKeys from 'ee_else_ce/filtered_search/issuable_filtered_search_token_keys';
|
|
import FilteredSearchManager from 'ee_else_ce/filtered_search/filtered_search_manager';
|
|
import { transformBoardConfig } from 'ee_else_ce/boards/boards_util';
|
|
import FilteredSearchContainer from '../filtered_search/container';
|
|
import boardsStore from './stores/boards_store';
|
|
import vuexstore from './stores';
|
|
import { updateHistory } from '~/lib/utils/url_utility';
|
|
|
|
export default class FilteredSearchBoards extends FilteredSearchManager {
|
|
constructor(store, updateUrl = false, cantEdit = []) {
|
|
super({
|
|
page: 'boards',
|
|
isGroupDecendent: true,
|
|
stateFiltersSelector: '.issues-state-filters',
|
|
isGroup: IS_EE,
|
|
useDefaultState: false,
|
|
filteredSearchTokenKeys: IssuableFilteredSearchTokenKeys,
|
|
});
|
|
|
|
this.store = store;
|
|
this.updateUrl = updateUrl;
|
|
|
|
// Issue boards is slightly different, we handle all the requests async
|
|
// instead or reloading the page, we just re-fire the list ajax requests
|
|
this.isHandledAsync = true;
|
|
this.cantEdit = cantEdit.filter(i => typeof i === 'string');
|
|
this.cantEditWithValue = cantEdit.filter(i => typeof i === 'object');
|
|
|
|
if (vuexstore.getters.shouldUseGraphQL && vuexstore.state.boardConfig) {
|
|
const boardConfigPath = transformBoardConfig(vuexstore.state.boardConfig);
|
|
if (boardConfigPath !== '') {
|
|
const filterPath = window.location.search ? `${window.location.search}&` : '?';
|
|
updateHistory({
|
|
url: `${filterPath}${transformBoardConfig(vuexstore.state.boardConfig)}`,
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
updateObject(path) {
|
|
const groupByParam = new URLSearchParams(window.location.search).get('group_by');
|
|
this.store.path = `${path.substr(1)}${groupByParam ? `&group_by=${groupByParam}` : ''}`;
|
|
|
|
if (vuexstore.getters.shouldUseGraphQL) {
|
|
updateHistory({
|
|
url: `?${path.substr(1)}${groupByParam ? `&group_by=${groupByParam}` : ''}`,
|
|
});
|
|
vuexstore.dispatch('performSearch');
|
|
} else if (this.updateUrl) {
|
|
boardsStore.updateFiltersUrl();
|
|
}
|
|
}
|
|
|
|
removeTokens() {
|
|
const tokens = FilteredSearchContainer.container.querySelectorAll('.js-visual-token');
|
|
|
|
// Remove all the tokens as they will be replaced by the search manager
|
|
[].forEach.call(tokens, el => {
|
|
el.parentNode.removeChild(el);
|
|
});
|
|
|
|
this.filteredSearchInput.value = '';
|
|
}
|
|
|
|
updateTokens() {
|
|
this.removeTokens();
|
|
|
|
this.loadSearchParamsFromURL();
|
|
|
|
// Get the placeholder back if search is empty
|
|
this.filteredSearchInput.dispatchEvent(new Event('input'));
|
|
}
|
|
|
|
canEdit(tokenName, tokenValue) {
|
|
if (this.cantEdit.includes(tokenName)) return false;
|
|
return (
|
|
this.cantEditWithValue.findIndex(
|
|
token => token.name === tokenName && token.value === tokenValue,
|
|
) === -1
|
|
);
|
|
}
|
|
}
|