tokono.ma
1import { DiffuseElement } from "@common/element.js";
2import { signal } from "@common/signal.js";
3import { listen } from "@common/worker.js";
4
5/**
6 * @import {ProxiedActions} from "@common/worker.d.ts";
7 * @import {Actions, State} from "./types.d.ts"
8 */
9
10////////////////////////////////////////////
11// ELEMENT
12////////////////////////////////////////////
13
14/**
15 * @implements {ProxiedActions<Actions>}
16 */
17class SearchProcessor extends DiffuseElement {
18 static NAME = "diffuse/processor/search";
19 static WORKER_URL = "components/processor/search/worker.js";
20
21 constructor() {
22 super();
23
24 /** @type {ProxiedActions<Actions & State>} */
25 this.proxy = this.workerProxy();
26
27 this.search = this.proxy.search;
28 this.supply = this.proxy.supply;
29 }
30
31 // SIGNALS
32
33 #cacheId = signal(/** @type {string | undefined} */ (undefined));
34
35 // STATE
36
37 cacheId = this.#cacheId.get;
38
39 // LIFECYCLE
40
41 /**
42 * @override
43 */
44 connectedCallback() {
45 super.connectedCallback();
46
47 // Sync data with worker
48 const link = this.workerLink();
49
50 // Listen for remote data changes
51 listen("cacheId", this.#cacheId.set, link);
52
53 // Fetch current data state
54 this.proxy.cacheId().then(this.#cacheId.set);
55 }
56}
57
58export default SearchProcessor;
59
60////////////////////////////////////////////
61// REGISTER
62////////////////////////////////////////////
63
64export const CLASS = SearchProcessor;
65export const NAME = "dp-search";
66
67customElements.define(NAME, SearchProcessor);