From 228c354b16ce12735a901481d6d1c62611c1b245 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 11 Jul 2024 12:20:51 +0200
Subject: [PATCH] Add types for js globals (#31586)

Adds types for `window.config` and jQuery/htmx globals, eliminating 48
`tsc` errors.
---
 .eslintrc.yaml      | 11 +++++++++--
 types.d.ts          | 14 ++++++++++++++
 web_src/js/htmx.ts  |  4 ++--
 web_src/js/types.ts | 23 +++++++++++++++++++++++
 4 files changed, 48 insertions(+), 4 deletions(-)
 create mode 100644 web_src/js/types.ts

diff --git a/.eslintrc.yaml b/.eslintrc.yaml
index 59eff85dc3..47f4eaa2d2 100644
--- a/.eslintrc.yaml
+++ b/.eslintrc.yaml
@@ -47,7 +47,6 @@ overrides:
   - files: ["web_src/**/*"]
     globals:
       __webpack_public_path__: true
-      htmx: true
       process: false # https://github.com/webpack/webpack/issues/15833
   - files: ["web_src/**/*", "docs/**/*"]
     env:
@@ -58,7 +57,15 @@ overrides:
       worker: true
     rules:
       no-restricted-globals: [2, addEventListener, blur, close, closed, confirm, defaultStatus, defaultstatus, error, event, external, find, focus, frameElement, frames, history, innerHeight, innerWidth, isFinite, isNaN, length, locationbar, menubar, moveBy, moveTo, name, onblur, onerror, onfocus, onload, onresize, onunload, open, opener, opera, outerHeight, outerWidth, pageXOffset, pageYOffset, parent, print, removeEventListener, resizeBy, resizeTo, screen, screenLeft, screenTop, screenX, screenY, scroll, scrollbars, scrollBy, scrollTo, scrollX, scrollY, status, statusbar, stop, toolbar, top]
-  - files: ["*.config.*", "**/*.d.ts"]
+  - files: ["*.config.*"]
+    rules:
+      i/no-unused-modules: [0]
+  - files: ["**/*.d.ts"]
+    rules:
+      i/no-unused-modules: [0]
+      "@typescript-eslint/consistent-type-definitions": [0]
+      "@typescript-eslint/consistent-type-imports": [0]
+  - files: ["web_src/js/types.ts"]
     rules:
       i/no-unused-modules: [0]
   - files: ["**/*.test.*", "web_src/js/test/setup.ts"]
diff --git a/types.d.ts b/types.d.ts
index 9348424371..ddfe90407f 100644
--- a/types.d.ts
+++ b/types.d.ts
@@ -2,3 +2,17 @@ declare module '*.svg' {
   const value: string;
   export default value;
 }
+
+declare let __webpack_public_path__: string;
+
+interface Window {
+  config: import('./web_src/js/types.ts').Config;
+  $: typeof import('@types/jquery'),
+  jQuery: typeof import('@types/jquery'),
+  htmx: typeof import('htmx.org'),
+}
+
+declare module 'htmx.org/dist/htmx.esm.js' {
+  const value = await import('htmx.org');
+  export default value;
+}
diff --git a/web_src/js/htmx.ts b/web_src/js/htmx.ts
index ac7e540fe4..bfc2147736 100644
--- a/web_src/js/htmx.ts
+++ b/web_src/js/htmx.ts
@@ -4,8 +4,8 @@ import {showErrorToast} from './modules/toast.ts';
 import 'idiomorph/dist/idiomorph-ext.js';
 
 // https://htmx.org/reference/#config
-htmx.config.requestClass = 'is-loading';
-htmx.config.scrollIntoViewOnBoost = false;
+window.htmx.config.requestClass = 'is-loading';
+window.htmx.config.scrollIntoViewOnBoost = false;
 
 // https://htmx.org/events/#htmx:sendError
 document.body.addEventListener('htmx:sendError', (event) => {
diff --git a/web_src/js/types.ts b/web_src/js/types.ts
new file mode 100644
index 0000000000..f69aa92768
--- /dev/null
+++ b/web_src/js/types.ts
@@ -0,0 +1,23 @@
+export type MentionValue = {
+  key: string,
+  value: string,
+  name: string,
+  fullname: string,
+  avatar: string,
+}
+
+export type Config = {
+  appUrl: string,
+  appSubUrl: string,
+  assetVersionEncoded: string,
+  assetUrlPrefix: string,
+  runModeIsProd: boolean,
+  customEmojis: Record<string, string>,
+  csrfToken: string,
+  pageData: Record<string, any>,
+  notificationSettings: Record<string, any>,
+  enableTimeTracking: boolean,
+  mentionValues?: MentionValue[],
+  mermaidMaxSourceCharacters: number,
+  i18n: Record<string, string>,
+}