From 9e303f898afc865b8ea7b3bdad10241f84dc1d70 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Thu, 9 Nov 2023 23:08:35 +0000
Subject: [PATCH] fixed some code smells

---
 ui/src/components/admin/ConfigView.vue    |  6 ++--
 ui/src/components/admin/DoorMapEditor.vue |  6 ++--
 ui/src/components/calendar/ThouCanvas.vue |  8 ++---
 ui/src/components/editor/PreviewDoor.vue  |  2 +-
 ui/src/lib/api.ts                         |  2 --
 ui/src/main.ts                            |  6 ++--
 ui/src/plugins/store.ts                   | 42 ++++++++++++++---------
 7 files changed, 39 insertions(+), 33 deletions(-)

diff --git a/ui/src/components/admin/ConfigView.vue b/ui/src/components/admin/ConfigView.vue
index 8ea921e..4acddb1 100644
--- a/ui/src/components/admin/ConfigView.vue
+++ b/ui/src/components/admin/ConfigView.vue
@@ -161,7 +161,7 @@
 </template>
 
 <script lang="ts">
-import { AdminConfigModel, Credentials, DoorsSaved } from "@/lib/api";
+import { AdminConfigModel, Credentials, DoorSaved } from "@/lib/api";
 import { advent22Store } from "@/plugins/store";
 import { DateTime } from "luxon";
 import { Options, Vue } from "vue-class-component";
@@ -216,7 +216,7 @@ export default class extends Vue {
       config_file: "sed diam nonumy",
     },
   };
-  public doors: DoorsSaved = [];
+  public doors: DoorSaved[] = [];
   public dav_credentials: Credentials = ["", ""];
   public ui_credentials: Credentials = ["", ""];
 
@@ -230,7 +230,7 @@ export default class extends Vue {
   public on_open(ready: () => void, fail: () => void): void {
     Promise.all([
       this.$advent22.api_get<AdminConfigModel>("admin/config_model"),
-      this.$advent22.api_get<DoorsSaved>("admin/doors"),
+      this.$advent22.api_get<DoorSaved[]>("admin/doors"),
     ])
       .then(([admin_config_model, doors]) => {
         this.admin_config_model = admin_config_model;
diff --git a/ui/src/components/admin/DoorMapEditor.vue b/ui/src/components/admin/DoorMapEditor.vue
index 924fb33..b8e0ba6 100644
--- a/ui/src/components/admin/DoorMapEditor.vue
+++ b/ui/src/components/admin/DoorMapEditor.vue
@@ -69,7 +69,7 @@
 </template>
 
 <script lang="ts">
-import { DoorsSaved } from "@/lib/api";
+import { DoorSaved } from "@/lib/api";
 import { Door } from "@/lib/door";
 import { Options, Vue } from "vue-class-component";
 
@@ -105,7 +105,7 @@ export default class extends Vue {
   private load_doors(): Promise<void> {
     return new Promise<void>((resolve, reject) => {
       this.$advent22
-        .api_get<DoorsSaved>("admin/doors")
+        .api_get<DoorSaved[]>("admin/doors")
         .then((data) => {
           this.doors.length = 0;
 
@@ -124,7 +124,7 @@ export default class extends Vue {
 
   private save_doors(): Promise<void> {
     return new Promise<void>((resolve, reject) => {
-      const data: DoorsSaved = [];
+      const data: DoorSaved[] = [];
 
       for (const door of this.doors) {
         data.push(door.save());
diff --git a/ui/src/components/calendar/ThouCanvas.vue b/ui/src/components/calendar/ThouCanvas.vue
index 3774fbf..7013fbf 100644
--- a/ui/src/components/calendar/ThouCanvas.vue
+++ b/ui/src/components/calendar/ThouCanvas.vue
@@ -21,15 +21,13 @@ import { advent22Store } from "@/plugins/store";
 import { Options, Vue } from "vue-class-component";
 
 function get_event_thous(event: MouseEvent): Vector2D {
-  if (event.currentTarget === null) {
+  if (!(event.currentTarget instanceof SVGSVGElement)) {
     return new Vector2D();
   }
 
-  const target = event.currentTarget as Element;
-
   return new Vector2D(
-    Math.round((event.offsetX / target.clientWidth) * 1000),
-    Math.round((event.offsetY / target.clientHeight) * 1000),
+    Math.round((event.offsetX / event.currentTarget.clientWidth) * 1000),
+    Math.round((event.offsetY / event.currentTarget.clientHeight) * 1000),
   );
 }
 
diff --git a/ui/src/components/editor/PreviewDoor.vue b/ui/src/components/editor/PreviewDoor.vue
index c313db2..53d114e 100644
--- a/ui/src/components/editor/PreviewDoor.vue
+++ b/ui/src/components/editor/PreviewDoor.vue
@@ -52,7 +52,7 @@ export default class extends Vue {
   }
 
   public on_click(event: MouseEvent) {
-    if (event.target === null || !(event.target instanceof SVGRectElement)) {
+    if (!(event.currentTarget instanceof SVGRectElement)) {
       return;
     }
 
diff --git a/ui/src/lib/api.ts b/ui/src/lib/api.ts
index 35f7735..a67e080 100644
--- a/ui/src/lib/api.ts
+++ b/ui/src/lib/api.ts
@@ -54,8 +54,6 @@ export interface DoorSaved {
   y2: number;
 }
 
-export type DoorsSaved = DoorSaved[];
-
 export type Credentials = [username: string, password: string];
 
 export function objForEach<T>(
diff --git a/ui/src/main.ts b/ui/src/main.ts
index 6e719e6..ab6a9be 100644
--- a/ui/src/main.ts
+++ b/ui/src/main.ts
@@ -8,11 +8,11 @@ import App from "./App.vue";
 import "@/main.scss";
 
 const app = createApp(App);
+
 app.use(Advent22Plugin);
 app.use(FontAwesomePlugin);
-app.use(createPinia());
 
-const store = advent22Store();
-store.init(app.config.globalProperties.$advent22);
+app.use(createPinia());
+advent22Store().init();
 
 app.mount("#app");
diff --git a/ui/src/plugins/store.ts b/ui/src/plugins/store.ts
index 9b88924..c0b07b6 100644
--- a/ui/src/plugins/store.ts
+++ b/ui/src/plugins/store.ts
@@ -1,6 +1,6 @@
-import { Credentials, DoorsSaved, SiteConfigModel } from "@/lib/api";
+import { Credentials, DoorSaved, SiteConfigModel } from "@/lib/api";
 import { Advent22 } from "@/plugins/advent22";
-import { useLocalStorage } from "@vueuse/core";
+import { RemovableRef, useLocalStorage } from "@vueuse/core";
 import { AxiosBasicCredentials } from "axios";
 import { acceptHMRUpdate, defineStore } from "pinia";
 
@@ -10,12 +10,23 @@ declare global {
   }
 }
 
+type State = {
+  advent22: Advent22;
+  api_creds: RemovableRef<Credentials>;
+  is_touch_device: boolean;
+  is_admin: boolean;
+  site_config: SiteConfigModel;
+  calendar_aspect_ratio: number;
+  user_doors: DoorSaved[];
+  next_door_target: number | null;
+};
+
 export const advent22Store = defineStore({
   id: "advent22",
 
-  state: () => ({
-    advent22: {} as Advent22,
-    api_creds: useLocalStorage<Credentials>("advent22/auth", ["", ""]),
+  state: (): State => ({
+    advent22: new Advent22(),
+    api_creds: useLocalStorage("advent22/auth", ["", ""]),
     is_touch_device:
       window.matchMedia("(any-hover: none)").matches ||
       "ontouchstart" in window ||
@@ -27,10 +38,10 @@ export const advent22Store = defineStore({
       subtitle: "",
       content: "",
       footer: "",
-    } as SiteConfigModel,
+    },
     calendar_aspect_ratio: 1,
-    user_doors: [] as DoorsSaved,
-    next_door_target: null as number | null,
+    user_doors: [],
+    next_door_target: null,
   }),
 
   getters: {
@@ -41,11 +52,10 @@ export const advent22Store = defineStore({
   },
 
   actions: {
-    init(advent22: Advent22): void {
-      this.advent22 = advent22;
+    init(): void {
       this.update_is_admin();
 
-      advent22
+      this.advent22
         .api_get_blob("user/favicon")
         .then((favicon_src) => {
           const link: HTMLLinkElement =
@@ -61,9 +71,9 @@ export const advent22Store = defineStore({
         .catch(() => {});
 
       Promise.all([
-        advent22.api_get<SiteConfigModel>("user/site_config"),
-        advent22.api_get<DoorsSaved>("user/doors"),
-        advent22.api_get<number | null>("user/next_door"),
+        this.advent22.api_get<SiteConfigModel>("user/site_config"),
+        this.advent22.api_get<DoorSaved[]>("user/doors"),
+        this.advent22.api_get<number | null>("user/next_door"),
       ])
         .then(([site_config, user_doors, next_door]) => {
           document.title = site_config.title;
@@ -77,11 +87,11 @@ export const advent22Store = defineStore({
           if (next_door !== null)
             this.next_door_target = Date.now() + next_door;
         })
-        .catch(advent22.alert_user_error);
+        .catch(this.advent22.alert_user_error);
     },
 
     update_is_admin(): Promise<boolean> {
-      return new Promise<boolean>((resolve, reject) => {
+      return new Promise((resolve, reject) => {
         this.advent22
           .api_get<boolean>("admin/is_admin")
           .then((is_admin) => {