load data async

author
Marijn Besseling <njirambem@gmail.com> · 2026-01-27 20:06 UTC
commit
34a563285bb7413c5a2978303f07026a9811d1f8
parent
446aa3c83b
tree
browse at this commit

1 file changed +26 -22

Blog/Components/Pages/Query.razor.js +26 -22

@@ -1,4 +1,4 @@
1 -import {getById, writeError, h, span, addClass, div} from '/common.module.js'
1 +import {getById, writeError, writeDebug, h, span, addClass, div} from '/common.module.js'
2 2 import {DACTAL} from "/dactal.js"
3 3
4 4 const enterEvent = new KeyboardEvent('keydown', {
@@ -16,36 +16,40 @@ export async function onLoad() {
16 16 const input = getById("input")
17 17 dactal = new DACTAL()
18 18
19 - const brp = await fetch("/brp.json")
20 - const cdata = await brp.json()
21 -
22 - dactal.data = {
23 - personen: cdata
24 - }
25 -
19 + fetch("/brp.json").then(async res => {
20 + const cdata = await res.json()
21 + dactal.load(cdata, "personen")
22 + writeDebug("Loaded brp data")
23 + await runQuery(input.value)
24 + })
25 +
26 26 input.onkeydown = async (e) => {
27 27 if (e.key === "Enter" && !e.shiftKey) {
28 28 e.preventDefault()
29 - const results = getById("results")
30 -
31 - try {
32 - let result = await dactal.query(input.value)
33 -
34 - results.replaceChildren(renderValue(result.slice(0, 100)))
35 -
36 - if (result.length > 100) {
37 - results.appendChild(div(span(`Not showing ${result.length - 100} more results.`)))
38 - }
39 - } catch (e) {
40 - writeError(e.message)
41 - results.replaceChildren()
42 - }
29 + await runQuery(input.value)
43 30 }
44 31 }
45 32
46 33 input.dispatchEvent(enterEvent)
47 34 }
48 35
36 +async function runQuery(query) {
37 + const results = getById("results")
38 +
39 + try {
40 + let result = await dactal.query(query)
41 +
42 + results.replaceChildren(renderValue(result.slice(0, 100)))
43 +
44 + if (result.length > 100) {
45 + results.appendChild(div(span(`Not showing ${result.length - 100} more results.`)))
46 + }
47 + } catch (e) {
48 + writeError(e.message)
49 + results.replaceChildren()
50 + }
51 +}
52 +
49 53 function renderValue(obj) {
50 54 if (Array.isArray(obj)) {
51 55 return h("ol",