Refactor search-box module to await-style chooseFromApi

Move web_src/js/modules/fomantic/search.ts to web_src/js/modules/search.ts
(no Fomantic dependency anymore). Replace the imperative
initSearchBox(el, opts) with chooseFromApi(el, url, parse) that returns
a Promise<SearchResult> resolving with the user's chosen item; callers
loop with `while (box.isConnected) { const pick = await ...; ... }` and
own writing back to whatever input/state they manage.

Cleanup is via a single AbortController whose signal is passed to all
listeners; the in-flight fetch has its own controller so a new keystroke
can cancel just the request without tearing down listeners.

Co-Authored-By: Claude (Opus 4.7) <noreply@anthropic.com>
This commit is contained in:
silverwindandClaude committed 2026-04-26 21:05:36 +02:00
1 parent cfe9e70e3e
commit 2ecee0bb0a
5 files changed
+164 -189

No files matched your search

+12 -18
View File
@@ -1,26 +1,20 @@
import {initSearchBox} from '../../modules/fomantic/search.ts';
import {htmlEscape} from '../../utils/html.ts';
import {chooseFromApi} from '../../modules/search.ts';
const {appSubUrl} = window.config;
export function initCompSearchRepoBox(el: HTMLElement) {
export async function initCompSearchRepoBox(el: HTMLElement) {
const uid = el.getAttribute('data-uid');
const exclusive = el.getAttribute('data-exclusive');
let url = `${appSubUrl}/repo/search?q={query}&uid=${uid}`;
if (exclusive === 'true') {
url += `&exclusive=true`;
if (exclusive === 'true') url += `&exclusive=true`;
const input = el.querySelector<HTMLInputElement>('input.prompt')!;
while (el.isConnected) {
const pick = await chooseFromApi(el, url, (response: any) => response.data.map((item: any) => ({
title: item.repository.full_name.split('/')[1],
description: item.repository.full_name,
})));
input.value = pick.title;
input.dispatchEvent(new Event('change', {bubbles: true}));
}
initSearchBox(el, {
apiUrl: url,
onResponse(response: any) {
const items = [];
for (const item of response.data) {
items.push({
title: htmlEscape(item.repository.full_name.split('/')[1]),
description: htmlEscape(item.repository.full_name),
});
}
return {results: items};
},
});
}