Blog/Components/Pages/Query.razor.js 2.5 K · 90 lines · raw · history

1 import {getById, writeError, writeDebug, h, t} from '/common.module.js'
2 import {DACTAL} from "/dactal.js"
3 import {query as jsonql} from "/jsonql-js/index.js"
4
5 const enterEvent = new KeyboardEvent('keydown', {
6 key: 'Enter',
7 code: 'Enter',
8 keyCode: 13,
9 which: 13,
10 bubbles: true,
11 cancelable: true
12 });
13
14 const defaultQueries = {
15 jsonql: `SELECT *
16 FROM personen AS p
17 WHERE 'EenhoofdigOuderlijkGezag' IN p.gezag[].type`,
18 dactal: "personen.gezag:type=EenhoofdigOuderlijkGezag",
19 }
20
21 let dactal
22
23 export async function onLoad() {
24 const input = getById("input")
25 const lang = getById("lang")
26 dactal = new DACTAL()
27
28 fetch("/brp.json").then(async res => {
29 const cdata = await res.json()
30 dactal.load(cdata, "personen")
31 writeDebug("Loaded brp data")
32 await runQuery(input.value, lang.value)
33 })
34
35 input.onkeydown = async (e) => {
36 if (e.key === "Enter" && !e.shiftKey) {
37 e.preventDefault()
38 await runQuery(input.value, lang.value)
39 }
40 }
41
42 lang.onchange = async () => {
43 input.value = defaultQueries[lang.value]
44 await runQuery(input.value, lang.value)
45 }
46
47 input.dispatchEvent(enterEvent)
48 }
49
50 async function runQuery(query, lang) {
51 const results = getById("results")
52
53 try {
54 let result = lang === "jsonql"
55 ? jsonql(query, {personen: dactal.data.personen ?? []})
56 : await dactal.query(query)
57
58 results.replaceChildren(renderValue(result.slice(0, 100)))
59
60 if (result.length > 100) {
61 results.appendChild(h("div", [h("span", `Not showing ${result.length - 100} more results.`)]))
62 }
63 } catch (e) {
64 writeError(e.message)
65 results.replaceChildren()
66 }
67 }
68
69 function renderValue(obj) {
70 if (Array.isArray(obj)) {
71 return h("ol",
72 obj.map((item) => h("li", [renderValue(item)]))
73 )
74 } else if (typeof obj === "object") {
75 return h("ul",
76 Object.entries(obj).map(([name, item]) =>
77 h("li", {class: "dash"},
78 [
79 h("span", {class: "name"}, name),
80 t(" "),
81 renderValue(item)
82 ])))
83 } else if (typeof obj === "boolean") {
84 return h("span", {class: obj ? "json-true" : "json-false"})
85 } else if (typeof obj === "number") {
86 return h("span", {class: "json-number"}, obj.toString())
87 } else if (typeof obj === "string") {
88 return h("span", obj)
89 }
90 }