adapt typescript to strict mode

subscription/static/bundled/subscription/creation-form-existing-user-index.ts

@@ -1,10 +1,11 @@
+import type { UserAjaxSelect } from "#core:core/components/ajax-select-index";
 import { userFetchUser } from "#openapi";
 
 Alpine.data("existing_user_subscription_form", () => ({
   loading: false,
   selectedUser: "",
   profileFragment: "",
-  dateOfBirth: "",
+  dateOfBirth: "" as string | null,
   dateOfBirthHidden: true,
 
   init() {
@@ -14,7 +15,9 @@ Alpine.data("existing_user_subscription_form", () => ({
 
     this.$nextTick(() => {
       // Force to detect the initial value
-      this.selectedUser = this.$refs.userSelect.widget.getValue();
+      this.selectedUser = (
+        this.$refs.userSelect as UserAjaxSelect
+      ).widget.getValue() as string;
     });
   },
 
@@ -31,11 +34,15 @@ Alpine.data("existing_user_subscription_form", () => ({
       // biome-ignore lint/style/useNamingConvention: api is snake_case
       userFetchUser({ path: { user_id: userId } }),
     ]);
+    if (userInfos.data === undefined) {
+      console.error("User infos request failed");
+      return;
+    }
     this.profileFragment = await miniProfile.text();
     // If the user has no birthdate yet, show the form input
     // to fill this info.
     // Else keep the input hidden and change its value to the user birthdate
-    this.dateOfBirth = userInfos.data.date_of_birth;
+    this.dateOfBirth = userInfos.data.date_of_birth ?? null;
     this.dateOfBirthHidden = userInfos.data.date_of_birth !== null;
     this.loading = false;
   },

subscription/static/bundled/subscription/stats-index.ts

@@ -17,7 +17,10 @@ function getRandomColorUniq(list: string[]) {
   }
   return color;
 }
-function hexToRgb(hex: string) {
+
+type Rgb = { r: number; g: number; b: number };
+
+function hexToRgb(hex: string): Rgb | null {
   // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
   const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
   const hexrgb = hex.replace(shorthandRegex, (_m, r, g, b) => {
@@ -37,32 +40,29 @@ function hexToRgb(hex: string) {
 document.addEventListener("DOMContentLoaded", () => {
   const ctx = (document.getElementById("statsChart") as HTMLCanvasElement).getContext(
     "2d",
-  );
+  ) as CanvasRenderingContext2D;
   const labels: string[] = [];
   const total: string[] = [];
-  const colors: string[] = [];
+  const colorStrings: string[] = [];
   const colorsDimmed: string[] = [];
   for (const element of Array.from(document.getElementsByClassName("types"))) {
-    labels.push(element.childNodes[0].textContent);
+    labels.push(element.childNodes[0].textContent as string);
   }
   for (const element of Array.from(document.getElementsByClassName("total"))) {
-    total.push(element.childNodes[0].childNodes[0].textContent);
+    total.push(element.childNodes[0].childNodes[0].textContent as string);
   }
 
   for (const _ of labels) {
-    colors.push(getRandomColorUniq(colors));
+    colorStrings.push(getRandomColorUniq(colorStrings));
+  }
+  const colors = colorStrings.map(hexToRgb) as Rgb[];
+
+  for (const color of colors) {
+    colorsDimmed.push(`rgba(${color.r}, ${color.g}, ${color.b}, 0.2)`);
   }
 
-  for (const element of colors) {
-    const rgbColor = hexToRgb(element);
-    colorsDimmed.push(`rgba(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b}, 0.2)`);
-  }
-
-  for (const element of colors) {
-    const rgbColorDimmed = hexToRgb(element);
-    colorsDimmed.push(
-      `rgba(${rgbColorDimmed.r}, ${rgbColorDimmed.g}, ${rgbColorDimmed.b}, 0.2)`,
-    );
+  for (const color of colors) {
+    colorsDimmed.push(`rgba(${color.r}, ${color.g}, ${color.b}, 0.2)`);
   }
 
   new Chart(ctx, {
@@ -71,10 +71,11 @@ document.addEventListener("DOMContentLoaded", () => {
       labels: labels,
       datasets: [
         {
-          label: document.getElementById("graphLabel").childNodes[0].textContent,
+          label: document.getElementById("graphLabel")?.childNodes[0]
+            .textContent as string,
           data: total,
           backgroundColor: colorsDimmed,
-          borderColor: colors,
+          borderColor: colorStrings,
           borderWidth: 1,
         },
       ],