[enh] theme/simple: custom router

Lay the foundation for loading scripts granularly depending on the endpoint it's
on.

Remove vendor specific prefixes as there are now managed by browserslist and
LightningCSS.

Enabled quite a few rules in Biome that don't come in recommended to better
catch issues and improve consistency.

Related:

- https://github.com/searxng/searxng/pull/5073#discussion_r2256037965
- https://github.com/searxng/searxng/pull/5073#discussion_r2256057100

1 files changed, 34 insertions, 37 deletions

diff --git a/client/simple/src/js/main/preferences.ts b/client/simple/src/js/main/preferences.ts
index 6c66018a6..fb81e6558 100644
--- a/client/simple/src/js/main/preferences.ts
+++ b/client/simple/src/js/main/preferences.ts
@@ -1,9 +1,11 @@
-import { searxng } from "./00_toolkit.ts";
+import { http, listen, settings } from "../core/toolkit.ts";
+
+let engineDescriptions: Record<string, [string, string]> | undefined;
 
 const loadEngineDescriptions = async (): Promise<void> => {
-  let engineDescriptions: Record<string, [string, string]> | null = null;
+  if (engineDescriptions) return;
   try {
-    const res = await searxng.http("GET", "engine_descriptions.json");
+    const res = await http("GET", "engine_descriptions.json");
     engineDescriptions = await res.json();
   } catch (error) {
     console.error("Error fetching engineDescriptions:", error);
@@ -12,7 +14,7 @@ const loadEngineDescriptions = async (): Promise<void> => {
 
   for (const [engine_name, [description, source]] of Object.entries(engineDescriptions)) {
     const elements = document.querySelectorAll<HTMLElement>(`[data-engine-name="${engine_name}"] .engine-description`);
-    const sourceText = ` (<i>${searxng.settings.translations?.Source}:&nbsp;${source}</i>)`;
+    const sourceText = ` (<i>${settings.translations?.Source}:&nbsp;${source}</i>)`;
 
     for (const element of elements) {
       element.innerHTML = description + sourceText;
@@ -29,43 +31,38 @@ const toggleEngines = (enable: boolean, engineToggles: NodeListOf<HTMLInputEleme
   }
 };
 
-searxng.ready(
-  () => {
-    const engineElements = document.querySelectorAll<HTMLElement>("[data-engine-name]");
-    for (const engineElement of engineElements) {
-      searxng.listen("mouseenter", engineElement, loadEngineDescriptions);
-    }
+const engineElements: NodeListOf<HTMLElement> = document.querySelectorAll<HTMLElement>("[data-engine-name]");
+for (const engineElement of engineElements) {
+  listen("mouseenter", engineElement, loadEngineDescriptions);
+}
 
-    const engineToggles = document.querySelectorAll<HTMLInputElement>(
-      "tbody input[type=checkbox][class~=checkbox-onoff]"
-    );
+const engineToggles: NodeListOf<HTMLInputElement> = document.querySelectorAll<HTMLInputElement>(
+  "tbody input[type=checkbox][class~=checkbox-onoff]"
+);
 
-    const enableAllEngines = document.querySelectorAll<HTMLElement>(".enable-all-engines");
-    for (const engine of enableAllEngines) {
-      searxng.listen("click", engine, () => toggleEngines(true, engineToggles));
-    }
+const enableAllEngines: NodeListOf<HTMLElement> = document.querySelectorAll<HTMLElement>(".enable-all-engines");
+for (const engine of enableAllEngines) {
+  listen("click", engine, () => toggleEngines(true, engineToggles));
+}
 
-    const disableAllEngines = document.querySelectorAll<HTMLElement>(".disable-all-engines");
-    for (const engine of disableAllEngines) {
-      searxng.listen("click", engine, () => toggleEngines(false, engineToggles));
-    }
+const disableAllEngines: NodeListOf<HTMLElement> = document.querySelectorAll<HTMLElement>(".disable-all-engines");
+for (const engine of disableAllEngines) {
+  listen("click", engine, () => toggleEngines(false, engineToggles));
+}
 
-    const copyHashButton = document.querySelector<HTMLElement>("#copy-hash");
-    if (copyHashButton) {
-      searxng.listen("click", copyHashButton, async (event: Event) => {
-        event.preventDefault();
+const copyHashButton: HTMLElement | null = document.querySelector<HTMLElement>("#copy-hash");
+if (copyHashButton) {
+  listen("click", copyHashButton, async (event: Event) => {
+    event.preventDefault();
 
-        const { copiedText, hash } = copyHashButton.dataset;
-        if (!copiedText || !hash) return;
+    const { copiedText, hash } = copyHashButton.dataset;
+    if (!(copiedText && hash)) return;
 
-        try {
-          await navigator.clipboard.writeText(hash);
-          copyHashButton.innerText = copiedText;
-        } catch (error) {
-          console.error("Failed to copy hash:", error);
-        }
-      });
+    try {
+      await navigator.clipboard.writeText(hash);
+      copyHashButton.innerText = copiedText;
+    } catch (error) {
+      console.error("Failed to copy hash:", error);
     }
-  },
-  { on: [searxng.endpoint === "preferences"] }
-);
+  });
+}