mirrors/homebox
1
0
Fork 1
mirror of https://github.com/hay-kot/homebox.git synced 2025-08-02 15:50:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

offload search to lunr.js

Browse source
This commit is contained in:
Hayden 2024-02-29 13:19:06 -06:00
parent 4c9ddac395
commit 39c979b30a
No known key found for this signature in database
GPG key ID: 17CF79474E257545
3 changed files with 37 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

50
frontend/components/Form/Autocomplete2.vue
View file

@ -61,6 +61,7 @@
</template>
<script setup lang="ts">
import lunr from "lunr";
import {
Combobox,
ComboboxInput,
@ -126,42 +127,33 @@
return "";
}
const computedItems = computed<ComboItem[]>(() => {
const list: ComboItem[] = [];
const index = lunr(function () {
this.ref("id");
this.field("display");
for (let i = 0; i < props.items.length; i++) {
const item = props.items[i];
const display = extractDisplay(item);
this.add({ id: i, display });
}
});
const out: Partial<ComboItem> = {
id: i,
value: item,
};
watchEffect(() => {
if (props.modelValue) {
search.value = extractDisplay(props.modelValue);
}
});
switch (typeof item) {
case "string":
out.display = item;
break;
case "object":
// @ts-ignore - up to the user to provide a valid display key
out.display = item[props.display] as string;
break;
default:
out.display = "";
break;
}
const computedItems = computed<ComboItem[]>(() => {
const list: ComboItem[] = [];
if (search.value && out.display) {
const foldSearch = search.value.toLowerCase();
const foldDisplay = out.display.toLowerCase();
const matches = index.search("*" + search.value + "*");
if (foldDisplay.startsWith(foldSearch)) {
list.push(out as ComboItem);
}
continue;
}
list.push(out as ComboItem);
for (let i = 0; i < matches.length; i++) {
const match = matches[i];
const item = props.items[parseInt(match.ref)];
const display = extractDisplay(item);
list.push({ id: i, display, value: item });
}
return list;

2
frontend/package.json
View file

@ -41,6 +41,7 @@
"@tailwindcss/aspect-ratio": "^0.4.0",
"@tailwindcss/forms": "^0.5.2",
"@tailwindcss/typography": "^0.5.4",
"@types/lunr": "^2.3.7",
"@vuepic/vue-datepicker": "^8.1.1",
"@vueuse/nuxt": "^10.0.0",
"@vueuse/router": "^10.0.0",
@ -50,6 +51,7 @@
"dompurify": "^3.0.0",
"h3": "^1.7.1",
"http-proxy": "^1.18.1",
"lunr": "^2.3.9",
"markdown-it": "^14.0.0",
"pinia": "^2.0.21",
"postcss": "^8.4.16",

14
frontend/pnpm-lock.yaml generated
View file

@ -26,6 +26,9 @@ dependencies:
'@tailwindcss/typography':
specifier: ^0.5.4
version: 0.5.8(tailwindcss@3.2.4)
'@types/lunr':
specifier: ^2.3.7
version: 2.3.7
'@vuepic/vue-datepicker':
specifier: ^8.1.1
version: 8.1.1(vue@3.3.4)
@ -53,6 +56,9 @@ dependencies:
http-proxy:
specifier: ^1.18.1
version: 1.18.1
lunr:
specifier: ^2.3.9
version: 2.3.9
markdown-it:
specifier: ^14.0.0
version: 14.0.0
@ -2797,6 +2803,10 @@ packages:
resolution: {integrity: sha512-HZQYqbiFVWufzCwexrvh694SOim8z2d+xJl5UNamcvQFejLY/2YUtzXHYi3cHdI7PMlS8ejH2slRAOJQ32aNbA==}
dev: true
/@types/lunr@2.3.7:
resolution: {integrity: sha512-Tb/kUm38e8gmjahQzdCKhbdsvQ9/ppzHFfsJ0dMs3ckqQsRj+P5IkSAwFTBrBxdyr3E/LoMUUrZngjDYAjiE3A==}
dev: false
/@types/markdown-it@13.0.2:
resolution: {integrity: sha512-Tla7hH9oeXHOlJyBFdoqV61xWE9FZf/y2g+gFVwQ2vE1/eBzjUno5JCd3Hdb5oATve5OF6xNjZ/4VIZhVVx+hA==}
dependencies:
@ -6586,6 +6596,10 @@ packages:
dependencies:
yallist: 4.0.0
/lunr@2.3.9:
resolution: {integrity: sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow==}
dev: false
/magic-string-ast@0.1.2:
resolution: {integrity: sha512-P53AZrzq7hclCU6HWj88xNZHmP15DKjMmK/vBytO1qnpYP3ul4IEZlyCE0aU3JRnmgWmZPmoTKj4Bls7v0pMyA==}
engines: {node: '>=14.19.0'}