From ac7ad9f5ffbb5a61f8b2489e3db4531d06688478 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Tue, 3 Dec 2024 16:22:11 +0100
Subject: [PATCH 01/26] #564 re add example view

---
 wls-gui-wahllokalsystem/src/App.vue           | 22 ++++++-
 wls-gui-wahllokalsystem/src/constants.ts      |  1 +
 wls-gui-wahllokalsystem/src/plugins/router.ts |  8 +++
 .../src/plugins/vuetify.ts                    |  3 +-
 .../views/ExampleBackendCommunicationView.vue | 60 +++++++++++++++++++
 5 files changed, 92 insertions(+), 2 deletions(-)
 create mode 100644 wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue

diff --git a/wls-gui-wahllokalsystem/src/App.vue b/wls-gui-wahllokalsystem/src/App.vue
index bce00e9ba..ccc826e87 100644
--- a/wls-gui-wahllokalsystem/src/App.vue
+++ b/wls-gui-wahllokalsystem/src/App.vue
@@ -22,6 +22,26 @@
           cols="3"
           class="d-flex align-center justify-end"
         >
+          <v-tooltip
+            location="bottom"
+            text="Backend Communication Examples"
+          >
+            <template #activator="{ props }">
+              <router-link
+                v-bind="props"
+                :to="{ name: EXAMPLE_ROUTES_BACKEND }"
+              >
+                <v-btn
+                  icon="$messageText"
+                  variant="text"
+                  density="comfortable"
+                  size="x-large"
+                  color="white"
+                >
+                </v-btn>
+              </router-link>
+            </template>
+          </v-tooltip>
           <v-tooltip
             location="bottom"
             text="Routing Examples"
@@ -94,7 +114,7 @@ import {
 import { getUser } from "@/api/user-client";
 import Ad2ImageAvatar from "@/components/common/Ad2ImageAvatar.vue";
 import TheSnackbar from "@/components/TheSnackbar.vue";
-import { EXAMPLE_ROUTES_NEWROUTE } from "@/constants";
+import { EXAMPLE_ROUTES_BACKEND, EXAMPLE_ROUTES_NEWROUTE } from "@/constants";
 import { useSnackbarStore } from "@/stores/snackbar";
 import { useUserStore } from "@/stores/user";
 import User, { UserLocalDevelopment } from "@/types/User";
diff --git a/wls-gui-wahllokalsystem/src/constants.ts b/wls-gui-wahllokalsystem/src/constants.ts
index 70f57cfe7..e89b9a25d 100644
--- a/wls-gui-wahllokalsystem/src/constants.ts
+++ b/wls-gui-wahllokalsystem/src/constants.ts
@@ -2,6 +2,7 @@ export const ROUTES_HOME = "home";
 export const EXAMPLE_ROUTES_NEWROUTE = "newroute";
 export const EXAMPLE_ROUTES_NOTFOUND = "404";
 export const EXAMPLE_ROUTES_DYNAMIC = "dynamic";
+export const EXAMPLE_ROUTES_BACKEND = "talk-to-backend";
 
 export const AD2IMAGE_URL = import.meta.env.VITE_AD2IMAGE_URL;
 
diff --git a/wls-gui-wahllokalsystem/src/plugins/router.ts b/wls-gui-wahllokalsystem/src/plugins/router.ts
index 419bffe9c..61b01be05 100644
--- a/wls-gui-wahllokalsystem/src/plugins/router.ts
+++ b/wls-gui-wahllokalsystem/src/plugins/router.ts
@@ -3,11 +3,13 @@ import { createRouter, createWebHashHistory } from "vue-router";
 
 import ExampleDynamicComponent from "@/components/ExampleDynamicComponent.vue";
 import {
+  EXAMPLE_ROUTES_BACKEND,
   EXAMPLE_ROUTES_DYNAMIC,
   EXAMPLE_ROUTES_NEWROUTE,
   EXAMPLE_ROUTES_NOTFOUND,
   ROUTES_HOME,
 } from "@/constants";
+import ExampleBackendCommunicationView from "@/views/ExampleBackendCommunicationView.vue";
 import ExampleError404View from "@/views/ExampleError404View.vue";
 import ExampleNewRouteView from "@/views/ExampleNewRouteView.vue";
 import HomeView from "@/views/HomeView.vue";
@@ -19,6 +21,12 @@ const routes = [
     component: HomeView,
     meta: {},
   },
+  {
+    path: "/talk-to-backend",
+    name: EXAMPLE_ROUTES_BACKEND,
+    component: ExampleBackendCommunicationView,
+    meta: {},
+  },
   {
     path: "/newroute",
     name: EXAMPLE_ROUTES_NEWROUTE,
diff --git a/wls-gui-wahllokalsystem/src/plugins/vuetify.ts b/wls-gui-wahllokalsystem/src/plugins/vuetify.ts
index 7e9d8d56f..3aab51ecc 100644
--- a/wls-gui-wahllokalsystem/src/plugins/vuetify.ts
+++ b/wls-gui-wahllokalsystem/src/plugins/vuetify.ts
@@ -1,6 +1,6 @@
 import "vuetify/styles";
 
-import { mdiHome, mdiRoutes } from "@mdi/js";
+import { mdiHome, mdiMessageText, mdiRoutes } from "@mdi/js";
 import { createVuetify } from "vuetify";
 import { aliases, mdi } from "vuetify/iconsets/mdi-svg";
 
@@ -11,6 +11,7 @@ export default createVuetify({
       ...aliases,
       home: mdiHome,
       routes: mdiRoutes,
+      messageText: mdiMessageText,
     },
     sets: {
       mdi,
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
new file mode 100644
index 000000000..0060d4f9c
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -0,0 +1,60 @@
+<template>
+  <v-container>
+    <v-col class="text-center">
+      <h2>This view shows how communication with backend-services will work</h2>
+    </v-col>
+    <v-col class="text-center">
+      <v-btn @click="getApi"> make api call</v-btn>
+    </v-col>
+    <v-col>
+      <pre v-if="elements"> {{ elements }} </pre>
+      <p v-else>{{ error }}</p>
+    </v-col>
+  </v-container>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import { VBtn, VCol, VContainer } from "vuetify/components";
+
+import { useSnackbarStore } from "@/stores/snackbar";
+
+const snackbarStore = useSnackbarStore();
+const elements = ref(null);
+const error = ref("");
+
+const GET_BROADCAST = "/api/broadcast-service/businessActions/getMessage/wbz-1";
+const GET_WAHLVORSTAND =
+  "/api/wahlvorstand-service/businessActions/wahlvorstand/wahlbezirkID";
+
+function getApi() {
+  fetch(GET_BROADCAST)
+    .then((response) => {
+      if (response.status == 204) {
+        console.log(response);
+        throw new Error("Es konnten keine Daten gefunden werden. (204)");
+      }
+      if (!response.ok) {
+        switch (response.status) {
+          case 401:
+            throw new Error("Der Nutzer hat nicht die benötigten Rechte (401)");
+          case 404:
+            throw new Error("Ressource nicht gefunden (404)");
+          case 431:
+            throw new Error("Request Header Fields Too Large (431)");
+          case 500:
+            throw new Error("Interner Serverfehler (500)");
+          default:
+            throw new Error("Ein Fehler ist aufgetreten: ${response.status}");
+        }
+      }
+      console.log(response);
+      return response.json();
+    })
+    .then((data) => (elements.value = data))
+    .catch((err) => {
+      error.value = "Es gibt keine anzuzeigenden Daten";
+      snackbarStore.showMessage(err); // todo: show message as error not info
+    });
+}
+</script>

From 9a9127b0b327fdbbb7a88f40781c477d7e1d2714 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 4 Dec 2024 10:36:47 +0100
Subject: [PATCH 02/26] #564 remove node options from dev script

---
 wls-gui-wahllokalsystem/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wls-gui-wahllokalsystem/package.json b/wls-gui-wahllokalsystem/package.json
index 2024d8e94..628ed75f5 100644
--- a/wls-gui-wahllokalsystem/package.json
+++ b/wls-gui-wahllokalsystem/package.json
@@ -7,7 +7,7 @@
     "node": ">=20 <=22"
   },
   "scripts": {
-    "dev": "set NODE_OPTIONS=--max-http-header-size=32000 && vite",
+    "dev": "vite",
     "test": "vitest run",
     "build": "vue-tsc --build --force && vite build",
     "preview": "vite preview",

From e291df819f491ecdfbf1085031ef17165fab3525 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 4 Dec 2024 10:38:15 +0100
Subject: [PATCH 03/26] Revert "#564 remove node options from dev script"

This reverts commit 9a9127b0b327fdbbb7a88f40781c477d7e1d2714.
---
 wls-gui-wahllokalsystem/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wls-gui-wahllokalsystem/package.json b/wls-gui-wahllokalsystem/package.json
index 628ed75f5..2024d8e94 100644
--- a/wls-gui-wahllokalsystem/package.json
+++ b/wls-gui-wahllokalsystem/package.json
@@ -7,7 +7,7 @@
     "node": ">=20 <=22"
   },
   "scripts": {
-    "dev": "vite",
+    "dev": "set NODE_OPTIONS=--max-http-header-size=32000 && vite",
     "test": "vitest run",
     "build": "vue-tsc --build --force && vite build",
     "preview": "vite preview",

From bbdb61873fe0c42014a46ba07426e3178e9880db Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 5 Dec 2024 14:35:24 +0100
Subject: [PATCH 04/26] #564 add api calls with fetch utils

---
 .../src/api/broadcast-client.ts               |  48 +++++++++
 .../src/api/fetch-utils.ts                    |  21 +++-
 .../src/types/BroadcastMessageToRead.ts       |  11 ++
 .../src/types/BroadcastMessageToSend.ts       |   9 ++
 .../views/ExampleBackendCommunicationView.vue | 101 +++++++++++-------
 5 files changed, 145 insertions(+), 45 deletions(-)
 create mode 100644 wls-gui-wahllokalsystem/src/api/broadcast-client.ts
 create mode 100644 wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
 create mode 100644 wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts

diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
new file mode 100644
index 000000000..f346e96ed
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
@@ -0,0 +1,48 @@
+import {
+  defaultCatchHandler,
+  defaultResponseHandler,
+  getConfig,
+  postConfig,
+} from "@/api/fetch-utils";
+import BroadcastMessageToRead from "@/types/BroadcastMessageToRead";
+import BroadcastMessageToSend from "@/types/BroadcastMessageToSend";
+
+export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
+
+export function getBroadcastMessage(
+  wahlbezirkID: string
+): Promise<BroadcastMessageToRead> {
+  return fetch(BROADCAST_API_URL + "getMessage/" + wahlbezirkID, getConfig())
+    .then((response) => {
+      defaultResponseHandler(response);
+      return response.json();
+    })
+    .catch(defaultCatchHandler);
+}
+
+export function postBroadcastMessage(
+  wahlbezirkIDs: string[],
+  message: string
+): Promise<void> {
+  return fetch(
+    BROADCAST_API_URL + "broadcast",
+    postConfig(new BroadcastMessageToSend(wahlbezirkIDs, message))
+  )
+    .then((response) => {
+      defaultResponseHandler(response);
+    })
+    .catch(defaultCatchHandler);
+}
+
+export function broadcastMessageRead(nachrichtID: string) {
+  return fetch(
+    BROADCAST_API_URL + "messageRead/" + nachrichtID,
+    postConfig(nachrichtID)
+  )
+    .then((response) => {
+      defaultResponseHandler(response);
+      console.log("message read ausgeführt");
+      return response.json();
+    })
+    .catch(defaultCatchHandler);
+}
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index a37b75846..96ff6c5ee 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -83,10 +83,22 @@ export function patchConfig(body: any): RequestInit {
  */
 export function defaultResponseHandler(
   response: Response,
-  errorMessage = "Es ist ein unbekannter Fehler aufgetreten."
+  errorMessage = "Es ist ein Fehler im ResponseHandler aufgetreten."
 ): void {
+  /*  // todo: no content sollte vermutlich woanders aufgefangen werden und nicht hier
+            if (response.status === 204) {
+              throw new ApiError({
+                level: STATUS_INDICATORS.INFO,
+                message: "Es konnten keine Daten gefunden werden. (204)",
+              });
+            }*/
   if (!response.ok) {
-    if (response.status === 403) {
+    if (response.status === 400) {
+      throw new ApiError({
+        level: STATUS_INDICATORS.ERROR,
+        message: "WLS Exception",
+      });
+    } else if (response.status === 403) {
       throw new ApiError({
         level: STATUS_INDICATORS.ERROR,
         message:
@@ -108,13 +120,14 @@ export function defaultResponseHandler(
  * @param error The error object from fetch command
  * @param errorMessage The error message to be included in the ApiError object.
  */
+// wird sowohl bei ablehnung von fetch (promise rejected), als auch bei einem fehler im responsehandler ausgeführt
 export function defaultCatchHandler(
   error: Error,
-  errorMessage = "Es ist ein unbekannter Fehler aufgetreten."
+  errorMessage = "Es ist ein Fehler im CatchHandler aufgetreten."
 ): PromiseLike<never> {
   throw new ApiError({
     level: STATUS_INDICATORS.WARNING,
-    message: errorMessage,
+    message: errorMessage + " " + error,
   });
 }
 
diff --git a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
new file mode 100644
index 000000000..6ee22e654
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
@@ -0,0 +1,11 @@
+export default class BroadcastMessageToRead {
+  oid: string;
+  wahlbezirkIDs: string[];
+  nachricht: string;
+
+  constructor(oid: string, wahlbezirkIDs: string[], nachricht: string) {
+    this.oid = oid;
+    this.wahlbezirkIDs = wahlbezirkIDs;
+    this.nachricht = nachricht;
+  }
+}
diff --git a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts
new file mode 100644
index 000000000..9ebeabdbd
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts
@@ -0,0 +1,9 @@
+export default class BroadcastMessageToSend {
+  wahlbezirkIDs: string[];
+  nachricht: string;
+
+  constructor(wahlbezirkIDs: string[], nachricht: string) {
+    this.wahlbezirkIDs = wahlbezirkIDs;
+    this.nachricht = nachricht;
+  }
+}
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 0060d4f9c..ad03158e4 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -3,58 +3,77 @@
     <v-col class="text-center">
       <h2>This view shows how communication with backend-services will work</h2>
     </v-col>
-    <v-col class="text-center">
-      <v-btn @click="getApi"> make api call</v-btn>
-    </v-col>
-    <v-col>
-      <pre v-if="elements"> {{ elements }} </pre>
-      <p v-else>{{ error }}</p>
-    </v-col>
+    <v-responsive class="mx-auto">
+      <v-col class="text-center">
+        <v-text-field
+          class="ml-auto mr-auto"
+          width="350"
+          v-model="messageInput"
+          clearable
+          label="ID"
+        ></v-text-field>
+        <v-btn @click="postMessage(['wbz-1', 'wbz-2'])"
+          >post message with fetch utils
+        </v-btn>
+        <p v-if="errorPostFetch">{{ errorPostFetch }}</p>
+        <br />
+        <br />
+        <v-btn @click="getMessage('wbz-1')">get message with fetch utils</v-btn>
+        <pre v-if="messageFetch"> {{ messageFetch }} </pre>
+        <p v-if="errorGetFetch">{{ errorGetFetch }}</p>
+      </v-col>
+    </v-responsive>
   </v-container>
 </template>
 
 <script setup lang="ts">
+import type BroadcastMessageToRead from "@/types/BroadcastMessageToRead";
+
 import { ref } from "vue";
-import { VBtn, VCol, VContainer } from "vuetify/components";
+import {
+  VBtn,
+  VCol,
+  VContainer,
+  VResponsive,
+  VTextField,
+} from "vuetify/components";
 
+import {
+  broadcastMessageRead,
+  getBroadcastMessage,
+  postBroadcastMessage,
+} from "@/api/broadcast-client";
+import { STATUS_INDICATORS } from "@/constants";
 import { useSnackbarStore } from "@/stores/snackbar";
 
 const snackbarStore = useSnackbarStore();
-const elements = ref(null);
-const error = ref("");
+const messageInput = ref("Broadcast Message");
+const messageFetch = ref("Click Button to Load Message");
+const errorGetFetch = ref("");
+const errorPostFetch = ref("");
+let messageFetchId = "";
 
-const GET_BROADCAST = "/api/broadcast-service/businessActions/getMessage/wbz-1";
-const GET_WAHLVORSTAND =
-  "/api/wahlvorstand-service/businessActions/wahlvorstand/wahlbezirkID";
-
-function getApi() {
-  fetch(GET_BROADCAST)
-    .then((response) => {
-      if (response.status == 204) {
-        console.log(response);
-        throw new Error("Es konnten keine Daten gefunden werden. (204)");
-      }
-      if (!response.ok) {
-        switch (response.status) {
-          case 401:
-            throw new Error("Der Nutzer hat nicht die benötigten Rechte (401)");
-          case 404:
-            throw new Error("Ressource nicht gefunden (404)");
-          case 431:
-            throw new Error("Request Header Fields Too Large (431)");
-          case 500:
-            throw new Error("Interner Serverfehler (500)");
-          default:
-            throw new Error("Ein Fehler ist aufgetreten: ${response.status}");
-        }
-      }
-      console.log(response);
-      return response.json();
+function getMessage(wahlbezirkID: string) {
+  errorGetFetch.value = "";
+  messageFetch.value = "";
+  getBroadcastMessage(wahlbezirkID)
+    .then((content: BroadcastMessageToRead) => {
+      messageFetch.value = content.nachricht;
+      messageFetchId = content.oid;
+      broadcastMessageRead(messageFetchId);
     })
-    .then((data) => (elements.value = data))
-    .catch((err) => {
-      error.value = "Es gibt keine anzuzeigenden Daten";
-      snackbarStore.showMessage(err); // todo: show message as error not info
+    .catch((e) => {
+      errorGetFetch.value = e.message;
+      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
     });
 }
+
+function postMessage(wahlbezirkIDs: string[]) {
+  errorPostFetch.value = "";
+  postBroadcastMessage(wahlbezirkIDs, messageInput.value).catch((e) => {
+    errorPostFetch.value = e.message;
+    snackbarStore.showMessage(e);
+  });
+  messageInput.value = "";
+}
 </script>

From a1ac5a76c6fe50335dd753f9ff129f1b2c0f2920 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 5 Dec 2024 15:13:30 +0100
Subject: [PATCH 05/26] #564 handle response status 204

---
 .../src/api/broadcast-client.ts               | 19 +++++++++----------
 .../src/api/fetch-utils.ts                    | 16 ++++++++--------
 2 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
index f346e96ed..b3a4b157d 100644
--- a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
@@ -12,12 +12,13 @@ export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
 export function getBroadcastMessage(
   wahlbezirkID: string
 ): Promise<BroadcastMessageToRead> {
-  return fetch(BROADCAST_API_URL + "getMessage/" + wahlbezirkID, getConfig())
-    .then((response) => {
-      defaultResponseHandler(response);
-      return response.json();
-    })
-    .catch(defaultCatchHandler);
+  return fetch(
+    BROADCAST_API_URL + "getMessage/" + wahlbezirkID,
+    getConfig()
+  ).then((response) => {
+    defaultResponseHandler(response);
+    return response.json();
+  });
 }
 
 export function postBroadcastMessage(
@@ -34,15 +35,13 @@ export function postBroadcastMessage(
     .catch(defaultCatchHandler);
 }
 
-export function broadcastMessageRead(nachrichtID: string) {
-  return fetch(
+export function broadcastMessageRead(nachrichtID: string): void {
+  fetch(
     BROADCAST_API_URL + "messageRead/" + nachrichtID,
     postConfig(nachrichtID)
   )
     .then((response) => {
       defaultResponseHandler(response);
-      console.log("message read ausgeführt");
-      return response.json();
     })
     .catch(defaultCatchHandler);
 }
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 96ff6c5ee..03d8f11df 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -85,13 +85,13 @@ export function defaultResponseHandler(
   response: Response,
   errorMessage = "Es ist ein Fehler im ResponseHandler aufgetreten."
 ): void {
-  /*  // todo: no content sollte vermutlich woanders aufgefangen werden und nicht hier
-            if (response.status === 204) {
-              throw new ApiError({
-                level: STATUS_INDICATORS.INFO,
-                message: "Es konnten keine Daten gefunden werden. (204)",
-              });
-            }*/
+  // todo: no content sollte vermutlich woanders aufgefangen werden und nicht hier weil es ein 2xx code ist
+  if (response.status === 204) {
+    throw new ApiError({
+      level: STATUS_INDICATORS.INFO,
+      message: "Es konnten keine Daten gefunden werden. (204)",
+    });
+  }
   if (!response.ok) {
     if (response.status === 400) {
       throw new ApiError({
@@ -127,7 +127,7 @@ export function defaultCatchHandler(
 ): PromiseLike<never> {
   throw new ApiError({
     level: STATUS_INDICATORS.WARNING,
-    message: errorMessage + " " + error,
+    message: error.name + ": " + error.message,
   });
 }
 

From c9ffac8fa111c579f726de82c0c6be6ef2150c57 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 5 Dec 2024 15:31:03 +0100
Subject: [PATCH 06/26] #564 :construction: try to handle wls exception

---
 wls-gui-wahllokalsystem/src/api/fetch-utils.ts | 11 +++++++++--
 .../src/types/WLSException.ts                  | 18 ++++++++++++++++++
 2 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 wls-gui-wahllokalsystem/src/types/WLSException.ts

diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 03d8f11df..d96b7f30c 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -1,3 +1,5 @@
+import type WLSException from "@/types/WLSException";
+
 import { ApiError } from "@/api/ApiError";
 import { STATUS_INDICATORS } from "@/constants";
 
@@ -94,9 +96,15 @@ export function defaultResponseHandler(
   }
   if (!response.ok) {
     if (response.status === 400) {
+      let wlsMessage = "";
+      response.json().then((obj: WLSException) => {
+        wlsMessage = obj.message;
+        console.log("1. " + wlsMessage);
+      });
+      console.log("2. " + wlsMessage);
       throw new ApiError({
         level: STATUS_INDICATORS.ERROR,
-        message: "WLS Exception",
+        message: "WLS Exception: " + wlsMessage,
       });
     } else if (response.status === 403) {
       throw new ApiError({
@@ -120,7 +128,6 @@ export function defaultResponseHandler(
  * @param error The error object from fetch command
  * @param errorMessage The error message to be included in the ApiError object.
  */
-// wird sowohl bei ablehnung von fetch (promise rejected), als auch bei einem fehler im responsehandler ausgeführt
 export function defaultCatchHandler(
   error: Error,
   errorMessage = "Es ist ein Fehler im CatchHandler aufgetreten."
diff --git a/wls-gui-wahllokalsystem/src/types/WLSException.ts b/wls-gui-wahllokalsystem/src/types/WLSException.ts
new file mode 100644
index 000000000..db9f372ab
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/types/WLSException.ts
@@ -0,0 +1,18 @@
+export default class WLSException {
+  category: string;
+  code: string;
+  message: string;
+  service: string;
+
+  constructor(
+    category: string,
+    code: string,
+    message: string,
+    service: string
+  ) {
+    this.category = category;
+    this.code = code;
+    this.message = message;
+    this.service = service;
+  }
+}

From a94a311a5b0efd75bde2f21fb7c4080d88a64b45 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Fri, 6 Dec 2024 13:42:09 +0100
Subject: [PATCH 07/26] #564 handle exceptions correctly

---
 .../src/api/broadcast-client.ts               | 30 +++++---------
 .../src/api/fetch-utils.ts                    | 41 +++++++++++++++++--
 .../views/ExampleBackendCommunicationView.vue | 12 +++++-
 3 files changed, 58 insertions(+), 25 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
index b3a4b157d..8833b1490 100644
--- a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
@@ -1,24 +1,18 @@
 import {
-  defaultCatchHandler,
-  defaultResponseHandler,
+  catchHandler,
   getConfig,
   postConfig,
+  responseHandler,
 } from "@/api/fetch-utils";
-import BroadcastMessageToRead from "@/types/BroadcastMessageToRead";
 import BroadcastMessageToSend from "@/types/BroadcastMessageToSend";
 
 export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
 
-export function getBroadcastMessage(
-  wahlbezirkID: string
-): Promise<BroadcastMessageToRead> {
+export function getBroadcastMessage(wahlbezirkID: string): Promise<Response> {
   return fetch(
     BROADCAST_API_URL + "getMessage/" + wahlbezirkID,
     getConfig()
-  ).then((response) => {
-    defaultResponseHandler(response);
-    return response.json();
-  });
+  ).then(responseHandler);
 }
 
 export function postBroadcastMessage(
@@ -29,19 +23,15 @@ export function postBroadcastMessage(
     BROADCAST_API_URL + "broadcast",
     postConfig(new BroadcastMessageToSend(wahlbezirkIDs, message))
   )
-    .then((response) => {
-      defaultResponseHandler(response);
-    })
-    .catch(defaultCatchHandler);
+    .then(responseHandler)
+    .catch(catchHandler);
 }
 
-export function broadcastMessageRead(nachrichtID: string): void {
-  fetch(
+export function broadcastMessageRead(nachrichtID: string): Promise<void> {
+  return fetch(
     BROADCAST_API_URL + "messageRead/" + nachrichtID,
     postConfig(nachrichtID)
   )
-    .then((response) => {
-      defaultResponseHandler(response);
-    })
-    .catch(defaultCatchHandler);
+    .then(responseHandler)
+    .catch(catchHandler);
 }
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index d96b7f30c..65f33e7ab 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -83,7 +83,7 @@ export function patchConfig(body: any): RequestInit {
  * @param response The response from the fetch command to be checked.
  * @param errorMessage The error message to be displayed for an HTTP code != 2xx.
  */
-export function defaultResponseHandler(
+/*export function defaultResponseHandler(
   response: Response,
   errorMessage = "Es ist ein Fehler im ResponseHandler aufgetreten."
 ): void {
@@ -120,7 +120,7 @@ export function defaultResponseHandler(
       message: errorMessage,
     });
   }
-}
+}*/
 
 /**
  * Default catch handler for all service requests.
@@ -128,7 +128,8 @@ export function defaultResponseHandler(
  * @param error The error object from fetch command
  * @param errorMessage The error message to be included in the ApiError object.
  */
-export function defaultCatchHandler(
+
+/*export function defaultCatchHandler(
   error: Error,
   errorMessage = "Es ist ein Fehler im CatchHandler aufgetreten."
 ): PromiseLike<never> {
@@ -136,6 +137,40 @@ export function defaultCatchHandler(
     level: STATUS_INDICATORS.WARNING,
     message: error.name + ": " + error.message,
   });
+}*/
+
+export function responseHandler(response: Response): Promise<Response> {
+  if (response.status === 204) {
+    throw new ApiError({
+      level: STATUS_INDICATORS.INFO,
+      message: "Es konnten keine Daten gefunden werden. (204)",
+    });
+  } else if (response.ok) {
+    return Promise.resolve(response);
+  } else {
+    return Promise.reject(response);
+  }
+}
+
+export function catchHandler(response: Response): Promise<any> {
+  if (response.status === 400) {
+    // 400 ist nicht immer eine wls exception..
+    return response.json().then((content: WLSException) => {
+      return Promise.reject(
+        new ApiError({
+          level: STATUS_INDICATORS.ERROR,
+          message: content.message,
+        })
+      );
+    });
+  } else {
+    return Promise.reject(
+      new ApiError({
+        level: STATUS_INDICATORS.ERROR,
+        message: "unbekannter fehler",
+      })
+    );
+  }
 }
 
 /**
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index ad03158e4..f6637817b 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -21,6 +21,7 @@
         <v-btn @click="getMessage('wbz-1')">get message with fetch utils</v-btn>
         <pre v-if="messageFetch"> {{ messageFetch }} </pre>
         <p v-if="errorGetFetch">{{ errorGetFetch }}</p>
+        <p v-if="errorReadFetch">{{ errorReadFetch }}</p>
       </v-col>
     </v-responsive>
   </v-container>
@@ -51,16 +52,23 @@ const messageInput = ref("Broadcast Message");
 const messageFetch = ref("Click Button to Load Message");
 const errorGetFetch = ref("");
 const errorPostFetch = ref("");
+const errorReadFetch = ref("");
 let messageFetchId = "";
 
 function getMessage(wahlbezirkID: string) {
   errorGetFetch.value = "";
   messageFetch.value = "";
   getBroadcastMessage(wahlbezirkID)
+    .then((response) => {
+      return response.json();
+    })
     .then((content: BroadcastMessageToRead) => {
       messageFetch.value = content.nachricht;
       messageFetchId = content.oid;
-      broadcastMessageRead(messageFetchId);
+      broadcastMessageRead(messageFetchId).catch((e) => {
+        errorReadFetch.value =
+          "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
+      });
     })
     .catch((e) => {
       errorGetFetch.value = e.message;
@@ -72,7 +80,7 @@ function postMessage(wahlbezirkIDs: string[]) {
   errorPostFetch.value = "";
   postBroadcastMessage(wahlbezirkIDs, messageInput.value).catch((e) => {
     errorPostFetch.value = e.message;
-    snackbarStore.showMessage(e);
+    snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
   });
   messageInput.value = "";
 }

From f754a0d0b652a998498f4b2a4fe1bb3aa58245da Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Fri, 6 Dec 2024 13:48:50 +0100
Subject: [PATCH 08/26] #564 restore default handlers + rename additional
 handlers

---
 .../src/api/broadcast-client.ts               | 18 ++++-----
 .../src/api/fetch-utils.ts                    | 38 +++++--------------
 2 files changed, 19 insertions(+), 37 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
index 8833b1490..9a2ace5c9 100644
--- a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
@@ -1,8 +1,8 @@
 import {
-  catchHandler,
   getConfig,
   postConfig,
-  responseHandler,
+  wlsCatchHandler,
+  wlsResponseHandler,
 } from "@/api/fetch-utils";
 import BroadcastMessageToSend from "@/types/BroadcastMessageToSend";
 
@@ -12,26 +12,26 @@ export function getBroadcastMessage(wahlbezirkID: string): Promise<Response> {
   return fetch(
     BROADCAST_API_URL + "getMessage/" + wahlbezirkID,
     getConfig()
-  ).then(responseHandler);
+  ).then(wlsResponseHandler);
 }
 
 export function postBroadcastMessage(
   wahlbezirkIDs: string[],
   message: string
-): Promise<void> {
+): Promise<Response> {
   return fetch(
     BROADCAST_API_URL + "broadcast",
     postConfig(new BroadcastMessageToSend(wahlbezirkIDs, message))
   )
-    .then(responseHandler)
-    .catch(catchHandler);
+    .then(wlsResponseHandler)
+    .catch(wlsCatchHandler);
 }
 
-export function broadcastMessageRead(nachrichtID: string): Promise<void> {
+export function broadcastMessageRead(nachrichtID: string): Promise<Response> {
   return fetch(
     BROADCAST_API_URL + "messageRead/" + nachrichtID,
     postConfig(nachrichtID)
   )
-    .then(responseHandler)
-    .catch(catchHandler);
+    .then(wlsResponseHandler)
+    .catch(wlsCatchHandler);
 }
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 65f33e7ab..1c2b6caf5 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -83,30 +83,12 @@ export function patchConfig(body: any): RequestInit {
  * @param response The response from the fetch command to be checked.
  * @param errorMessage The error message to be displayed for an HTTP code != 2xx.
  */
-/*export function defaultResponseHandler(
+export function defaultResponseHandler(
   response: Response,
-  errorMessage = "Es ist ein Fehler im ResponseHandler aufgetreten."
+  errorMessage = "Es ist ein unbekannter Fehler aufgetreten."
 ): void {
-  // todo: no content sollte vermutlich woanders aufgefangen werden und nicht hier weil es ein 2xx code ist
-  if (response.status === 204) {
-    throw new ApiError({
-      level: STATUS_INDICATORS.INFO,
-      message: "Es konnten keine Daten gefunden werden. (204)",
-    });
-  }
   if (!response.ok) {
-    if (response.status === 400) {
-      let wlsMessage = "";
-      response.json().then((obj: WLSException) => {
-        wlsMessage = obj.message;
-        console.log("1. " + wlsMessage);
-      });
-      console.log("2. " + wlsMessage);
-      throw new ApiError({
-        level: STATUS_INDICATORS.ERROR,
-        message: "WLS Exception: " + wlsMessage,
-      });
-    } else if (response.status === 403) {
+    if (response.status === 403) {
       throw new ApiError({
         level: STATUS_INDICATORS.ERROR,
         message:
@@ -120,7 +102,7 @@ export function patchConfig(body: any): RequestInit {
       message: errorMessage,
     });
   }
-}*/
+}
 
 /**
  * Default catch handler for all service requests.
@@ -129,17 +111,17 @@ export function patchConfig(body: any): RequestInit {
  * @param errorMessage The error message to be included in the ApiError object.
  */
 
-/*export function defaultCatchHandler(
+export function defaultCatchHandler(
   error: Error,
-  errorMessage = "Es ist ein Fehler im CatchHandler aufgetreten."
+  errorMessage = "Es ist ein unbekannter Fehler aufgetreten."
 ): PromiseLike<never> {
   throw new ApiError({
     level: STATUS_INDICATORS.WARNING,
-    message: error.name + ": " + error.message,
+    message: errorMessage,
   });
-}*/
+}
 
-export function responseHandler(response: Response): Promise<Response> {
+export function wlsResponseHandler(response: Response): Promise<Response> {
   if (response.status === 204) {
     throw new ApiError({
       level: STATUS_INDICATORS.INFO,
@@ -152,7 +134,7 @@ export function responseHandler(response: Response): Promise<Response> {
   }
 }
 
-export function catchHandler(response: Response): Promise<any> {
+export function wlsCatchHandler(response: Response): PromiseLike<never> {
   if (response.status === 400) {
     // 400 ist nicht immer eine wls exception..
     return response.json().then((content: WLSException) => {

From 010d6444d38c11df12511b76e7fe5be1560c044a Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Fri, 6 Dec 2024 14:03:08 +0100
Subject: [PATCH 09/26] #564 :refactor: move status 204 handling to catch
 handler

---
 .../src/api/broadcast-client.ts               |  7 +++----
 .../src/api/fetch-utils.ts                    | 20 +++++++++----------
 2 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
index 9a2ace5c9..0e9b876e0 100644
--- a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
@@ -9,10 +9,9 @@ import BroadcastMessageToSend from "@/types/BroadcastMessageToSend";
 export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
 
 export function getBroadcastMessage(wahlbezirkID: string): Promise<Response> {
-  return fetch(
-    BROADCAST_API_URL + "getMessage/" + wahlbezirkID,
-    getConfig()
-  ).then(wlsResponseHandler);
+  return fetch(BROADCAST_API_URL + "getMessage/" + wahlbezirkID, getConfig())
+    .then(wlsResponseHandler)
+    .catch(wlsCatchHandler);
 }
 
 export function postBroadcastMessage(
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 1c2b6caf5..91cf9bea0 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -110,7 +110,6 @@ export function defaultResponseHandler(
  * @param error The error object from fetch command
  * @param errorMessage The error message to be included in the ApiError object.
  */
-
 export function defaultCatchHandler(
   error: Error,
   errorMessage = "Es ist ein unbekannter Fehler aufgetreten."
@@ -122,21 +121,22 @@ export function defaultCatchHandler(
 }
 
 export function wlsResponseHandler(response: Response): Promise<Response> {
-  if (response.status === 204) {
-    throw new ApiError({
-      level: STATUS_INDICATORS.INFO,
-      message: "Es konnten keine Daten gefunden werden. (204)",
-    });
-  } else if (response.ok) {
-    return Promise.resolve(response);
-  } else {
+  if (!response.ok || response.status === 204) {
     return Promise.reject(response);
+  } else {
+    return Promise.resolve(response);
   }
 }
 
 export function wlsCatchHandler(response: Response): PromiseLike<never> {
+  if (response.status === 204) {
+    throw new ApiError({
+      level: STATUS_INDICATORS.INFO,
+      message: "Es konnten keine Daten gefunden werden",
+    });
+  }
   if (response.status === 400) {
-    // 400 ist nicht immer eine wls exception..
+    // 400 ist nicht immer eine wls exception.. zB wenn getMessage mit falscher API URL ausgeführt wird
     return response.json().then((content: WLSException) => {
       return Promise.reject(
         new ApiError({

From a69a1f4405cd5ddb5670134d66f12005b0af8ff9 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Fri, 6 Dec 2024 14:11:39 +0100
Subject: [PATCH 10/26] #564 :art:

---
 .../views/ExampleBackendCommunicationView.vue | 26 +++++++++++--------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index f6637817b..2e33f20a1 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -5,20 +5,24 @@
     </v-col>
     <v-responsive class="mx-auto">
       <v-col class="text-center">
+        <h4>API Calls with fetch():</h4>
+        <br />
         <v-text-field
           class="ml-auto mr-auto"
           width="350"
-          v-model="messageInput"
+          v-model="messageInputFetch"
           clearable
           label="ID"
         ></v-text-field>
-        <v-btn @click="postMessage(['wbz-1', 'wbz-2'])"
+        <v-btn @click="postMessageFetch(['wbz-1', 'wbz-2'])"
           >post message with fetch utils
         </v-btn>
         <p v-if="errorPostFetch">{{ errorPostFetch }}</p>
         <br />
         <br />
-        <v-btn @click="getMessage('wbz-1')">get message with fetch utils</v-btn>
+        <v-btn @click="getMessageFetch('wbz-1')"
+          >get message with fetch utils</v-btn
+        >
         <pre v-if="messageFetch"> {{ messageFetch }} </pre>
         <p v-if="errorGetFetch">{{ errorGetFetch }}</p>
         <p v-if="errorReadFetch">{{ errorReadFetch }}</p>
@@ -48,14 +52,14 @@ import { STATUS_INDICATORS } from "@/constants";
 import { useSnackbarStore } from "@/stores/snackbar";
 
 const snackbarStore = useSnackbarStore();
-const messageInput = ref("Broadcast Message");
+const messageInputFetch = ref("Broadcast Message");
 const messageFetch = ref("Click Button to Load Message");
 const errorGetFetch = ref("");
 const errorPostFetch = ref("");
 const errorReadFetch = ref("");
-let messageFetchId = "";
+let messageIdFetch = "";
 
-function getMessage(wahlbezirkID: string) {
+function getMessageFetch(wahlbezirkID: string) {
   errorGetFetch.value = "";
   messageFetch.value = "";
   getBroadcastMessage(wahlbezirkID)
@@ -64,8 +68,8 @@ function getMessage(wahlbezirkID: string) {
     })
     .then((content: BroadcastMessageToRead) => {
       messageFetch.value = content.nachricht;
-      messageFetchId = content.oid;
-      broadcastMessageRead(messageFetchId).catch((e) => {
+      messageIdFetch = content.oid;
+      broadcastMessageRead(messageIdFetch).catch((e) => {
         errorReadFetch.value =
           "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
       });
@@ -76,12 +80,12 @@ function getMessage(wahlbezirkID: string) {
     });
 }
 
-function postMessage(wahlbezirkIDs: string[]) {
+function postMessageFetch(wahlbezirkIDs: string[]) {
   errorPostFetch.value = "";
-  postBroadcastMessage(wahlbezirkIDs, messageInput.value).catch((e) => {
+  postBroadcastMessage(wahlbezirkIDs, messageInputFetch.value).catch((e) => {
     errorPostFetch.value = e.message;
     snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
   });
-  messageInput.value = "";
+  messageInputFetch.value = "";
 }
 </script>

From 429be83087dc893072d35ec4209d3a60e18a4e53 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Fri, 6 Dec 2024 14:14:51 +0100
Subject: [PATCH 11/26] #564 add ui for api calls with axios

---
 .../views/ExampleBackendCommunicationView.vue | 36 +++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 2e33f20a1..86372e591 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -21,13 +21,38 @@
         <br />
         <br />
         <v-btn @click="getMessageFetch('wbz-1')"
-          >get message with fetch utils</v-btn
-        >
+          >get message with fetch utils
+        </v-btn>
         <pre v-if="messageFetch"> {{ messageFetch }} </pre>
         <p v-if="errorGetFetch">{{ errorGetFetch }}</p>
         <p v-if="errorReadFetch">{{ errorReadFetch }}</p>
       </v-col>
     </v-responsive>
+    <v-responsive class="mx-auto">
+      <v-col class="text-center">
+        <h4>API Calls with axios():</h4>
+        <br />
+        <v-text-field
+          class="ml-auto mr-auto"
+          width="350"
+          v-model="messageInputAxios"
+          clearable
+          label="ID"
+        ></v-text-field>
+        <v-btn @click="postMessageAxios(['wbz-1', 'wbz-2'])"
+          >post message with fetch utils
+        </v-btn>
+        <p v-if="errorPostAxios">{{ errorPostAxios }}</p>
+        <br />
+        <br />
+        <v-btn @click="getMessageAxios('wbz-1')"
+          >get message with fetch utils
+        </v-btn>
+        <pre v-if="messageAxios"> {{ messageAxios }} </pre>
+        <p v-if="errorGetAxios">{{ errorGetAxios }}</p>
+        <p v-if="errorReadAxios">{{ errorReadAxios }}</p>
+      </v-col>
+    </v-responsive>
   </v-container>
 </template>
 
@@ -59,6 +84,13 @@ const errorPostFetch = ref("");
 const errorReadFetch = ref("");
 let messageIdFetch = "";
 
+const messageInputAxios = ref("Broadcast Message");
+const messageAxios = ref("Click Button to Load Message");
+const errorGetAxios = ref("");
+const errorPostAxios = ref("");
+const errorReadAxios = ref("");
+let messageIdAxios = "";
+
 function getMessageFetch(wahlbezirkID: string) {
   errorGetFetch.value = "";
   messageFetch.value = "";

From 3e153b656368ab6f07c4a876d476a08c278ea7a7 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Mon, 9 Dec 2024 13:16:14 +0100
Subject: [PATCH 12/26] #564 add axios dependency

---
 wls-gui-wahllokalsystem/package-lock.json | 41 +++++++++++++++++++----
 wls-gui-wahllokalsystem/package.json      |  1 +
 2 files changed, 36 insertions(+), 6 deletions(-)

diff --git a/wls-gui-wahllokalsystem/package-lock.json b/wls-gui-wahllokalsystem/package-lock.json
index 055293ae8..48bac6756 100644
--- a/wls-gui-wahllokalsystem/package-lock.json
+++ b/wls-gui-wahllokalsystem/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "@vueuse/core": "11.2.0",
+        "axios": "^1.7.9",
         "pinia": "2.2.6",
         "roboto-fontface": "0.10.0",
         "vue": "3.5.12",
@@ -1887,9 +1888,18 @@
     "node_modules/asynckit": {
       "version": "0.4.0",
       "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
-      "dev": true,
       "license": "MIT"
     },
+    "node_modules/axios": {
+      "version": "1.7.9",
+      "integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.15.6",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
@@ -2003,7 +2013,6 @@
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "delayed-stream": "~1.0.0"
@@ -2140,7 +2149,6 @@
     "node_modules/delayed-stream": {
       "version": "1.0.0",
       "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.4.0"
@@ -2658,6 +2666,25 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/follow-redirects": {
+      "version": "1.15.9",
+      "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/foreground-child": {
       "version": "3.3.0",
       "integrity": "sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==",
@@ -2677,7 +2704,6 @@
     "node_modules/form-data": {
       "version": "4.0.1",
       "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "asynckit": "^0.4.0",
@@ -3144,7 +3170,6 @@
     "node_modules/mime-db": {
       "version": "1.52.0",
       "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
@@ -3153,7 +3178,6 @@
     "node_modules/mime-types": {
       "version": "2.1.35",
       "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "mime-db": "1.52.0"
@@ -3535,6 +3559,11 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
+      "license": "MIT"
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
diff --git a/wls-gui-wahllokalsystem/package.json b/wls-gui-wahllokalsystem/package.json
index 628ed75f5..e2c89b13f 100644
--- a/wls-gui-wahllokalsystem/package.json
+++ b/wls-gui-wahllokalsystem/package.json
@@ -16,6 +16,7 @@
   },
   "dependencies": {
     "@vueuse/core": "11.2.0",
+    "axios": "^1.7.9",
     "pinia": "2.2.6",
     "roboto-fontface": "0.10.0",
     "vue": "3.5.12",

From 0556c0c9c652bd79833590355a70425349c6e429 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 08:51:34 +0100
Subject: [PATCH 13/26] #564 add axios api calls

---
 .../src/api/axios-utils.ts                    | 40 +++++++++++++++++++
 .../src/api/boradcast-client-axios.ts         | 28 +++++++++++++
 .../views/ExampleBackendCommunicationView.vue | 40 +++++++++++++++++--
 3 files changed, 104 insertions(+), 4 deletions(-)
 create mode 100644 wls-gui-wahllokalsystem/src/api/axios-utils.ts
 create mode 100644 wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts

diff --git a/wls-gui-wahllokalsystem/src/api/axios-utils.ts b/wls-gui-wahllokalsystem/src/api/axios-utils.ts
new file mode 100644
index 000000000..5e186c8bf
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/api/axios-utils.ts
@@ -0,0 +1,40 @@
+import type WLSException from "@/types/WLSException";
+import type { AxiosError, AxiosResponse } from "axios";
+
+import { ApiError } from "@/api/ApiError";
+import { STATUS_INDICATORS } from "@/constants";
+
+export function responseHandler(response: AxiosResponse) {
+  if (response.status === 204 || response.status >= 300) {
+    return Promise.reject(response);
+  } else {
+    return Promise.resolve(response.data);
+  }
+}
+
+export function catchHandler(error: AxiosError) {
+  if (error.response) {
+    if (error.status === 204) {
+      throw new ApiError({
+        level: STATUS_INDICATORS.INFO,
+        message: "Es konnten keine Daten gefunden werden",
+      });
+    }
+    if (error.status === 400) {
+      const wlsException = error.response.data as WLSException;
+      return Promise.reject(
+        new ApiError({
+          level: STATUS_INDICATORS.ERROR,
+          message: wlsException.message,
+        })
+      );
+    } else {
+      return Promise.reject(
+        new ApiError({
+          level: STATUS_INDICATORS.ERROR,
+          message: "unbekannter fehler", // zb wenn broadcast nicht gestartet ist
+        })
+      );
+    }
+  }
+}
diff --git a/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts b/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts
new file mode 100644
index 000000000..27aa03cdd
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts
@@ -0,0 +1,28 @@
+import axios from "axios";
+
+import { catchHandler, responseHandler } from "@/api/axios-utils";
+import { wlsCatchHandler } from "@/api/fetch-utils";
+import BroadcastMessageSendAxios from "@/types/BroadcastMessageToSend";
+
+export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
+
+export async function getBroadcastMessageAxios(wahlbezirkID: string) {
+  const url = `${BROADCAST_API_URL}getMessage/${wahlbezirkID}`;
+  return await axios.get(url).then(responseHandler).catch(wlsCatchHandler);
+}
+
+export async function broadcastMessageReadAxios(nachrichtID: string) {
+  const url = `${BROADCAST_API_URL}messageRead/${nachrichtID}`;
+  return axios.post(url).then(responseHandler).catch(wlsCatchHandler);
+}
+
+export async function postBroadcastMessageAxios(
+  wahlbezirkIDs: string[],
+  nachricht: string
+) {
+  const url = `${BROADCAST_API_URL}broadcast`;
+  return axios
+    .post(url, new BroadcastMessageSendAxios(wahlbezirkIDs, nachricht))
+    .then(responseHandler)
+    .catch(catchHandler);
+}
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 86372e591..5cd813577 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -40,14 +40,12 @@
           label="ID"
         ></v-text-field>
         <v-btn @click="postMessageAxios(['wbz-1', 'wbz-2'])"
-          >post message with fetch utils
+          >post message with axios
         </v-btn>
         <p v-if="errorPostAxios">{{ errorPostAxios }}</p>
         <br />
         <br />
-        <v-btn @click="getMessageAxios('wbz-1')"
-          >get message with fetch utils
-        </v-btn>
+        <v-btn @click="getMessageAxios('wbz-1')">get message with axios</v-btn>
         <pre v-if="messageAxios"> {{ messageAxios }} </pre>
         <p v-if="errorGetAxios">{{ errorGetAxios }}</p>
         <p v-if="errorReadAxios">{{ errorReadAxios }}</p>
@@ -68,6 +66,11 @@ import {
   VTextField,
 } from "vuetify/components";
 
+import {
+  broadcastMessageReadAxios,
+  getBroadcastMessageAxios,
+  postBroadcastMessageAxios,
+} from "@/api/boradcast-client-axios";
 import {
   broadcastMessageRead,
   getBroadcastMessage,
@@ -120,4 +123,33 @@ function postMessageFetch(wahlbezirkIDs: string[]) {
   });
   messageInputFetch.value = "";
 }
+
+function getMessageAxios(wahlbezirkID: string) {
+  errorGetAxios.value = "";
+  messageAxios.value = "";
+  getBroadcastMessageAxios(wahlbezirkID)
+    .then((content: BroadcastMessageToRead) => {
+      messageAxios.value = content.nachricht;
+      messageIdAxios = content.oid;
+      broadcastMessageReadAxios(messageIdAxios).catch((e) => {
+        errorReadFetch.value =
+          "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
+      });
+    })
+    .catch((e) => {
+      errorGetAxios.value = e.message;
+      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
+    });
+}
+
+function postMessageAxios(wahlbezirkIDs: string[]) {
+  errorPostAxios.value = "";
+  postBroadcastMessageAxios(wahlbezirkIDs, messageInputAxios.value).catch(
+    (e) => {
+      errorPostAxios.value = e.message;
+      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
+    }
+  );
+  messageInputAxios.value = "";
+}
 </script>

From 54494c7b1a71d7034a51c3ee775215f7e23afe83 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 12:39:48 +0100
Subject: [PATCH 14/26] #564 remove axios example

---
 wls-gui-wahllokalsystem/package-lock.json     | 35 ----------
 wls-gui-wahllokalsystem/package.json          |  1 -
 .../src/api/axios-utils.ts                    | 40 ------------
 .../src/api/boradcast-client-axios.ts         | 28 --------
 .../views/ExampleBackendCommunicationView.vue | 64 -------------------
 5 files changed, 168 deletions(-)
 delete mode 100644 wls-gui-wahllokalsystem/src/api/axios-utils.ts
 delete mode 100644 wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts

diff --git a/wls-gui-wahllokalsystem/package-lock.json b/wls-gui-wahllokalsystem/package-lock.json
index 48bac6756..2b362f5b2 100644
--- a/wls-gui-wahllokalsystem/package-lock.json
+++ b/wls-gui-wahllokalsystem/package-lock.json
@@ -9,7 +9,6 @@
       "version": "0.0.0",
       "dependencies": {
         "@vueuse/core": "11.2.0",
-        "axios": "^1.7.9",
         "pinia": "2.2.6",
         "roboto-fontface": "0.10.0",
         "vue": "3.5.12",
@@ -1890,16 +1889,6 @@
       "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
       "license": "MIT"
     },
-    "node_modules/axios": {
-      "version": "1.7.9",
-      "integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==",
-      "license": "MIT",
-      "dependencies": {
-        "follow-redirects": "^1.15.6",
-        "form-data": "^4.0.0",
-        "proxy-from-env": "^1.1.0"
-      }
-    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
@@ -2666,25 +2655,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/follow-redirects": {
-      "version": "1.15.9",
-      "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==",
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/RubenVerborgh"
-        }
-      ],
-      "license": "MIT",
-      "engines": {
-        "node": ">=4.0"
-      },
-      "peerDependenciesMeta": {
-        "debug": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/foreground-child": {
       "version": "3.3.0",
       "integrity": "sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==",
@@ -3559,11 +3529,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/proxy-from-env": {
-      "version": "1.1.0",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "license": "MIT"
-    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
diff --git a/wls-gui-wahllokalsystem/package.json b/wls-gui-wahllokalsystem/package.json
index e2c89b13f..628ed75f5 100644
--- a/wls-gui-wahllokalsystem/package.json
+++ b/wls-gui-wahllokalsystem/package.json
@@ -16,7 +16,6 @@
   },
   "dependencies": {
     "@vueuse/core": "11.2.0",
-    "axios": "^1.7.9",
     "pinia": "2.2.6",
     "roboto-fontface": "0.10.0",
     "vue": "3.5.12",
diff --git a/wls-gui-wahllokalsystem/src/api/axios-utils.ts b/wls-gui-wahllokalsystem/src/api/axios-utils.ts
deleted file mode 100644
index 5e186c8bf..000000000
--- a/wls-gui-wahllokalsystem/src/api/axios-utils.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import type WLSException from "@/types/WLSException";
-import type { AxiosError, AxiosResponse } from "axios";
-
-import { ApiError } from "@/api/ApiError";
-import { STATUS_INDICATORS } from "@/constants";
-
-export function responseHandler(response: AxiosResponse) {
-  if (response.status === 204 || response.status >= 300) {
-    return Promise.reject(response);
-  } else {
-    return Promise.resolve(response.data);
-  }
-}
-
-export function catchHandler(error: AxiosError) {
-  if (error.response) {
-    if (error.status === 204) {
-      throw new ApiError({
-        level: STATUS_INDICATORS.INFO,
-        message: "Es konnten keine Daten gefunden werden",
-      });
-    }
-    if (error.status === 400) {
-      const wlsException = error.response.data as WLSException;
-      return Promise.reject(
-        new ApiError({
-          level: STATUS_INDICATORS.ERROR,
-          message: wlsException.message,
-        })
-      );
-    } else {
-      return Promise.reject(
-        new ApiError({
-          level: STATUS_INDICATORS.ERROR,
-          message: "unbekannter fehler", // zb wenn broadcast nicht gestartet ist
-        })
-      );
-    }
-  }
-}
diff --git a/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts b/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts
deleted file mode 100644
index 27aa03cdd..000000000
--- a/wls-gui-wahllokalsystem/src/api/boradcast-client-axios.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import axios from "axios";
-
-import { catchHandler, responseHandler } from "@/api/axios-utils";
-import { wlsCatchHandler } from "@/api/fetch-utils";
-import BroadcastMessageSendAxios from "@/types/BroadcastMessageToSend";
-
-export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
-
-export async function getBroadcastMessageAxios(wahlbezirkID: string) {
-  const url = `${BROADCAST_API_URL}getMessage/${wahlbezirkID}`;
-  return await axios.get(url).then(responseHandler).catch(wlsCatchHandler);
-}
-
-export async function broadcastMessageReadAxios(nachrichtID: string) {
-  const url = `${BROADCAST_API_URL}messageRead/${nachrichtID}`;
-  return axios.post(url).then(responseHandler).catch(wlsCatchHandler);
-}
-
-export async function postBroadcastMessageAxios(
-  wahlbezirkIDs: string[],
-  nachricht: string
-) {
-  const url = `${BROADCAST_API_URL}broadcast`;
-  return axios
-    .post(url, new BroadcastMessageSendAxios(wahlbezirkIDs, nachricht))
-    .then(responseHandler)
-    .catch(catchHandler);
-}
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 5cd813577..f9413a08e 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -28,29 +28,6 @@
         <p v-if="errorReadFetch">{{ errorReadFetch }}</p>
       </v-col>
     </v-responsive>
-    <v-responsive class="mx-auto">
-      <v-col class="text-center">
-        <h4>API Calls with axios():</h4>
-        <br />
-        <v-text-field
-          class="ml-auto mr-auto"
-          width="350"
-          v-model="messageInputAxios"
-          clearable
-          label="ID"
-        ></v-text-field>
-        <v-btn @click="postMessageAxios(['wbz-1', 'wbz-2'])"
-          >post message with axios
-        </v-btn>
-        <p v-if="errorPostAxios">{{ errorPostAxios }}</p>
-        <br />
-        <br />
-        <v-btn @click="getMessageAxios('wbz-1')">get message with axios</v-btn>
-        <pre v-if="messageAxios"> {{ messageAxios }} </pre>
-        <p v-if="errorGetAxios">{{ errorGetAxios }}</p>
-        <p v-if="errorReadAxios">{{ errorReadAxios }}</p>
-      </v-col>
-    </v-responsive>
   </v-container>
 </template>
 
@@ -66,11 +43,6 @@ import {
   VTextField,
 } from "vuetify/components";
 
-import {
-  broadcastMessageReadAxios,
-  getBroadcastMessageAxios,
-  postBroadcastMessageAxios,
-} from "@/api/boradcast-client-axios";
 import {
   broadcastMessageRead,
   getBroadcastMessage,
@@ -87,13 +59,6 @@ const errorPostFetch = ref("");
 const errorReadFetch = ref("");
 let messageIdFetch = "";
 
-const messageInputAxios = ref("Broadcast Message");
-const messageAxios = ref("Click Button to Load Message");
-const errorGetAxios = ref("");
-const errorPostAxios = ref("");
-const errorReadAxios = ref("");
-let messageIdAxios = "";
-
 function getMessageFetch(wahlbezirkID: string) {
   errorGetFetch.value = "";
   messageFetch.value = "";
@@ -123,33 +88,4 @@ function postMessageFetch(wahlbezirkIDs: string[]) {
   });
   messageInputFetch.value = "";
 }
-
-function getMessageAxios(wahlbezirkID: string) {
-  errorGetAxios.value = "";
-  messageAxios.value = "";
-  getBroadcastMessageAxios(wahlbezirkID)
-    .then((content: BroadcastMessageToRead) => {
-      messageAxios.value = content.nachricht;
-      messageIdAxios = content.oid;
-      broadcastMessageReadAxios(messageIdAxios).catch((e) => {
-        errorReadFetch.value =
-          "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
-      });
-    })
-    .catch((e) => {
-      errorGetAxios.value = e.message;
-      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
-    });
-}
-
-function postMessageAxios(wahlbezirkIDs: string[]) {
-  errorPostAxios.value = "";
-  postBroadcastMessageAxios(wahlbezirkIDs, messageInputAxios.value).catch(
-    (e) => {
-      errorPostAxios.value = e.message;
-      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
-    }
-  );
-  messageInputAxios.value = "";
-}
 </script>

From 3dd461d9e119199babeecd1fe0165fe02735fcec Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 12:40:39 +0100
Subject: [PATCH 15/26] #564 fix package-lock.json

---
 wls-gui-wahllokalsystem/package-lock.json | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/wls-gui-wahllokalsystem/package-lock.json b/wls-gui-wahllokalsystem/package-lock.json
index 2b362f5b2..055293ae8 100644
--- a/wls-gui-wahllokalsystem/package-lock.json
+++ b/wls-gui-wahllokalsystem/package-lock.json
@@ -1887,6 +1887,7 @@
     "node_modules/asynckit": {
       "version": "0.4.0",
       "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/balanced-match": {
@@ -2002,6 +2003,7 @@
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "delayed-stream": "~1.0.0"
@@ -2138,6 +2140,7 @@
     "node_modules/delayed-stream": {
       "version": "1.0.0",
       "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.4.0"
@@ -2674,6 +2677,7 @@
     "node_modules/form-data": {
       "version": "4.0.1",
       "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "asynckit": "^0.4.0",
@@ -3140,6 +3144,7 @@
     "node_modules/mime-db": {
       "version": "1.52.0",
       "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
@@ -3148,6 +3153,7 @@
     "node_modules/mime-types": {
       "version": "2.1.35",
       "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "mime-db": "1.52.0"

From 6b4f8265b762b4c2cda092f6085eb6190ad1f17c Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 14:07:34 +0100
Subject: [PATCH 16/26] #564 :recycle:, :truck:

---
 .../src/api/fetch-utils.ts                    |  2 +-
 .../api/{ => wls-clients}/broadcast-client.ts |  2 +-
 .../src/types/BroadcastMessageToRead.ts       | 11 ----------
 .../src/types/BroadcastMessageToSend.ts       |  9 --------
 .../src/types/wls-types/BroadcastMessage.ts   | 21 +++++++++++++++++++
 .../src/types/{ => wls-types}/WLSException.ts |  0
 .../views/ExampleBackendCommunicationView.vue |  5 ++---
 7 files changed, 25 insertions(+), 25 deletions(-)
 rename wls-gui-wahllokalsystem/src/api/{ => wls-clients}/broadcast-client.ts (92%)
 delete mode 100644 wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
 delete mode 100644 wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts
 create mode 100644 wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
 rename wls-gui-wahllokalsystem/src/types/{ => wls-types}/WLSException.ts (100%)

diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 91cf9bea0..718864e76 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -1,4 +1,4 @@
-import type WLSException from "@/types/WLSException";
+import type WLSException from "@/types/wls-types/WLSException";
 
 import { ApiError } from "@/api/ApiError";
 import { STATUS_INDICATORS } from "@/constants";
diff --git a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
similarity index 92%
rename from wls-gui-wahllokalsystem/src/api/broadcast-client.ts
rename to wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
index 0e9b876e0..394c6a503 100644
--- a/wls-gui-wahllokalsystem/src/api/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
@@ -4,7 +4,7 @@ import {
   wlsCatchHandler,
   wlsResponseHandler,
 } from "@/api/fetch-utils";
-import BroadcastMessageToSend from "@/types/BroadcastMessageToSend";
+import { BroadcastMessageToSend } from "@/types/wls-types/BroadcastMessage";
 
 export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
 
diff --git a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
deleted file mode 100644
index 6ee22e654..000000000
--- a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToRead.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export default class BroadcastMessageToRead {
-  oid: string;
-  wahlbezirkIDs: string[];
-  nachricht: string;
-
-  constructor(oid: string, wahlbezirkIDs: string[], nachricht: string) {
-    this.oid = oid;
-    this.wahlbezirkIDs = wahlbezirkIDs;
-    this.nachricht = nachricht;
-  }
-}
diff --git a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts b/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts
deleted file mode 100644
index 9ebeabdbd..000000000
--- a/wls-gui-wahllokalsystem/src/types/BroadcastMessageToSend.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export default class BroadcastMessageToSend {
-  wahlbezirkIDs: string[];
-  nachricht: string;
-
-  constructor(wahlbezirkIDs: string[], nachricht: string) {
-    this.wahlbezirkIDs = wahlbezirkIDs;
-    this.nachricht = nachricht;
-  }
-}
diff --git a/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts b/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
new file mode 100644
index 000000000..16d48b3c5
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
@@ -0,0 +1,21 @@
+export class BroadcastMessageToRead {
+  oid: string;
+  wahlbezirkIDs: string[];
+  nachricht: string;
+
+  constructor(oid: string, wahlbezirkIDs: string[], nachricht: string) {
+    this.oid = oid;
+    this.wahlbezirkIDs = wahlbezirkIDs;
+    this.nachricht = nachricht;
+  }
+}
+
+export class BroadcastMessageToSend {
+  wahlbezirkIDs: string[];
+  nachricht: string;
+
+  constructor(wahlbezirkIDs: string[], nachricht: string) {
+    this.wahlbezirkIDs = wahlbezirkIDs;
+    this.nachricht = nachricht;
+  }
+}
diff --git a/wls-gui-wahllokalsystem/src/types/WLSException.ts b/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
similarity index 100%
rename from wls-gui-wahllokalsystem/src/types/WLSException.ts
rename to wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index f9413a08e..67d1f0272 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -32,8 +32,6 @@
 </template>
 
 <script setup lang="ts">
-import type BroadcastMessageToRead from "@/types/BroadcastMessageToRead";
-
 import { ref } from "vue";
 import {
   VBtn,
@@ -47,9 +45,10 @@ import {
   broadcastMessageRead,
   getBroadcastMessage,
   postBroadcastMessage,
-} from "@/api/broadcast-client";
+} from "@/api/wls-clients/broadcast-client";
 import { STATUS_INDICATORS } from "@/constants";
 import { useSnackbarStore } from "@/stores/snackbar";
+import { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
 
 const snackbarStore = useSnackbarStore();
 const messageInputFetch = ref("Broadcast Message");

From 7dfb74a80b5a6dd0557f3b40af6ce7fb3dfca181 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 14:11:56 +0100
Subject: [PATCH 17/26] #564 :recycle:, :art:

---
 .../views/ExampleBackendCommunicationView.vue | 44 +++++++++----------
 1 file changed, 21 insertions(+), 23 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 67d1f0272..78be2cc35 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -5,27 +5,27 @@
     </v-col>
     <v-responsive class="mx-auto">
       <v-col class="text-center">
-        <h4>API Calls with fetch():</h4>
+        <h4>Get or Post a Broadcast message:</h4>
         <br />
         <v-text-field
           class="ml-auto mr-auto"
           width="350"
-          v-model="messageInputFetch"
+          v-model="messageInput"
           clearable
           label="ID"
         ></v-text-field>
         <v-btn @click="postMessageFetch(['wbz-1', 'wbz-2'])"
           >post message with fetch utils
         </v-btn>
-        <p v-if="errorPostFetch">{{ errorPostFetch }}</p>
+        <p v-if="errors.post">{{ errors.post }}</p>
         <br />
         <br />
         <v-btn @click="getMessageFetch('wbz-1')"
           >get message with fetch utils
         </v-btn>
-        <pre v-if="messageFetch"> {{ messageFetch }} </pre>
-        <p v-if="errorGetFetch">{{ errorGetFetch }}</p>
-        <p v-if="errorReadFetch">{{ errorReadFetch }}</p>
+        <pre v-if="message"> {{ message }} </pre>
+        <p v-if="errors.get">{{ errors.get }}</p>
+        <p v-if="errors.read">{{ errors.read }}</p>
       </v-col>
     </v-responsive>
   </v-container>
@@ -51,40 +51,38 @@ import { useSnackbarStore } from "@/stores/snackbar";
 import { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
 
 const snackbarStore = useSnackbarStore();
-const messageInputFetch = ref("Broadcast Message");
-const messageFetch = ref("Click Button to Load Message");
-const errorGetFetch = ref("");
-const errorPostFetch = ref("");
-const errorReadFetch = ref("");
-let messageIdFetch = "";
+const messageInput = ref("Broadcast Message");
+const message = ref("");
+const errors = ref({ get: "", post: "", read: "" });
+let messageId = "";
 
 function getMessageFetch(wahlbezirkID: string) {
-  errorGetFetch.value = "";
-  messageFetch.value = "";
+  errors.value.get = "";
+  message.value = "";
   getBroadcastMessage(wahlbezirkID)
     .then((response) => {
       return response.json();
     })
     .then((content: BroadcastMessageToRead) => {
-      messageFetch.value = content.nachricht;
-      messageIdFetch = content.oid;
-      broadcastMessageRead(messageIdFetch).catch((e) => {
-        errorReadFetch.value =
+      message.value = content.nachricht;
+      messageId = content.oid;
+      broadcastMessageRead(messageId).catch((e) => {
+        errors.value.read =
           "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
       });
     })
     .catch((e) => {
-      errorGetFetch.value = e.message;
+      errors.value.get = e.message;
       snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
     });
 }
 
 function postMessageFetch(wahlbezirkIDs: string[]) {
-  errorPostFetch.value = "";
-  postBroadcastMessage(wahlbezirkIDs, messageInputFetch.value).catch((e) => {
-    errorPostFetch.value = e.message;
+  errors.value.post = "";
+  postBroadcastMessage(wahlbezirkIDs, messageInput.value).catch((e) => {
+    errors.value.post = e.message;
     snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
   });
-  messageInputFetch.value = "";
+  messageInput.value = "";
 }
 </script>

From aa92b5048e1882ffb4856927783dbacd6d64b6b3 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 14:47:45 +0100
Subject: [PATCH 18/26] #564 :recycle: fetch-utils + error display, :art:

---
 .../src/api/fetch-utils.ts                    | 31 ++++++++++---------
 .../views/ExampleBackendCommunicationView.vue | 13 +++-----
 2 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 718864e76..9bf883cae 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -136,22 +136,15 @@ export function wlsCatchHandler(response: Response): PromiseLike<never> {
     });
   }
   if (response.status === 400) {
-    // 400 ist nicht immer eine wls exception.. zB wenn getMessage mit falscher API URL ausgeführt wird
-    return response.json().then((content: WLSException) => {
-      return Promise.reject(
-        new ApiError({
-          level: STATUS_INDICATORS.ERROR,
-          message: content.message,
-        })
-      );
+    return response.json().then((content) => {
+      if (isWLSException(content)) {
+        return Promise.reject(new ApiError({ message: content.message }));
+      } else {
+        return Promise.reject(new ApiError({ message: "Error: Bad Request" }));
+      }
     });
   } else {
-    return Promise.reject(
-      new ApiError({
-        level: STATUS_INDICATORS.ERROR,
-        message: "unbekannter fehler",
-      })
-    );
+    return Promise.reject(new ApiError({ message: "unbekannter fehler" }));
   }
 }
 
@@ -180,3 +173,13 @@ function getXSRFToken(): string {
   );
   return (help ? help.pop() : "") as string;
 }
+
+function isWLSException(obj: any): obj is WLSException {
+  return (
+    obj &&
+    typeof obj.category === "string" &&
+    typeof obj.code === "string" &&
+    typeof obj.message === "string" &&
+    typeof obj.service === "string"
+  );
+}
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index 78be2cc35..d4eea395d 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -14,13 +14,13 @@
           clearable
           label="ID"
         ></v-text-field>
-        <v-btn @click="postMessageFetch(['wbz-1', 'wbz-2'])"
+        <v-btn @click="postMessage(['wbz-1', 'wbz-2'])"
           >post message with fetch utils
         </v-btn>
         <p v-if="errors.post">{{ errors.post }}</p>
         <br />
         <br />
-        <v-btn @click="getMessageFetch('wbz-1')"
+        <v-btn @click="getMessage('wbz-1')"
           >get message with fetch utils
         </v-btn>
         <pre v-if="message"> {{ message }} </pre>
@@ -46,17 +46,14 @@ import {
   getBroadcastMessage,
   postBroadcastMessage,
 } from "@/api/wls-clients/broadcast-client";
-import { STATUS_INDICATORS } from "@/constants";
-import { useSnackbarStore } from "@/stores/snackbar";
 import { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
 
-const snackbarStore = useSnackbarStore();
 const messageInput = ref("Broadcast Message");
 const message = ref("");
 const errors = ref({ get: "", post: "", read: "" });
 let messageId = "";
 
-function getMessageFetch(wahlbezirkID: string) {
+function getMessage(wahlbezirkID: string) {
   errors.value.get = "";
   message.value = "";
   getBroadcastMessage(wahlbezirkID)
@@ -73,15 +70,13 @@ function getMessageFetch(wahlbezirkID: string) {
     })
     .catch((e) => {
       errors.value.get = e.message;
-      snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
     });
 }
 
-function postMessageFetch(wahlbezirkIDs: string[]) {
+function postMessage(wahlbezirkIDs: string[]) {
   errors.value.post = "";
   postBroadcastMessage(wahlbezirkIDs, messageInput.value).catch((e) => {
     errors.value.post = e.message;
-    snackbarStore.showMessage({ message: e, level: STATUS_INDICATORS.ERROR });
   });
   messageInput.value = "";
 }

From 25af01af53d38d540bad04eb25f799c4af80b0b2 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 15:18:06 +0100
Subject: [PATCH 19/26] #564 make BroadcastMessageToRead an interface

---
 .../src/types/wls-types/BroadcastMessage.ts        | 14 ++++----------
 .../src/views/ExampleBackendCommunicationView.vue  |  3 ++-
 2 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts b/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
index 16d48b3c5..bf3524355 100644
--- a/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
+++ b/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
@@ -1,13 +1,7 @@
-export class BroadcastMessageToRead {
-  oid: string;
-  wahlbezirkIDs: string[];
-  nachricht: string;
-
-  constructor(oid: string, wahlbezirkIDs: string[], nachricht: string) {
-    this.oid = oid;
-    this.wahlbezirkIDs = wahlbezirkIDs;
-    this.nachricht = nachricht;
-  }
+export interface BroadcastMessageToRead {
+  readonly oid: string;
+  readonly wahlbezirkIDs: string[];
+  readonly nachricht: string;
 }
 
 export class BroadcastMessageToSend {
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index d4eea395d..d75d7cdbb 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -32,6 +32,8 @@
 </template>
 
 <script setup lang="ts">
+import type { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
+
 import { ref } from "vue";
 import {
   VBtn,
@@ -46,7 +48,6 @@ import {
   getBroadcastMessage,
   postBroadcastMessage,
 } from "@/api/wls-clients/broadcast-client";
-import { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
 
 const messageInput = ref("Broadcast Message");
 const message = ref("");

From ca77b8a7b8e2e091f90fff4ecabdeda06e0788d0 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 15:26:42 +0100
Subject: [PATCH 20/26] #564 use URL constructor + use template literal

---
 .../src/api/wls-clients/broadcast-client.ts           | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
index 394c6a503..0ec1ef0bf 100644
--- a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
@@ -6,10 +6,13 @@ import {
 } from "@/api/fetch-utils";
 import { BroadcastMessageToSend } from "@/types/wls-types/BroadcastMessage";
 
-export const BROADCAST_API_URL = "/api/broadcast-service/businessActions/";
+export const BROADCAST_API_URL = new URL(
+  "/api/broadcast-service/businessActions/",
+  window.location.origin
+).toString();
 
 export function getBroadcastMessage(wahlbezirkID: string): Promise<Response> {
-  return fetch(BROADCAST_API_URL + "getMessage/" + wahlbezirkID, getConfig())
+  return fetch(`${BROADCAST_API_URL}getMessage/` + wahlbezirkID, getConfig())
     .then(wlsResponseHandler)
     .catch(wlsCatchHandler);
 }
@@ -19,7 +22,7 @@ export function postBroadcastMessage(
   message: string
 ): Promise<Response> {
   return fetch(
-    BROADCAST_API_URL + "broadcast",
+    `${BROADCAST_API_URL}broadcast`,
     postConfig(new BroadcastMessageToSend(wahlbezirkIDs, message))
   )
     .then(wlsResponseHandler)
@@ -28,7 +31,7 @@ export function postBroadcastMessage(
 
 export function broadcastMessageRead(nachrichtID: string): Promise<Response> {
   return fetch(
-    BROADCAST_API_URL + "messageRead/" + nachrichtID,
+    `${BROADCAST_API_URL}messageRead/` + nachrichtID,
     postConfig(nachrichtID)
   )
     .then(wlsResponseHandler)

From bb9f97b862c580bccf7bd34c06d89ac0758db0d0 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Wed, 11 Dec 2024 16:02:54 +0100
Subject: [PATCH 21/26] #564 potential race condition avoided

---
 .../views/ExampleBackendCommunicationView.vue | 28 +++++++++----------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index d75d7cdbb..a74939319 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -54,24 +54,22 @@ const message = ref("");
 const errors = ref({ get: "", post: "", read: "" });
 let messageId = "";
 
-function getMessage(wahlbezirkID: string) {
+async function getMessage(wahlbezirkID: string) {
   errors.value.get = "";
   message.value = "";
-  getBroadcastMessage(wahlbezirkID)
-    .then((response) => {
-      return response.json();
-    })
-    .then((content: BroadcastMessageToRead) => {
-      message.value = content.nachricht;
-      messageId = content.oid;
-      broadcastMessageRead(messageId).catch((e) => {
-        errors.value.read =
-          "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
-      });
-    })
-    .catch((e) => {
-      errors.value.get = e.message;
+  try {
+    const response = await getBroadcastMessage(wahlbezirkID);
+    const content: BroadcastMessageToRead = await response.json();
+    message.value = content.nachricht;
+    messageId = content.oid;
+
+    await broadcastMessageRead(messageId).catch((e) => {
+      errors.value.read =
+        "Es ist ein Fehler beim Lesen der Nachricht aufgetreten";
     });
+  } catch (e) {
+    errors.value.get = (e as Error).message;
+  }
 }
 
 function postMessage(wahlbezirkIDs: string[]) {

From 4bc3e96fbc7b49b7c2e798dbcbae3e2fece88409 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 12 Dec 2024 12:04:11 +0100
Subject: [PATCH 22/26] #564 :recycle:, :truck: refactor file structure

---
 .../wls-clients/broadcast-service}/BroadcastMessage.ts        | 0
 .../wls-clients/{ => broadcast-service}/broadcast-client.ts   | 2 +-
 .../src/views/ExampleBackendCommunicationView.vue             | 4 ++--
 3 files changed, 3 insertions(+), 3 deletions(-)
 rename wls-gui-wahllokalsystem/src/{types/wls-types => api/wls-clients/broadcast-service}/BroadcastMessage.ts (100%)
 rename wls-gui-wahllokalsystem/src/api/wls-clients/{ => broadcast-service}/broadcast-client.ts (91%)

diff --git a/wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts
similarity index 100%
rename from wls-gui-wahllokalsystem/src/types/wls-types/BroadcastMessage.ts
rename to wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts
diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
similarity index 91%
rename from wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
rename to wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
index 0ec1ef0bf..9a73027f6 100644
--- a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
@@ -4,7 +4,7 @@ import {
   wlsCatchHandler,
   wlsResponseHandler,
 } from "@/api/fetch-utils";
-import { BroadcastMessageToSend } from "@/types/wls-types/BroadcastMessage";
+import { BroadcastMessageToSend } from "@/api/wls-clients/broadcast-service/BroadcastMessage";
 
 export const BROADCAST_API_URL = new URL(
   "/api/broadcast-service/businessActions/",
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index a74939319..e39313ee2 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -32,7 +32,7 @@
 </template>
 
 <script setup lang="ts">
-import type { BroadcastMessageToRead } from "@/types/wls-types/BroadcastMessage";
+import type { BroadcastMessageToRead } from "@/api/wls-clients/broadcast-service/BroadcastMessage";
 
 import { ref } from "vue";
 import {
@@ -47,7 +47,7 @@ import {
   broadcastMessageRead,
   getBroadcastMessage,
   postBroadcastMessage,
-} from "@/api/wls-clients/broadcast-client";
+} from "@/api/wls-clients/broadcast-service/broadcast-client";
 
 const messageInput = ref("Broadcast Message");
 const message = ref("");

From 09357c8ba997dcdce912fe4eee53c439056a0ea4 Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 12 Dec 2024 12:11:39 +0100
Subject: [PATCH 23/26] #564 :recycle: separate BroadcastMessageToRead +
 BroadcastMessageToSend

---
 .../broadcast-service/BroadcastMessage.ts         | 15 ---------------
 .../broadcast-service/BroadcastMessageToRead.ts   |  5 +++++
 .../broadcast-service/BroadcastMessageToSend.ts   |  6 ++++++
 .../broadcast-service/broadcast-client.ts         |  2 +-
 .../src/views/ExampleBackendCommunicationView.vue |  2 +-
 5 files changed, 13 insertions(+), 17 deletions(-)
 delete mode 100644 wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts
 create mode 100644 wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToRead.ts
 create mode 100644 wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToSend.ts

diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts
deleted file mode 100644
index bf3524355..000000000
--- a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessage.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-export interface BroadcastMessageToRead {
-  readonly oid: string;
-  readonly wahlbezirkIDs: string[];
-  readonly nachricht: string;
-}
-
-export class BroadcastMessageToSend {
-  wahlbezirkIDs: string[];
-  nachricht: string;
-
-  constructor(wahlbezirkIDs: string[], nachricht: string) {
-    this.wahlbezirkIDs = wahlbezirkIDs;
-    this.nachricht = nachricht;
-  }
-}
diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToRead.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToRead.ts
new file mode 100644
index 000000000..d15e5d1f4
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToRead.ts
@@ -0,0 +1,5 @@
+export interface BroadcastMessageToRead {
+  readonly oid: string;
+  readonly wahlbezirkIDs: string[];
+  readonly nachricht: string;
+}
diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToSend.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToSend.ts
new file mode 100644
index 000000000..9c75fc052
--- /dev/null
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/BroadcastMessageToSend.ts
@@ -0,0 +1,6 @@
+export default class BroadcastMessageToSend {
+  constructor(
+    public wahlbezirkIDs: string[],
+    public nachricht: string
+  ) {}
+}
diff --git a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
index 9a73027f6..5c4abcea1 100644
--- a/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
+++ b/wls-gui-wahllokalsystem/src/api/wls-clients/broadcast-service/broadcast-client.ts
@@ -4,7 +4,7 @@ import {
   wlsCatchHandler,
   wlsResponseHandler,
 } from "@/api/fetch-utils";
-import { BroadcastMessageToSend } from "@/api/wls-clients/broadcast-service/BroadcastMessage";
+import BroadcastMessageToSend from "@/api/wls-clients/broadcast-service/BroadcastMessageToSend";
 
 export const BROADCAST_API_URL = new URL(
   "/api/broadcast-service/businessActions/",
diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index e39313ee2..f7663b0fb 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -32,7 +32,7 @@
 </template>
 
 <script setup lang="ts">
-import type { BroadcastMessageToRead } from "@/api/wls-clients/broadcast-service/BroadcastMessage";
+import type { BroadcastMessageToRead } from "@/api/wls-clients/broadcast-service/BroadcastMessageToRead";
 
 import { ref } from "vue";
 import {

From c288128c66df0cb8a67fe13d3aa31efc60ac7b0a Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 12 Dec 2024 12:16:30 +0100
Subject: [PATCH 24/26] #564 :recycle: refactor wls exception

---
 .../src/api/fetch-utils.ts                    | 15 ++--------
 .../src/types/wls-types/WLSException.ts       | 28 +++++++++----------
 2 files changed, 16 insertions(+), 27 deletions(-)

diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 9bf883cae..41d9e1731 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -1,7 +1,6 @@
-import type WLSException from "@/types/wls-types/WLSException";
-
 import { ApiError } from "@/api/ApiError";
 import { STATUS_INDICATORS } from "@/constants";
+import WLSException from "@/types/wls-types/WLSException";
 
 /**
  * Returns a default GET-Config for fetch
@@ -137,7 +136,7 @@ export function wlsCatchHandler(response: Response): PromiseLike<never> {
   }
   if (response.status === 400) {
     return response.json().then((content) => {
-      if (isWLSException(content)) {
+      if (WLSException.isWLSException(content)) {
         return Promise.reject(new ApiError({ message: content.message }));
       } else {
         return Promise.reject(new ApiError({ message: "Error: Bad Request" }));
@@ -173,13 +172,3 @@ function getXSRFToken(): string {
   );
   return (help ? help.pop() : "") as string;
 }
-
-function isWLSException(obj: any): obj is WLSException {
-  return (
-    obj &&
-    typeof obj.category === "string" &&
-    typeof obj.code === "string" &&
-    typeof obj.message === "string" &&
-    typeof obj.service === "string"
-  );
-}
diff --git a/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts b/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
index db9f372ab..c2a21d9d7 100644
--- a/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
+++ b/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
@@ -1,18 +1,18 @@
 export default class WLSException {
-  category: string;
-  code: string;
-  message: string;
-  service: string;
-
   constructor(
-    category: string,
-    code: string,
-    message: string,
-    service: string
-  ) {
-    this.category = category;
-    this.code = code;
-    this.message = message;
-    this.service = service;
+    public readonly category: string,
+    public readonly code: string,
+    public readonly message: string,
+    public readonly service: string
+  ) {}
+
+  static isWLSException(obj: any): obj is WLSException {
+    return (
+      obj &&
+      typeof obj.category === "string" &&
+      typeof obj.code === "string" &&
+      typeof obj.message === "string" &&
+      typeof obj.service === "string"
+    );
   }
 }

From 5f368b41c02db539341dec60fce24cbc5cd69c0b Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Thu, 12 Dec 2024 16:14:04 +0100
Subject: [PATCH 25/26] #564 :art:

---
 .../src/views/ExampleBackendCommunicationView.vue               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
index f7663b0fb..cf2e3a34c 100644
--- a/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
+++ b/wls-gui-wahllokalsystem/src/views/ExampleBackendCommunicationView.vue
@@ -8,9 +8,9 @@
         <h4>Get or Post a Broadcast message:</h4>
         <br />
         <v-text-field
+          v-model="messageInput"
           class="ml-auto mr-auto"
           width="350"
-          v-model="messageInput"
           clearable
           label="ID"
         ></v-text-field>

From f1e3b78c9fe89fa3a270921e5cc9f2d02ae1495a Mon Sep 17 00:00:00 2001
From: "viviane.johns" <viviane.johns@muenchen.de>
Date: Mon, 16 Dec 2024 08:16:51 +0100
Subject: [PATCH 26/26] #564 :truck: move wls exception type to api folder

---
 .../src/{types/wls-types => api}/WLSException.ts                | 0
 wls-gui-wahllokalsystem/src/api/fetch-utils.ts                  | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename wls-gui-wahllokalsystem/src/{types/wls-types => api}/WLSException.ts (100%)

diff --git a/wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts b/wls-gui-wahllokalsystem/src/api/WLSException.ts
similarity index 100%
rename from wls-gui-wahllokalsystem/src/types/wls-types/WLSException.ts
rename to wls-gui-wahllokalsystem/src/api/WLSException.ts
diff --git a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
index 41d9e1731..ee2de90b0 100644
--- a/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
+++ b/wls-gui-wahllokalsystem/src/api/fetch-utils.ts
@@ -1,6 +1,6 @@
 import { ApiError } from "@/api/ApiError";
+import WLSException from "@/api/WLSException";
 import { STATUS_INDICATORS } from "@/constants";
-import WLSException from "@/types/wls-types/WLSException";
 
 /**
  * Returns a default GET-Config for fetch