From 9d2f7d57deeee8726bd87a74b752959ceb1ff868 Mon Sep 17 00:00:00 2001
From: Jan Cortiel <jan.cortiel@redlink.at>
Date: Wed, 11 Dec 2024 10:11:41 +0100
Subject: [PATCH 1/3] Update error handling and simplify toast integration
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Added `scrollToFirstError` utility to focus on the first error and improved error handling in `RelativeScheduler`. Replaced manual toast injection with PrimeVue’s `useToast` for clarity and removed obsolete code. Upgraded to Vue 3.5.13 to ensure compatibility.
---
 package-lock.json                           | 227 ++++++--------------
 package.json                                |   4 +-
 src/App.vue                                 |   5 +-
 src/components/dialog/StudyDialog.vue       |  13 +-
 src/components/forms/ErrorLabel.vue         |   2 +-
 src/components/shared/RelativeScheduler.vue |   3 +
 src/composable/toastService.ts              |  18 +-
 src/utils/componentUtils.ts                 |  12 ++
 8 files changed, 108 insertions(+), 176 deletions(-)
 create mode 100644 src/utils/componentUtils.ts

diff --git a/package-lock.json b/package-lock.json
index 2eafb11..7ae11f2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20,7 +20,7 @@
         "primevue": "3.46.0",
         "quill": "^2.0.3",
         "starwars-names": "1.6.0",
-        "vue": "3.4.31",
+        "vue": "3.5.13",
         "vue-cal": "^4.10.0",
         "vue-i18n": "10.0.5",
         "vue-router": "4.4.0"
@@ -29,7 +29,7 @@
         "@babel/core": "7.24.8",
         "@headlessui/vue": "1.7.22",
         "@heroicons/vue": "2.1.5",
-        "@intlify/unplugin-vue-i18n": "^6.0.0",
+        "@intlify/unplugin-vue-i18n": "^6.0.1",
         "@openapitools/openapi-generator-cli": "2.13.9",
         "@tailwindcss/aspect-ratio": "0.4.2",
         "@tailwindcss/forms": "0.5.7",
@@ -3316,7 +3316,6 @@
       "version": "3.5.13",
       "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.13.tgz",
       "integrity": "sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/parser": "^7.25.3",
@@ -3330,7 +3329,6 @@
       "version": "3.5.13",
       "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.13.tgz",
       "integrity": "sha512-ZOJ46sMOKUjO3e94wPdCzQ6P1Lx/vhp2RSvfaab88Ajexs0AHeV0uasYhi99WPaogmBlRHNRuly8xV75cNTMDA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@vue/compiler-core": "3.5.13",
@@ -3338,90 +3336,60 @@
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.31.tgz",
-      "integrity": "sha512-einJxqEw8IIJxzmnxmJBuK2usI+lJonl53foq+9etB2HAzlPjAS/wa7r0uUpXw5ByX3/0uswVSrjNb17vJm1kQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@babel/parser": "^7.24.7",
-        "@vue/compiler-core": "3.4.31",
-        "@vue/compiler-dom": "3.4.31",
-        "@vue/compiler-ssr": "3.4.31",
-        "@vue/shared": "3.4.31",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.10",
-        "postcss": "^8.4.38",
-        "source-map-js": "^1.2.0"
-      }
-    },
-    "node_modules/@vue/compiler-sfc/node_modules/@vue/compiler-core": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.31.tgz",
-      "integrity": "sha512-skOiodXWTV3DxfDhB4rOf3OGalpITLlgCeOwb+Y9GJpfQ8ErigdBUHomBzvG78JoVE8MJoQsb+qhZiHfKeNeEg==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.13.tgz",
+      "integrity": "sha512-6VdaljMpD82w6c2749Zhf5T9u5uLBWKnVue6XWxprDobftnletJ8+oel7sexFfM3qIxNmVE7LSFGTpv6obNyaQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.24.7",
-        "@vue/shared": "3.4.31",
-        "entities": "^4.5.0",
+        "@babel/parser": "^7.25.3",
+        "@vue/compiler-core": "3.5.13",
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/compiler-ssr": "3.5.13",
+        "@vue/shared": "3.5.13",
         "estree-walker": "^2.0.2",
+        "magic-string": "^0.30.11",
+        "postcss": "^8.4.48",
         "source-map-js": "^1.2.0"
       }
     },
-    "node_modules/@vue/compiler-sfc/node_modules/@vue/compiler-dom": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.31.tgz",
-      "integrity": "sha512-wK424WMXsG1IGMyDGyLqB+TbmEBFM78hIsOJ9QwUVLGrcSk0ak6zYty7Pj8ftm7nEtdU/DGQxAXp0/lM/2cEpQ==",
+    "node_modules/@vue/compiler-sfc/node_modules/postcss": {
+      "version": "8.4.49",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz",
+      "integrity": "sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-core": "3.4.31",
-        "@vue/shared": "3.4.31"
+        "nanoid": "^3.3.7",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
       }
     },
-    "node_modules/@vue/compiler-sfc/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.31.tgz",
-      "integrity": "sha512-RtefmITAje3fJ8FSg1gwgDhdKhZVntIVbwupdyZDSifZTRMiWxWehAOTCc8/KZDnBOcYQ4/9VWxsTbd3wT0hAA==",
-      "license": "MIT",
-      "dependencies": {
-        "@vue/compiler-dom": "3.4.31",
-        "@vue/shared": "3.4.31"
-      }
-    },
-    "node_modules/@vue/compiler-ssr/node_modules/@vue/compiler-core": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.31.tgz",
-      "integrity": "sha512-skOiodXWTV3DxfDhB4rOf3OGalpITLlgCeOwb+Y9GJpfQ8ErigdBUHomBzvG78JoVE8MJoQsb+qhZiHfKeNeEg==",
-      "license": "MIT",
-      "dependencies": {
-        "@babel/parser": "^7.24.7",
-        "@vue/shared": "3.4.31",
-        "entities": "^4.5.0",
-        "estree-walker": "^2.0.2",
-        "source-map-js": "^1.2.0"
-      }
-    },
-    "node_modules/@vue/compiler-ssr/node_modules/@vue/compiler-dom": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.31.tgz",
-      "integrity": "sha512-wK424WMXsG1IGMyDGyLqB+TbmEBFM78hIsOJ9QwUVLGrcSk0ak6zYty7Pj8ftm7nEtdU/DGQxAXp0/lM/2cEpQ==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.13.tgz",
+      "integrity": "sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-core": "3.4.31",
-        "@vue/shared": "3.4.31"
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/shared": "3.5.13"
       }
     },
-    "node_modules/@vue/compiler-ssr/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/devtools-api": {
       "version": "6.6.4",
       "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.4.tgz",
@@ -3494,78 +3462,53 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.31.tgz",
-      "integrity": "sha512-VGkTani8SOoVkZNds1PfJ/T1SlAIOf8E58PGAhIOUDYPC4GAmFA2u/E14TDAFcf3vVDKunc4QqCe/SHr8xC65Q==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.13.tgz",
+      "integrity": "sha512-NaCwtw8o48B9I6L1zl2p41OHo/2Z4wqYGGIK1Khu5T7yxrn+ATOixn/Udn2m+6kZKB/J7cuT9DbWWhRxqixACg==",
       "license": "MIT",
       "dependencies": {
-        "@vue/shared": "3.4.31"
+        "@vue/shared": "3.5.13"
       }
     },
-    "node_modules/@vue/reactivity/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/runtime-core": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.31.tgz",
-      "integrity": "sha512-LDkztxeUPazxG/p8c5JDDKPfkCDBkkiNLVNf7XZIUnJ+66GVGkP+TIh34+8LtPisZ+HMWl2zqhIw0xN5MwU1cw==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.13.tgz",
+      "integrity": "sha512-Fj4YRQ3Az0WTZw1sFe+QDb0aXCerigEpw418pw1HBUKFtnQHWzwojaukAs2X/c9DQz4MQ4bsXTGlcpGxU/RCIw==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.4.31",
-        "@vue/shared": "3.4.31"
+        "@vue/reactivity": "3.5.13",
+        "@vue/shared": "3.5.13"
       }
     },
-    "node_modules/@vue/runtime-core/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.31.tgz",
-      "integrity": "sha512-2Auws3mB7+lHhTFCg8E9ZWopA6Q6L455EcU7bzcQ4x6Dn4cCPuqj6S2oBZgN2a8vJRS/LSYYxwFFq2Hlx3Fsaw==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.13.tgz",
+      "integrity": "sha512-dLaj94s93NYLqjLiyFzVs9X6dWhTdAlEAciC3Moq7gzAc13VJUdCnjjRurNM6uTLFATRHexHCTu/Xp3eW6yoog==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.4.31",
-        "@vue/runtime-core": "3.4.31",
-        "@vue/shared": "3.4.31",
+        "@vue/reactivity": "3.5.13",
+        "@vue/runtime-core": "3.5.13",
+        "@vue/shared": "3.5.13",
         "csstype": "^3.1.3"
       }
     },
-    "node_modules/@vue/runtime-dom/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/server-renderer": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.31.tgz",
-      "integrity": "sha512-D5BLbdvrlR9PE3by9GaUp1gQXlCNadIZytMIb8H2h3FMWJd4oUfkUTEH2wAr3qxoRz25uxbTcbqd3WKlm9EHQA==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.13.tgz",
+      "integrity": "sha512-wAi4IRJV/2SAW3htkTlB+dHeRmpTiVIK1OGLWV1yeStVSebSQQOwGwIq0D3ZIoBj2C2qpgz5+vX9iEBkTdk5YA==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-ssr": "3.4.31",
-        "@vue/shared": "3.4.31"
+        "@vue/compiler-ssr": "3.5.13",
+        "@vue/shared": "3.5.13"
       },
       "peerDependencies": {
-        "vue": "3.4.31"
+        "vue": "3.5.13"
       }
     },
-    "node_modules/@vue/server-renderer/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/@vue/shared": {
       "version": "3.5.13",
       "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.13.tgz",
       "integrity": "sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@vue/test-utils": {
@@ -9870,6 +9813,7 @@
       "version": "8.4.39",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz",
       "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -12704,16 +12648,16 @@
       "license": "MIT"
     },
     "node_modules/vue": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.31.tgz",
-      "integrity": "sha512-njqRrOy7W3YLAlVqSKpBebtZpDVg21FPoaq1I7f/+qqBThK9ChAIjkRWgeP6Eat+8C+iia4P3OYqpATP21BCoQ==",
+      "version": "3.5.13",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.13.tgz",
+      "integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.31",
-        "@vue/compiler-sfc": "3.4.31",
-        "@vue/runtime-dom": "3.4.31",
-        "@vue/server-renderer": "3.4.31",
-        "@vue/shared": "3.4.31"
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/compiler-sfc": "3.5.13",
+        "@vue/runtime-dom": "3.5.13",
+        "@vue/server-renderer": "3.5.13",
+        "@vue/shared": "3.5.13"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -12881,35 +12825,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/vue/node_modules/@vue/compiler-core": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.31.tgz",
-      "integrity": "sha512-skOiodXWTV3DxfDhB4rOf3OGalpITLlgCeOwb+Y9GJpfQ8ErigdBUHomBzvG78JoVE8MJoQsb+qhZiHfKeNeEg==",
-      "license": "MIT",
-      "dependencies": {
-        "@babel/parser": "^7.24.7",
-        "@vue/shared": "3.4.31",
-        "entities": "^4.5.0",
-        "estree-walker": "^2.0.2",
-        "source-map-js": "^1.2.0"
-      }
-    },
-    "node_modules/vue/node_modules/@vue/compiler-dom": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.31.tgz",
-      "integrity": "sha512-wK424WMXsG1IGMyDGyLqB+TbmEBFM78hIsOJ9QwUVLGrcSk0ak6zYty7Pj8ftm7nEtdU/DGQxAXp0/lM/2cEpQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@vue/compiler-core": "3.4.31",
-        "@vue/shared": "3.4.31"
-      }
-    },
-    "node_modules/vue/node_modules/@vue/shared": {
-      "version": "3.4.31",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.31.tgz",
-      "integrity": "sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==",
-      "license": "MIT"
-    },
     "node_modules/w3c-xmlserializer": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
diff --git a/package.json b/package.json
index d6ba121..0d6071b 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,7 @@
     "primevue": "3.46.0",
     "quill": "^2.0.3",
     "starwars-names": "1.6.0",
-    "vue": "3.4.31",
+    "vue": "3.5.13",
     "vue-cal": "^4.10.0",
     "vue-i18n": "10.0.5",
     "vue-router": "4.4.0"
@@ -44,7 +44,7 @@
     "@babel/core": "7.24.8",
     "@headlessui/vue": "1.7.22",
     "@heroicons/vue": "2.1.5",
-    "@intlify/unplugin-vue-i18n": "^6.0.0",
+    "@intlify/unplugin-vue-i18n": "^6.0.1",
     "@openapitools/openapi-generator-cli": "2.13.9",
     "@tailwindcss/aspect-ratio": "0.4.2",
     "@tailwindcss/forms": "0.5.7",
diff --git a/src/App.vue b/src/App.vue
index 67deaa3..b0fc072 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,15 +4,12 @@ Prevention -- A research institute of the Ludwig Boltzmann Gesellschaft,
 Oesterreichische Vereinigung zur Foerderung der wissenschaftlichen Forschung).
 Licensed under the Elastic License 2.0. */
 <script setup lang="ts">
-  import { ref, provide } from 'vue';
   import Toast from 'primevue/toast';
   import Footer from './components/shared/Footer.vue';
   import Header from './components/shared/Header.vue';
   import { useRouter } from 'vue-router';
 
   const router = useRouter();
-  const toast = ref<Toast | null>(null);
-  provide('toast', toast);
 
   router.beforeEach((to) => {
     document.title = to.meta?.title ? to.meta.title + ' (More)' : 'More';
@@ -23,7 +20,7 @@ Licensed under the Elastic License 2.0. */
   <Header />
   <main class="mb-20 pt-14">
     <router-view />
-    <Toast ref="toast" />
+    <Toast />
   </main>
   <Footer />
 </template>
diff --git a/src/components/dialog/StudyDialog.vue b/src/components/dialog/StudyDialog.vue
index cd74040..864bba5 100644
--- a/src/components/dialog/StudyDialog.vue
+++ b/src/components/dialog/StudyDialog.vue
@@ -21,6 +21,7 @@ Licensed under the Elastic License 2.0. */
   import ErrorLabel from '../forms/ErrorLabel.vue';
   import { useErrorQueue } from '../../composable/useErrorHandling';
   import { calcStudyDuration } from '../../utils/studyUtils';
+  import { scrollToFirstError } from '../../utils/componentUtils';
 
   const dateFormat = useGlobalStore().getDateFormat;
 
@@ -121,6 +122,7 @@ Licensed under the Elastic License 2.0. */
         value: t('study.error.addContactEmail'),
       });
     }
+    scrollToFirstError();
   }
 
   watch(
@@ -132,7 +134,6 @@ Licensed under the Elastic License 2.0. */
       const maxDuration = calcStudyDuration(
         createLuxonDateTime(newStart),
         createLuxonDateTime(newEnd),
-        newDuration,
       );
       if (!maxDuration?.value) {
         return;
@@ -140,7 +141,7 @@ Licensed under the Elastic License 2.0. */
         maxStudyDuration.value = maxDuration.value;
       }
 
-      if (studyDuration.value && studyDuration.value > maxStudyDuration.value) {
+      if (newDuration.value && newDuration.value > maxStudyDuration.value) {
         clearError('duration');
         addError({
           label: 'duration',
@@ -149,6 +150,7 @@ Licensed under the Elastic License 2.0. */
           }),
         });
       }
+      scrollToFirstError();
     },
     { deep: true },
   );
@@ -243,7 +245,12 @@ Licensed under the Elastic License 2.0. */
             :placeholder="$t('study.placeholder.durationInput')"
             :auto-resize="true"
             :min="0"
-            @input="clearError('duration')"
+            @input="
+              (event) => {
+                console.log(event);
+                clearError('duration');
+              }
+            "
           />
           <span class="w-fit">
             {{ $t('scheduler.frequency.days') }}
diff --git a/src/components/forms/ErrorLabel.vue b/src/components/forms/ErrorLabel.vue
index 2a620fc..6794935 100644
--- a/src/components/forms/ErrorLabel.vue
+++ b/src/components/forms/ErrorLabel.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="error" class="error mt-2">
+  <div v-if="error" class="error-label error mt-2">
     {{ Array.isArray(error) ? error.find((e) => !!e) : error }}
   </div>
 </template>
diff --git a/src/components/shared/RelativeScheduler.vue b/src/components/shared/RelativeScheduler.vue
index 0f9a2c8..1cae249 100644
--- a/src/components/shared/RelativeScheduler.vue
+++ b/src/components/shared/RelativeScheduler.vue
@@ -24,6 +24,7 @@
   import ErrorLabel from '../forms/ErrorLabel.vue';
   import { useErrorQueue } from '../../composable/useErrorHandling';
   import { valueToMinutes } from '../../utils/durationUtils';
+  import { scrollToFirstError } from '../../utils/componentUtils';
 
   const { t } = useI18n();
   const dialogRef: any = inject('dialogRef');
@@ -208,6 +209,7 @@
         });
       }
     }
+    scrollToFirstError();
   }
 
   function calcRepetition(): void {
@@ -327,6 +329,7 @@
             addError(correctedRepetition.frequencyEndError);
           }
         }
+        scrollToFirstError();
       }
     },
     { deep: true, immediate: true },
diff --git a/src/composable/toastService.ts b/src/composable/toastService.ts
index 193d444..8dc916d 100644
--- a/src/composable/toastService.ts
+++ b/src/composable/toastService.ts
@@ -6,21 +6,19 @@
  Foerderung der wissenschaftlichen Forschung).
  Licensed under the Elastic License 2.0.
  */
-import { inject, Ref } from 'vue';
-import { ToastServiceMethods } from 'primevue/toastservice';
 import { ToastMessageOptions } from 'primevue/toast';
 import { useI18n } from 'vue-i18n';
 import {
   ValidationReport,
   ValidationReportItem,
 } from '../generated-sources/openapi';
+import { useToast } from 'primevue/usetoast';
 
 /**
  * This composable is responsible for showing errors from Backend to the Client with a Toast popup.
  */
 export function useToastService(): any {
-  const toast: Ref<ToastServiceMethods> | undefined =
-    inject<Ref<ToastServiceMethods>>('toast');
+  const toast = useToast();
   const { t } = useI18n();
 
   if (!toast) {
@@ -84,32 +82,32 @@ export function useToastService(): any {
     summary: string,
     detail: string,
   ): void => {
-    if (toast.value) {
-      toast.value.add({ severity, summary, detail });
+    if (toast) {
+      toast.add({ severity, summary, detail });
     } else {
       console.error('Toast reference is not set');
     }
   };
 
   const showErrorToast = (detail: string): void => {
-    if (toast.value) {
+    if (toast) {
       const severity: ToastMessageOptions['severity'] = 'error';
       const summary = t('global.error.type.error');
       const life: ToastMessageOptions['life'] = 5000;
 
-      toast.value.add({ severity, summary, detail, life });
+      toast.add({ severity, summary, detail, life });
     } else {
       console.error('Toast reference is not set');
     }
   };
 
   const showWarningToast = (detail: string): void => {
-    if (toast.value) {
+    if (toast) {
       const severity: ToastMessageOptions['severity'] = 'warn';
       const summary = t('global.error.type.warning');
       const life: ToastMessageOptions['life'] = 5000;
 
-      toast.value.add({ severity, summary, detail, life });
+      toast.add({ severity, summary, detail, life });
     } else {
       console.error('Toast reference is not set');
     }
diff --git a/src/utils/componentUtils.ts b/src/utils/componentUtils.ts
new file mode 100644
index 0000000..e63cb70
--- /dev/null
+++ b/src/utils/componentUtils.ts
@@ -0,0 +1,12 @@
+import { nextTick } from 'vue';
+
+export const scrollToFirstError = async (): Promise<void> => {
+  await nextTick(() => {
+    const firstErrorElement = document
+      .getElementsByClassName('error-label')
+      .item(0);
+    if (firstErrorElement) {
+      firstErrorElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    }
+  });
+};

From faa58c7c41afdfdfe701c9989a386df65f751cf4 Mon Sep 17 00:00:00 2001
From: Jan Cortiel <jan.cortiel@redlink.at>
Date: Wed, 11 Dec 2024 10:15:34 +0100
Subject: [PATCH 2/3] Remove package-lock.json file

The package-lock.json file was deleted from the repository. This could imply a transition to managing dependencies without a lockfile, possibly to allow flexibility across environments or workflows.
---
 package-lock.json | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 7ae11f2..ba49e68 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7438,9 +7438,9 @@
       }
     },
     "node_modules/jsesc": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.0.2.tgz",
-      "integrity": "sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
+      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11595,9 +11595,9 @@
       }
     },
     "node_modules/svelte": {
-      "version": "5.10.0",
-      "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.10.0.tgz",
-      "integrity": "sha512-jGJFpB9amHLLQZBbAuQ6csH7WlTvGx4cO4wSSNcgGcx9vDGMTCZzTREf6/wKhVUQDoK+GapgvLQPZHa3e9MOAA==",
+      "version": "5.10.1",
+      "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.10.1.tgz",
+      "integrity": "sha512-JOBw4VStdoP/Iw93vrzGAOUWdV4Gk8hCuprvTwjbdMZG3GyYxbLogR56XqrO2M7E6PifoPkwDphXu0s49R2wvw==",
       "dev": true,
       "license": "MIT",
       "peer": true,

From 1a7bdab41f6562ab5fc36f687db8433ad554110e Mon Sep 17 00:00:00 2001
From: Jan Cortiel <jan.cortiel@redlink.at>
Date: Wed, 11 Dec 2024 10:18:18 +0100
Subject: [PATCH 3/3] Fix optional chaining for frontRowActions in MoreTable

Updated the conditional check for `frontRowActions` to use optional chaining, preventing potential runtime errors when the property is undefined or null. This ensures more robust and error-proof behavior for row action rendering.
---
 src/components/shared/MoreTable.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/shared/MoreTable.vue b/src/components/shared/MoreTable.vue
index 01e631d..5aa6778 100644
--- a/src/components/shared/MoreTable.vue
+++ b/src/components/shared/MoreTable.vue
@@ -305,7 +305,7 @@ Licensed under the Elastic License 2.0. */
       @row-click="onRowClick($event)"
     >
       <Column
-        v-if="frontRowActions.length"
+        v-if="frontRowActions?.length"
         key="actions"
         class="row-actions"
         :frozen="true"