gitlab-org--gitlab-foss/app/assets/javascripts/header_search/init.js

54 lines
1.6 KiB
JavaScript

import * as Sentry from '@sentry/browser';
import { HEADER_INIT_EVENTS } from './constants';
async function eventHandler(callback = () => {}) {
if (this.newHeaderSearchFeatureFlag) {
const { initHeaderSearchApp } = await import(
/* webpackChunkName: 'globalSearch' */ '~/header_search'
).catch((error) => Sentry.captureException(error));
// In case the user started searching before we bootstrapped,
// let's pass the search along.
const initialSearchValue = this.searchInputBox.value;
initHeaderSearchApp(initialSearchValue);
// this is new #search input element. We need to re-find it.
// And re-focus in it.
document.querySelector('#search').focus();
callback();
return;
}
const { default: initSearchAutocomplete } = await import(
/* webpackChunkName: 'globalSearch' */ '../search_autocomplete'
).catch((error) => Sentry.captureException(error));
const searchDropdown = initSearchAutocomplete();
searchDropdown.onSearchInputFocus();
callback();
}
function cleanEventListeners() {
HEADER_INIT_EVENTS.forEach((eventType) => {
document.querySelector('#search').removeEventListener(eventType, eventHandler);
});
}
function initHeaderSearch() {
const searchInputBox = document.querySelector('#search');
HEADER_INIT_EVENTS.forEach((eventType) => {
searchInputBox?.addEventListener(
eventType,
eventHandler.bind(
{ searchInputBox, newHeaderSearchFeatureFlag: gon?.features?.newHeaderSearch },
cleanEventListeners,
),
{ once: true },
);
});
}
export default initHeaderSearch;
export { eventHandler, cleanEventListeners };