@flowselections/floriday-authenticatie-module 1.0.79 → 1.0.83

package/dist-lib/components/floriday/FlorydayApiLogPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FlorydayApiLogPage.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/FlorydayApiLogPage.tsx"],"names":[],"mappings":"AAgEA,wBAAgB,kBAAkB,gCAuZjC"}
+{"version":3,"file":"FlorydayApiLogPage.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/FlorydayApiLogPage.tsx"],"names":[],"mappings":"AA0FA,wBAAgB,kBAAkB,gCAyZjC"}

package/dist-lib/components/floriday/FlorydayApiLogPage.js

@@ -32,6 +32,32 @@ function describeKind(row) {
     }
 }
 const POLL_KINDS = new Set(["poll-check", "poll-empty", "poll-changed"]);
+/** Nederlandse naam voor de kolom Soort. */
+const SOORT_NL = {
+    "sales-order": "Verkooporder",
+    "fulfillment-order": "Levering",
+    "delivery-order": "Leveropdracht",
+    "trade-item": "Artikel",
+    "supply-line": "Aanbod",
+    "base-supply": "Weekaanbod",
+    "clock-supply": "Klokaanbod",
+    customer: "Klant",
+    warehouse: "Magazijn",
+    "delivery-location": "Afleverlocatie",
+    connection: "Connectie",
+    "price-group": "Prijsgroep",
+    "catalog-price": "Catalogusprijs",
+    trip: "Rit",
+    packing: "Verpakking",
+    "logistic-label": "Verzendlabel",
+    "auction-letter": "Veilingbrief",
+    "customer-sticker": "Sticker",
+};
+function soortLabel(type, templateLabel) {
+    if (type && SOORT_NL[type])
+        return SOORT_NL[type];
+    return templateLabel ?? type ?? "—";
+}
 export function FlorydayApiLogPage() {
     const [direction, setDirection] = useState("all");
     const [onlyFailed, setOnlyFailed] = useState(false);
@@ -122,7 +148,7 @@ export function FlorydayApiLogPage() {
                                 }, children: "Alleen wijzigingen" }), _jsx("input", { className: "h-9 min-w-[16rem] flex-1 rounded-md border border-input bg-background px-3 text-sm", placeholder: "Zoek op Floriday-referentie, ons kenmerk of pad", value: search, onChange: (e) => {
                                     setSearch(e.target.value);
                                     setPage(0);
-                                } }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => logQuery.refetch(), children: "Vernieuwen" })] }), _jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "text-left text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "py-2 pr-3", children: "Tijd" }), _jsx("th", { className: "py-2 pr-3", children: "Richting" }), _jsx("th", { className: "py-2 pr-3", children: "Aard" }), _jsx("th", { className: "py-2 pr-3", children: "Soort" }), _jsx("th", { className: "py-2 pr-3", children: "Actie" }), _jsx("th", { className: "py-2 pr-3", children: "Status" }), _jsx("th", { className: "py-2 pr-3", children: "Floriday-referentie" }), _jsx("th", { className: "py-2 pr-3", children: "Ons item" })] }) }), _jsxs("tbody", { children: [rows.map((row) => {
+                                } }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => logQuery.refetch(), children: "Vernieuwen" })] }), _jsx("div", { className: "w-full", children: _jsxs("table", { className: "w-full table-fixed text-sm [&_td]:break-words [&_td]:[overflow-wrap:anywhere]", children: [_jsxs("colgroup", { children: [_jsx("col", { className: "w-[9%]" }), _jsx("col", { className: "w-[9%]" }), _jsx("col", { className: "w-[13%]" }), _jsx("col", { className: "w-[10%]" }), _jsx("col", { className: "w-[25%]" }), _jsx("col", { className: "w-[10%]" }), _jsx("col", { className: "w-[14%]" }), _jsx("col", { className: "w-[10%]" })] }), _jsx("thead", { className: "text-left text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "py-2 pr-3", children: "Tijd" }), _jsx("th", { className: "py-2 pr-3", children: "Richting" }), _jsx("th", { className: "py-2 pr-3", children: "Aard" }), _jsx("th", { className: "py-2 pr-3", children: "Soort" }), _jsx("th", { className: "py-2 pr-3", children: "Actie" }), _jsx("th", { className: "py-2 pr-3", children: "Status" }), _jsx("th", { className: "py-2 pr-3", children: "Floriday-referentie" }), _jsx("th", { className: "py-2 pr-3", children: "Ons item" })] }) }), _jsxs("tbody", { children: [rows.map((row) => {
                                             const tpl = row.resource_type ? templateByType.get(row.resource_type) : undefined;
                                             // Een ophaalronde zonder herkenbaar item blijft een "routineronde";
                                             // zodra we er één order/artikel uit konden halen tonen we die gewoon.
@@ -137,10 +163,10 @@ export function FlorydayApiLogPage() {
                                             const floridayHref = !isPoll && tpl?.floriday_url_template && row.floriday_id
                                                 ? fillTemplate(tpl.floriday_url_template, row)
                                                 : null;
-                                            return (_jsxs("tr", { className: "border-t border-border align-top", children: [_jsx("td", { className: "py-2 pr-3 whitespace-nowrap", children: new Date(row.created_at).toLocaleString("nl-NL") }), _jsx("td", { className: "py-2 pr-3", children: _jsx(Badge, { variant: row.direction === "outbound" ? "default" : "secondary", children: row.direction === "outbound" ? "Versturen" : "Ophalen" }) }), _jsxs("td", { className: "py-2 pr-3", children: [_jsx("div", { children: kind.label }), kind.hint ? (_jsx("div", { className: "text-xs text-muted-foreground", children: kind.hint })) : null] }), _jsx("td", { className: "py-2 pr-3", children: tpl?.label ?? row.resource_type ?? "—" }), _jsxs("td", { className: "py-2 pr-3", children: [_jsx("div", { children: row.action ?? `${row.method} ${row.path}` }), row.cursor_from != null ? (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["vanaf volgnummer ", row.cursor_from] })) : null, row.error ? _jsx(FullErrorMessage, { error: row.error, response: row.response, createdAt: row.created_at }) : null] }), _jsx("td", { className: "py-2 pr-3", children: _jsxs(Badge, { variant: row.ok ? "secondary" : "destructive", children: [row.ok ? "Gelukt" : "Mislukt", " ", row.http_status || ""] }) }), _jsx("td", { className: "py-2 pr-3", children: isPoll ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "Geen los item (routineronde)" })) : floridayShown ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-xs", title: row.floriday_id ?? undefined, children: floridayShown }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => {
+                                            return (_jsxs("tr", { className: "border-t border-border align-top", children: [_jsx("td", { className: "py-2 pr-3", children: new Date(row.created_at).toLocaleString("nl-NL") }), _jsx("td", { className: "py-2 pr-3", children: _jsx(Badge, { variant: row.direction === "outbound" ? "default" : "secondary", children: row.direction === "outbound" ? "Versturen" : "Ophalen" }) }), _jsxs("td", { className: "py-2 pr-3", children: [_jsx("div", { children: kind.label }), kind.hint ? (_jsx("div", { className: "text-xs text-muted-foreground", children: kind.hint })) : null] }), _jsx("td", { className: "py-2 pr-3", children: soortLabel(row.resource_type, tpl?.label) }), _jsxs("td", { className: "py-2 pr-3", children: [_jsx("div", { children: row.action ?? `${row.method} ${row.path}` }), row.cursor_from != null ? (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["vanaf volgnummer ", row.cursor_from] })) : null, row.error ? _jsx(FullErrorMessage, { error: row.error, response: row.response, createdAt: row.created_at }) : null] }), _jsx("td", { className: "py-2 pr-3", children: _jsxs(Badge, { variant: row.ok ? "secondary" : "destructive", children: [row.ok ? "Gelukt" : "Mislukt", " ", row.http_status || ""] }) }), _jsx("td", { className: "py-2 pr-3", children: isPoll ? null : floridayShown ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-xs", title: row.floriday_id ?? undefined, children: floridayShown }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => {
                                                                         navigator.clipboard?.writeText(floridayShown);
                                                                         toast.success("Referentie gekopieerd");
-                                                                    }, children: "Kopieer" }), floridayHref ? (_jsx("a", { className: "text-xs underline", href: floridayHref, target: "_blank", rel: "noreferrer", children: "Floriday" })) : null] })) : ("—") }), _jsx("td", { className: "py-2 pr-3", children: isPoll ? ("—") : localHref ? (_jsx("a", { href: localHref, className: "text-xs underline", title: localShown ?? undefined, children: localShown ?? "Openen" })) : localShown ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-xs", title: row.local_id ?? undefined, children: localShown }), !tpl?.local_url_template ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "(geen adres ingesteld)" })) : null] })) : tpl?.local_url_template ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "Nog niet in onze cache" })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: "Geen adres ingesteld" })) })] }, row.id));
+                                                                    }, children: "Kopieer" }), floridayHref ? (_jsx("a", { className: "text-xs underline", href: floridayHref, target: "_blank", rel: "noreferrer", children: "Floriday" })) : null] })) : ("—") }), _jsx("td", { className: "py-2 pr-3", children: isPoll ? ("—") : localHref ? (_jsx("a", { href: localHref, className: "text-xs underline", title: localShown ?? undefined, children: localShown ?? "Openen" })) : localShown ? (_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "font-mono text-xs", title: row.local_id ?? undefined, children: localShown }) })) : tpl?.local_url_template ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "Nog niet in onze cache" })) : (_jsx("span", { className: "text-xs text-muted-foreground", title: "Geen pagina in deze module voor dit type", children: "\u2014" })) })] }, row.id));
                                         }), rows.length === 0 ? (_jsx("tr", { children: _jsx("td", { colSpan: 8, className: "py-6 text-center text-muted-foreground", children: logQuery.isLoading ? "Bezig met laden…" : "Nog geen berichten gevonden." }) })) : null] })] }) }), _jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [_jsxs("span", { children: [total, " berichten \u2014 pagina ", page + 1] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: "outline", disabled: page === 0, onClick: () => setPage((p) => Math.max(0, p - 1)), children: "Vorige" }), _jsx(Button, { size: "sm", variant: "outline", disabled: (page + 1) * PAGE_SIZE >= total, onClick: () => setPage((p) => p + 1), children: "Volgende" })] })] })] }), _jsxs(Card, { className: "p-4 space-y-3", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Doorklik-adressen" }), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["Stel per soort in waar een regel naartoe moet linken. Gebruik", " ", _jsx("code", { children: "{id}" }), " voor ons kenmerk en ", _jsx("code", { children: "{floridayId}" }), " voor de Floriday-referentie. Bijvoorbeeld", " ", _jsxs("code", { children: ["/floriday-verkoop/verkooporders/", "{id}"] }), "."] })] }), _jsx("div", { className: "space-y-2", children: templates.map((t) => (_jsx(TemplateRow, { template: t, onSave: (local, floriday) => saveTemplateMutation.mutate({
                                 resourceType: t.resource_type,
                                 label: t.label,

package/dist-lib/components/floriday/FlorydayWebhooksCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FlorydayWebhooksCard.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/FlorydayWebhooksCard.tsx"],"names":[],"mappings":"AAsBA,wBAAgB,oBAAoB,gCAyFnC"}
+{"version":3,"file":"FlorydayWebhooksCard.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/FlorydayWebhooksCard.tsx"],"names":[],"mappings":"AAwBA,wBAAgB,oBAAoB,gCA+InC"}

package/dist-lib/components/floriday/FlorydayWebhooksCard.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useServerFn } from "@tanstack/react-start";
 import { useState } from "react";
-import { getFloridayWebhookStatus, subscribeFloridayWebhook, unsubscribeFloridayWebhook, } from "../../lib/floriday-webhooks.functions.js";
+import { getFloridayWebhookStatus, listStaleWebhookCallbacks, unsubscribeStaleWebhookCallback, subscribeFloridayWebhook, unsubscribeFloridayWebhook, } from "../../lib/floriday-webhooks.functions.js";
 function badge(s, isActiveConn) {
     if (!isActiveConn)
         return { text: "Geen actieve koppeling", cls: "bg-muted text-muted-foreground" };
@@ -23,6 +23,18 @@ export function FlorydayWebhooksCard() {
     const subscribe = useServerFn(subscribeFloridayWebhook);
     const unsubscribe = useServerFn(unsubscribeFloridayWebhook);
     const [message, setMessage] = useState(null);
+    const listStale = useServerFn(listStaleWebhookCallbacks);
+    const unsubStale = useServerFn(unsubscribeStaleWebhookCallback);
+    const staleQ = useQuery({ queryKey: ["floriday-webhooks-stale"], queryFn: () => listStale(), retry: false });
+    const staleMut = useMutation({
+        mutationFn: (key) => unsubStale({ data: { key } }),
+        onSuccess: (r) => {
+            setMessage(r?.results
+                ? `Afmelden: ${r.results.map((x) => `${x.environment === "live" ? "productie" : "test"} ${x.status}`).join(", ")}`
+                : r?.error ?? "Mislukt");
+            qc.invalidateQueries({ queryKey: ["floriday-webhooks-stale"] });
+        },
+    });
     const q = useQuery({ queryKey: ["floriday-webhooks"], queryFn: () => getStatus(), refetchInterval: 30000 });
     const done = (r) => {
         setMessage(r?.ok ? "Gelukt." : r?.error ?? "Mislukt");
@@ -31,6 +43,7 @@ export function FlorydayWebhooksCard() {
     const sub = useMutation({ mutationFn: (environment) => subscribe({ data: { environment } }), onSuccess: done });
     const unsub = useMutation({ mutationFn: (environment) => unsubscribe({ data: { environment } }), onSuccess: done });
     const subs = (q.data?.subscriptions ?? []);
+    const reasons = q.data?.rejectedByReason ?? {};
     const counts = q.data?.last24h ?? {};
     const activeEnvs = (q.data?.activeEnvironments ?? []);
     const envs = ["staging", "live"];
@@ -43,5 +56,10 @@ export function FlorydayWebhooksCard() {
                                             catch {
                                                 return "—";
                                             } })()] })), s?.status === "error" && (_jsxs("div", { className: "text-destructive text-xs mt-1 space-y-0.5", children: [_jsx("div", { children: s.last_error }), s.next_attempt_at && _jsxs("div", { children: ["Volgende automatische poging: ", fmt(s.next_attempt_at)] }), s.last_error_kind === "scope" && (_jsx("div", { children: "Dit staat op de lijst met vragen voor de beheerder van Central Auth." }))] }))] }), _jsxs("div", { className: "flex gap-2 shrink-0", children: [_jsx("button", { className: "rounded-md border px-3 py-1 text-xs hover:bg-accent disabled:opacity-50", disabled: sub.isPending, onClick: () => sub.mutate(env), children: s ? "Opnieuw aanmelden" : "Aanmelden" }), s && (_jsx("button", { className: "rounded-md border px-3 py-1 text-xs hover:bg-accent disabled:opacity-50", disabled: unsub.isPending, onClick: () => unsub.mutate(env), children: "Afmelden" }))] })] }, env));
-                }) }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Laatste 24 uur: ", counts.processed ?? 0, " verwerkt \u00B7 ", counts.duplicate ?? 0, " dubbel \u00B7", " ", counts.ignored ?? 0, " genegeerd \u00B7 ", (counts.failed ?? 0) + (counts.failed_retry ?? 0), " mislukt \u00B7", " ", counts.rejected ?? 0, " geweigerd"] }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Laatste automatische controle: ", fmt(q.data?.lastEnsureAt)] }), message && _jsx("p", { className: "text-xs", children: message })] }));
+                }) }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Laatste 24 uur: ", counts.processed ?? 0, " verwerkt \u00B7 ", counts.duplicate ?? 0, " dubbel \u00B7", " ", counts.ignored ?? 0, " genegeerd \u00B7 ", (counts.failed ?? 0) + (counts.failed_retry ?? 0), " mislukt \u00B7", " ", counts.rejected ?? 0, " geweigerd"] }), Object.keys(reasons).length > 0 && (_jsx("ul", { className: "text-xs text-muted-foreground space-y-0.5", children: Object.entries(reasons).map(([r, n]) => (_jsxs("li", { children: [String(n), " geweigerd: ", r, r === "Onbekend callback-token" ? " (waarschijnlijk een oude aanmelding bij Floriday)" : ""] }, r))) })), Array.isArray(staleQ.data) && staleQ.data.length > 0 && (_jsxs("div", { className: "space-y-2", children: [_jsx("h3", { className: "text-sm font-medium", children: "Oude aanmeldingen" }), _jsx("ul", { className: "space-y-2", children: staleQ.data.map((s) => (_jsxs("li", { className: "flex items-start justify-between gap-4 text-xs", children: [_jsxs("div", { children: [_jsx("div", { className: "font-mono break-all", children: s.callbackUrlMasked }), _jsxs("div", { className: "text-muted-foreground", children: [s.count, " meldingen sinds ", fmt(s.firstAt), " \u00B7 laatste ", fmt(s.lastAt), s.unsubscribe
+                                                    ? ` · afgemeld ${fmt(s.unsubscribe.at)} (${(s.unsubscribe.results ?? []).map((x) => x.status).join(", ")})`
+                                                    : ""] })] }), _jsx("button", { className: "shrink-0 rounded-md border px-3 py-1 hover:bg-accent disabled:opacity-50", disabled: staleMut.isPending, onClick: () => {
+                                        if (window.confirm(`Oude aanmelding afmelden bij Floriday?\n${s.callbackUrlMasked}`))
+                                            staleMut.mutate(s.key);
+                                    }, children: "Oude aanmelding afmelden" })] }, s.key))) })] })), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Laatste automatische controle: ", fmt(q.data?.lastEnsureAt)] }), message && _jsx("p", { className: "text-xs", children: message })] }));
 }

package/dist-lib/components/floriday/TokenHealthCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenHealthCard.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/TokenHealthCard.tsx"],"names":[],"mappings":"AA2DA,wBAAgB,eAAe,gCAqL9B"}
+{"version":3,"file":"TokenHealthCard.d.ts","sourceRoot":"","sources":["../../../src/components/floriday/TokenHealthCard.tsx"],"names":[],"mappings":"AA2DA,wBAAgB,eAAe,gCAoL9B"}

package/dist-lib/components/floriday/TokenHealthCard.js

@@ -87,7 +87,7 @@ export function TokenHealthCard() {
     const jobs = (cronStatus.data?.jobs ?? []);
     const tokenJob = jobs.find((j) => j.jobname === "refresh-floriday-tokens-hourly");
     const cronUrlMismatch = Boolean(expectedBase && tokenJob?.url && !tokenJob.url.startsWith(expectedBase));
-    return (_jsxs("div", { className: "rounded-lg border p-4 space-y-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h2", { className: "font-semibold", children: "Token gezondheid" }), _jsx("p", { className: "text-xs text-muted-foreground mt-1", children: "De achtergrond-cron vernieuwt tokens elke 15 minuten. Bij elke API-aanroep wordt bovendien automatisch geretried met een vers token bij een 401." })] }), lastOk && (_jsxs("span", { className: "text-xs text-muted-foreground shrink-0", children: ["Laatste succesvolle refresh:", " ", new Date(lastOk.attempted_at).toLocaleString("nl-NL")] }))] }), conns.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen actieve koppelingen." })) : (_jsx("ul", { className: "space-y-2", children: conns.map((c) => {
+    return (_jsxs("div", { className: "rounded-lg border p-4 space-y-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h2", { className: "font-semibold", children: "Token gezondheid" }), _jsx("p", { className: "text-xs text-muted-foreground mt-1", children: "De koppeling wordt elke 15 minuten automatisch vernieuwd." })] }), lastOk && (_jsxs("span", { className: "text-xs text-muted-foreground shrink-0", children: ["Laatste succesvolle refresh:", " ", new Date(lastOk.attempted_at).toLocaleString("nl-NL")] }))] }), conns.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen actieve koppelingen." })) : (_jsx("ul", { className: "space-y-2", children: conns.map((c) => {
                     const st = statusFromLog(recent.filter((r) => r.connection_id === c.id));
                     return (_jsxs("li", { className: "flex items-center justify-between gap-3 text-sm", children: [_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx("span", { className: `inline-block h-2.5 w-2.5 rounded-full shrink-0 ${st.color}` }), _jsx("span", { className: "font-medium capitalize", children: c.environment }), _jsx("span", { className: st.bad ? "text-red-600" : "text-muted-foreground", title: st.error ?? undefined, children: st.label })] }), _jsx("button", { type: "button", onClick: () => refresh.mutate(c.environment), disabled: busyEnv === c.environment, className: "rounded-md border px-2.5 py-1 text-xs hover:bg-muted disabled:opacity-50 shrink-0", children: busyEnv === c.environment ? "Vernieuwen…" : "Nu vernieuwen" })] }, c.id));
                 }) })), _jsxs("div", { className: "border-t pt-3 space-y-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("h3", { className: "text-sm font-medium", children: "Geplande cron-taken" }), _jsx("button", { type: "button", onClick: () => reinstallMutation.mutate(), disabled: reinstallMutation.isPending, className: "rounded-md border px-2.5 py-1 text-xs hover:bg-muted disabled:opacity-50", children: reinstallMutation.isPending ? "Installeren…" : "Cron opnieuw installeren" })] }), cronStatus.isLoading ? (_jsx("p", { className: "text-xs text-muted-foreground", children: "Status laden\u2026" })) : jobs.length === 0 ? (_jsx("p", { className: "text-xs text-amber-600", children: "Geen Floriday-cron jobs gevonden. Klik \"Cron opnieuw installeren\" om ze in te plannen." })) : (_jsx("ul", { className: "space-y-1 text-xs", children: jobs.map((j) => {