Merge pull request #103 from koloml/bugfix/fixing-type-errors

Fixed type errors reported by the TypeScript

src/app.d.ts

@@ -4,6 +4,9 @@ import MaintenanceProfile from "$entities/MaintenanceProfile";
 import type TagGroup from "$entities/TagGroup";
 
 declare global {
+  // Helper type to not deal with differences between the setTimeout of @types/node and usual web browser's type.
+  type Timeout = ReturnType<typeof setTimeout>;
+
   namespace App {
     // interface Error {}
     // interface Locals {}

src/content/header.ts

@@ -1,6 +1,6 @@
 import { initializeSiteHeader } from "$lib/components/SiteHeaderWrapper";
 
-const siteHeader = document.querySelector('.header');
+const siteHeader = document.querySelector<HTMLElement>('.header');
 
 if (siteHeader) {
   initializeSiteHeader(siteHeader);

src/content/listing.ts

@@ -4,8 +4,7 @@ import { calculateMediaBoxesPositions, initializeMediaBox } from "$lib/component
 import { createMaintenanceStatusIcon } from "$lib/components/MaintenanceStatusIcon";
 import { createImageShowFullscreenButton } from "$lib/components/ImageShowFullscreenButton";
 
-/** @type {NodeListOf<HTMLElement>} */
-const mediaBoxes = document.querySelectorAll('.media-box');
+const mediaBoxes = document.querySelectorAll<HTMLElement>('.media-box');
 
 mediaBoxes.forEach(mediaBoxElement => {
   initializeMediaBox(mediaBoxElement, [

src/content/tags.ts

@@ -1,6 +1,6 @@
 import { watchTagDropdownsInTagsEditor, wrapTagDropdown } from "$lib/components/TagDropdownWrapper";
 
-for (let tagDropdownElement of document.querySelectorAll('.tag.dropdown')) {
+for (let tagDropdownElement of document.querySelectorAll<HTMLElement>('.tag.dropdown')) {
   wrapTagDropdown(tagDropdownElement);
 }
 

src/lib/components/ImageShowFullscreenButton.ts

@@ -47,7 +47,7 @@ export class ImageShowFullscreenButton extends BaseComponent {
   }
 
   #onButtonClicked() {
-    const imageLinks = this.#mediaBoxTools?.mediaBox.imageLinks;
+    const imageLinks = this.#mediaBoxTools?.mediaBox?.imageLinks;
 
     if (!imageLinks) {
       throw new Error('Failed to resolve image links from media box tools!');

src/lib/components/MaintenancePopup.ts

@@ -30,7 +30,7 @@ export class MaintenancePopup extends BaseComponent {
   #tagsToAdd: Set<string> = new Set();
   #isPlanningToSubmit: boolean = false;
   #isSubmitting: boolean = false;
-  #tagsSubmissionTimer: number | null = null;
+  #tagsSubmissionTimer: Timeout | null = null;
   #emitter = emitterAt(this);
 
   /**
@@ -70,6 +70,10 @@ export class MaintenancePopup extends BaseComponent {
 
     const mediaBox = this.#mediaBoxTools.mediaBox;
 
+    if (!mediaBox) {
+      throw new Error('Media box component not found!');
+    }
+
     mediaBox.on('mouseout', this.#onMouseLeftArea.bind(this));
     mediaBox.on('mouseover', this.#onMouseEnteredArea.bind(this));
   }
@@ -83,7 +87,7 @@ export class MaintenancePopup extends BaseComponent {
   }
 
   #refreshTagsList() {
-    if (!this.#mediaBoxTools) {
+    if (!this.#mediaBoxTools?.mediaBox) {
       return;
     }
 
@@ -109,11 +113,11 @@ export class MaintenancePopup extends BaseComponent {
         this.#tagsList[index] = tagElement;
         this.#tagsListElement.appendChild(tagElement);
 
-        const isPresent = currentPostTags.has(tagName);
+        const isPresent = currentPostTags?.has(tagName);
 
         tagElement.classList.toggle('is-present', isPresent);
         tagElement.classList.toggle('is-missing', !isPresent);
-        tagElement.classList.toggle('is-aliased', isPresent && currentPostTags.get(tagName) !== tagName);
+        tagElement.classList.toggle('is-aliased', isPresent && currentPostTags?.get(tagName) !== tagName);
 
         // Just to prevent duplication, we need to include this tag to the map of suggested invalid tags
         if (tagsBlacklist.includes(tagName)) {
@@ -193,7 +197,7 @@ export class MaintenancePopup extends BaseComponent {
   }
 
   async #onSubmissionTimerPassed() {
-    if (!this.#isPlanningToSubmit || this.#isSubmitting || !this.#mediaBoxTools) {
+    if (!this.#isPlanningToSubmit || this.#isSubmitting || !this.#mediaBoxTools?.mediaBox) {
       return;
     }
 
@@ -264,7 +268,7 @@ export class MaintenancePopup extends BaseComponent {
   }
 
   #revealInvalidTags() {
-    if (!this.#mediaBoxTools) {
+    if (!this.#mediaBoxTools?.mediaBox) {
       return;
     }
 

src/lib/extension/CustomCategoriesResolver.ts

@@ -6,7 +6,7 @@ export default class CustomCategoriesResolver {
   #tagCategories = new Map<string, string>();
   #compiledRegExps = new Map<RegExp, string>();
   #tagDropdowns: TagDropdownWrapper[] = [];
-  #nextQueuedUpdate = -1;
+  #nextQueuedUpdate: Timeout | null = null;
 
   constructor() {
     TagGroup.subscribe(this.#onTagGroupsReceived.bind(this));
@@ -24,7 +24,9 @@ export default class CustomCategoriesResolver {
   }
 
   #queueUpdatingTags() {
-    clearTimeout(this.#nextQueuedUpdate);
+    if (this.#nextQueuedUpdate) {
+      clearTimeout(this.#nextQueuedUpdate);
+    }
 
     this.#nextQueuedUpdate = setTimeout(
       this.#updateUnprocessedTags.bind(this),