From 5237c9cab50425d524c99fd385f7e5db55dc8828 Mon Sep 17 00:00:00 2001
From: MateuszMichalowski
 <79852198+MateuszMichalowski@users.noreply.github.com>
Date: Fri, 6 Dec 2024 20:58:36 +0100
Subject: [PATCH] feat(frontend): add feedback fixes + map feature fixes
 (#3400)

---
 admin/package.json                            |   4 +-
 .../ContributionLink/ContributionLinkForm.vue |   8 +-
 .../ContributionMessagesFormular.vue          |  36 +-
 admin/src/components/input/TimePicker.vue     |  19 +-
 admin/src/composables/useDateFormatter.js     |  10 +
 admin/src/composables/useToast.js             |   4 +-
 admin/yarn.lock                               | 312 ++++++-----
 frontend/package.json                         |   6 +-
 .../scss/custom/gradido-custom/_fonts.scss    |   2 +-
 .../DecayInformations/CollapseLinksList.vue   |   6 +-
 .../src/components/Inputs/InputUsername.vue   |  19 +-
 .../Transactions/GddTransaction.vue           |  10 +-
 .../UserSettings/UserGMSLocationFormat.vue    |   3 +-
 .../UserSettings/UserGmsLocationCapturing.vue |  10 +-
 .../UserSettings/UserLocationMap.vue          |  27 +-
 .../src/components/UserSettings/UserName.vue  |  17 +-
 .../UserSettings/UserNamingFormat.vue         |   3 +-
 frontend/src/composables/useToast.js          |   4 +-
 frontend/src/pages/Settings.vue               |   8 +-
 frontend/yarn.lock                            | 483 +++++-------------
 20 files changed, 380 insertions(+), 611 deletions(-)
 create mode 100644 admin/src/composables/useDateFormatter.js

diff --git a/admin/package.json b/admin/package.json
index 0899fe83c..b395ce5f6 100644
--- a/admin/package.json
+++ b/admin/package.json
@@ -36,7 +36,7 @@
     "babel-preset-env": "^1.7.0",
     "babel-preset-vue": "^2.0.2",
     "bootstrap": "^5.3.3",
-    "bootstrap-vue-next": "^0.23.2",
+    "bootstrap-vue-next": "0.26.8",
     "date-fns": "^2.29.3",
     "dotenv-webpack": "^7.0.3",
     "express": "^4.17.1",
@@ -49,7 +49,7 @@
     "sass": "^1.77.8",
     "vite": "3.2.10",
     "vite-plugin-commonjs": "^0.10.1",
-    "vue": "3.4.31",
+    "vue": "3.5.13",
     "vue-apollo": "3.1.2",
     "vue-i18n": "9.13.1",
     "vue-router": "4.4.0",
diff --git a/admin/src/components/ContributionLink/ContributionLinkForm.vue b/admin/src/components/ContributionLink/ContributionLinkForm.vue
index 20d78dc99..f67383aa4 100644
--- a/admin/src/components/ContributionLink/ContributionLinkForm.vue
+++ b/admin/src/components/ContributionLink/ContributionLinkForm.vue
@@ -125,6 +125,7 @@ import { createContributionLink } from '@/graphql/createContributionLink.js'
 import { updateContributionLink } from '@/graphql/updateContributionLink.js'
 import { useAppToast } from '@/composables/useToast'
 import { useI18n } from 'vue-i18n'
+import { useDateFormatter } from '@/composables/useDateFormatter'
 
 const props = defineProps({
   contributionLinkData: {
@@ -138,6 +139,8 @@ const emit = defineEmits(['get-contribution-links', 'close-contribution-form'])
 
 const { t } = useI18n()
 
+const { formatDateFromDateTime } = useDateFormatter()
+
 const contributionLinkForm = ref(null)
 
 const form = ref({
@@ -201,11 +204,6 @@ const onSubmit = async () => {
   }
 }
 
-const formatDateFromDateTime = (datetimeString) => {
-  if (!datetimeString || !datetimeString?.includes('T')) return datetimeString
-  return datetimeString.split('T')[0]
-}
-
 const onReset = () => {
   form.value = { validFrom: null, validTo: null }
 }
diff --git a/admin/src/components/ContributionMessages/ContributionMessagesFormular.vue b/admin/src/components/ContributionMessages/ContributionMessagesFormular.vue
index af946fd56..34faf3f85 100644
--- a/admin/src/components/ContributionMessages/ContributionMessagesFormular.vue
+++ b/admin/src/components/ContributionMessages/ContributionMessagesFormular.vue
@@ -8,8 +8,10 @@
           </BFormCheckbox>
         </BFormGroup>
         <BFormGroup v-if="showResubmissionDate">
-          <BFormInput v-model="resubmissionDate" type="date" :min="now"></BFormInput>
-          <time-picker v-model="resubmissionTime"></time-picker>
+          <div class="d-flex my-2">
+            <BFormInput v-model="resubmissionDate" type="date" :min="now" class="w-25 me-2" />
+            <time-picker v-model="resubmissionTime" />
+          </div>
         </BFormGroup>
         <BTabs v-model="tabindex" content-class="mt-3" data-test="message-type-tabs">
           <BTab active>
@@ -24,7 +26,7 @@
               v-model="form.text"
               :placeholder="$t('contributionLink.memo')"
               rows="3"
-            ></BFormTextarea>
+            />
           </BTab>
           <BTab>
             <template #title>
@@ -38,7 +40,7 @@
               v-model="form.text"
               :placeholder="$t('moderator.notice')"
               rows="3"
-            ></BFormTextarea>
+            />
           </BTab>
           <BTab>
             <template #title>
@@ -52,7 +54,7 @@
               v-model="form.memo"
               :placeholder="$t('contributionLink.memo')"
               rows="3"
-            ></BFormTextarea>
+            />
           </BTab>
         </BTabs>
         <BRow class="mt-4 mb-6">
@@ -85,6 +87,7 @@ import TimePicker from '@/components/input/TimePicker'
 import { adminCreateContributionMessage } from '@/graphql/adminCreateContributionMessage'
 import { adminUpdateContribution } from '@/graphql/adminUpdateContribution'
 import { useAppToast } from '@/composables/useToast'
+import { useDateFormatter } from '@/composables/useDateFormatter'
 
 const props = defineProps({
   contributionId: {
@@ -115,6 +118,7 @@ const emit = defineEmits([
 
 const { t } = useI18n()
 const { toastError, toastSuccess } = useAppToast()
+const { formatDateFromDateTime } = useDateFormatter()
 
 const form = ref({
   text: '',
@@ -125,7 +129,7 @@ const loading = ref(false)
 const localInputResubmissionDate = props.inputResubmissionDate
   ? new Date(props.inputResubmissionDate)
   : null
-const resubmissionDate = ref(localInputResubmissionDate)
+const resubmissionDate = ref(formatDateFromDateTime(props.inputResubmissionDate))
 const resubmissionTime = ref(
   localInputResubmissionDate
     ? localInputResubmissionDate.toLocaleTimeString('de-DE', {
@@ -141,14 +145,20 @@ const messageType = {
   MODERATOR: 'MODERATOR',
 }
 
-const disabled = computed(() => {
-  return (
-    (tabindex.value === 0 && form.value.text === '') ||
+const isTextTabValid = computed(() => form.value.text !== '')
+
+const isMemoTabValid = computed(() => form.value.memo.length >= 5)
+
+const disabled = computed(
+  () =>
     loading.value ||
-    (tabindex.value === 1 && form.value.memo.length < 5) ||
-    (showResubmissionDate.value && !resubmissionDate.value)
-  )
-})
+    (!(showResubmissionDate.value && resubmissionDate.value) &&
+      ([0, 1].includes(tabindex.value)
+        ? !isTextTabValid.value
+        : tabindex.value === 2
+          ? !isMemoTabValid.value
+          : false)),
+)
 
 const now = computed(() => new Date())
 
diff --git a/admin/src/components/input/TimePicker.vue b/admin/src/components/input/TimePicker.vue
index 1e18502f9..cf52f34bb 100644
--- a/admin/src/components/input/TimePicker.vue
+++ b/admin/src/components/input/TimePicker.vue
@@ -2,6 +2,7 @@
   <div>
     <input
       v-model="timeValue"
+      class="timer-input"
       type="text"
       placeholder="hh:mm"
       @input="updateValues"
@@ -15,15 +16,15 @@ export default {
   // Code written from chatGPT 3.5
   name: 'TimePicker',
   props: {
-    value: {
+    modelValue: {
       type: String,
       default: '00:00',
     },
   },
-  emits: ['input'],
+  emits: ['update:modelValue'],
   data() {
     return {
-      timeValue: this.value,
+      timeValue: this.modelValue,
     }
   },
   methods: {
@@ -31,7 +32,7 @@ export default {
       // Allow only numbers and ":"
       const inputValue = event.target.value.replace(/[^0-9:]/g, '')
       this.timeValue = inputValue
-      this.$emit('input', inputValue)
+      this.$emit('update:modelValue', inputValue)
     },
     validateAndCorrect() {
       let [hours, minutes] = this.timeValue.split(':')
@@ -42,8 +43,16 @@ export default {
 
       // Update the value with correct format
       this.timeValue = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`
-      this.$emit('input', this.timeValue)
+      this.$emit('update:modelValue', this.timeValue)
     },
   },
 }
 </script>
+
+<style scoped>
+.timer-input {
+  border: 1px solid rgb(222, 226, 230);
+  border-radius: 6px;
+  padding: 6px 12px;
+}
+</style>
diff --git a/admin/src/composables/useDateFormatter.js b/admin/src/composables/useDateFormatter.js
new file mode 100644
index 000000000..8f3c85bfe
--- /dev/null
+++ b/admin/src/composables/useDateFormatter.js
@@ -0,0 +1,10 @@
+export const useDateFormatter = () => {
+  const formatDateFromDateTime = (datetimeString) => {
+    if (!datetimeString || !datetimeString?.includes('T')) return datetimeString
+    return datetimeString.split('T')[0]
+  }
+
+  return {
+    formatDateFromDateTime,
+  }
+}
diff --git a/admin/src/composables/useToast.js b/admin/src/composables/useToast.js
index 6bc4fb574..f9000210f 100644
--- a/admin/src/composables/useToast.js
+++ b/admin/src/composables/useToast.js
@@ -1,9 +1,9 @@
 import { useI18n } from 'vue-i18n'
-import { useToast } from 'bootstrap-vue-next'
+import { useToastController } from 'bootstrap-vue-next'
 
 export function useAppToast() {
   const { t } = useI18n()
-  const { show } = useToast()
+  const { show } = useToastController()
   const toastSuccess = (message) => {
     toast(message, {
       title: t('success'),
diff --git a/admin/yarn.lock b/admin/yarn.lock
index 6b0cb400b..f3abfbe86 100644
--- a/admin/yarn.lock
+++ b/admin/yarn.lock
@@ -463,6 +463,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/parser@npm:^7.25.3":
+  version: 7.26.3
+  resolution: "@babel/parser@npm:7.26.3"
+  dependencies:
+    "@babel/types": "npm:^7.26.3"
+  bin:
+    parser: ./bin/babel-parser.js
+  checksum: 10c0/48f736374e61cfd10ddbf7b80678514ae1f16d0e88bc793d2b505d73d9b987ea786fc8c2f7ee8f8b8c467df062030eb07fd0eb2168f0f541ca1f542775852cad
+  languageName: node
+  linkType: hard
+
 "@babel/parser@npm:^7.25.4":
   version: 7.25.6
   resolution: "@babel/parser@npm:7.25.6"
@@ -1506,6 +1517,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/types@npm:^7.26.3":
+  version: 7.26.3
+  resolution: "@babel/types@npm:7.26.3"
+  dependencies:
+    "@babel/helper-string-parser": "npm:^7.25.9"
+    "@babel/helper-validator-identifier": "npm:^7.25.9"
+  checksum: 10c0/966c5242c5e55c8704bf7a7418e7be2703a0afa4d19a8480999d5a4ef13d095dd60686615fe5983cb7593b4b06ba3a7de8d6ca501c1d78bdd233a10d90be787b
+  languageName: node
+  linkType: hard
+
 "@babel/types@npm:^7.8.3":
   version: 7.26.0
   resolution: "@babel/types@npm:7.26.0"
@@ -1799,43 +1820,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@floating-ui/core@npm:^1.6.0":
-  version: 1.6.5
-  resolution: "@floating-ui/core@npm:1.6.5"
-  dependencies:
-    "@floating-ui/utils": "npm:^0.2.5"
-  checksum: 10c0/41651f6ebed3123809a3992966d9d6b740048fe255e4754df61043ce28b40ba7202cf7ac163873b7f4c5f9969930e9d7cd3691e178739304eed1adc42bb6c628
-  languageName: node
-  linkType: hard
-
-"@floating-ui/dom@npm:^1.0.0":
-  version: 1.6.8
-  resolution: "@floating-ui/dom@npm:1.6.8"
-  dependencies:
-    "@floating-ui/core": "npm:^1.6.0"
-    "@floating-ui/utils": "npm:^0.2.5"
-  checksum: 10c0/d52e257bbf1f04da7882d847dfe128783966a19e6d6a9e6d09d57d32bdc7255efce7ae15c3be781e349ae3b18c4575e910afde3e73ae57c31763e8a799f19f45
-  languageName: node
-  linkType: hard
-
-"@floating-ui/utils@npm:^0.2.5":
-  version: 0.2.5
-  resolution: "@floating-ui/utils@npm:0.2.5"
-  checksum: 10c0/9e1c7330433c3a8f226c5a44ed1dcdda13b313c4126ce3281f970d1e471b1c9fd9e1559cc76a0592af25d55a3f81afe1a5778aa7b80e51c9fa01930cd1d5557e
-  languageName: node
-  linkType: hard
-
-"@floating-ui/vue@npm:^1.1.1":
-  version: 1.1.2
-  resolution: "@floating-ui/vue@npm:1.1.2"
-  dependencies:
-    "@floating-ui/dom": "npm:^1.0.0"
-    "@floating-ui/utils": "npm:^0.2.5"
-    vue-demi: "npm:>=0.13.0"
-  checksum: 10c0/f8ac2ae08b2e1253e7e89731e959a39bf589e6399a7e3d0ddc8813dfea97f2fa7604b2a990e5041fb6ed83e456f004b03a2c5e96f66348c39cc9b96e00a637b2
-  languageName: node
-  linkType: hard
-
 "@graphql-typed-document-node/core@npm:^3.1.1":
   version: 3.2.0
   resolution: "@graphql-typed-document-node/core@npm:3.2.0"
@@ -2000,7 +1984,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jridgewell/sourcemap-codec@npm:^1.4.10, @jridgewell/sourcemap-codec@npm:^1.4.14, @jridgewell/sourcemap-codec@npm:^1.4.15":
+"@jridgewell/sourcemap-codec@npm:^1.4.10, @jridgewell/sourcemap-codec@npm:^1.4.14, @jridgewell/sourcemap-codec@npm:^1.4.15, @jridgewell/sourcemap-codec@npm:^1.5.0":
   version: 1.5.0
   resolution: "@jridgewell/sourcemap-codec@npm:1.5.0"
   checksum: 10c0/2eb864f276eb1096c3c11da3e9bb518f6d9fc0023c78344cdc037abadc725172c70314bdb360f2d4b7bffec7f5d657ce006816bc5d4ecb35e61b66132db00c18
@@ -2266,13 +2250,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/web-bluetooth@npm:^0.0.20":
-  version: 0.0.20
-  resolution: "@types/web-bluetooth@npm:0.0.20"
-  checksum: 10c0/3a49bd9396506af8f1b047db087aeeea9fe4301b7fad4fe06ae0f6e00d331138caae878fd09e6410658b70b4aaf10e4b191c41c1a5ff72211fe58da290c7d003
-  languageName: node
-  linkType: hard
-
 "@types/zen-observable@npm:^0.8.0":
   version: 0.8.7
   resolution: "@types/zen-observable@npm:0.8.7"
@@ -2426,19 +2403,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-core@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-core@npm:3.4.31"
-  dependencies:
-    "@babel/parser": "npm:^7.24.7"
-    "@vue/shared": "npm:3.4.31"
-    entities: "npm:^4.5.0"
-    estree-walker: "npm:^2.0.2"
-    source-map-js: "npm:^1.2.0"
-  checksum: 10c0/17833fa55af0168da4ec79b1233aba2bf6df9a88cd95be513a122f3433901e70284ce467a504a36547debdf49f887cf807734360a7660fd8f7622bf15c74b01d
-  languageName: node
-  linkType: hard
-
 "@vue/compiler-core@npm:3.4.34":
   version: 3.4.34
   resolution: "@vue/compiler-core@npm:3.4.34"
@@ -2452,13 +2416,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-dom@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-dom@npm:3.4.31"
+"@vue/compiler-core@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-core@npm:3.5.13"
   dependencies:
-    "@vue/compiler-core": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/136b2208685d7d67e282a7da5f377f40878c467832789be21aadbe322832541aa20a4e2d0c5faa57b4f5608067eeb680d123fdb08c2ef9b28f0d6a94a3d79dbc
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/shared": "npm:3.5.13"
+    entities: "npm:^4.5.0"
+    estree-walker: "npm:^2.0.2"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/b89f3e3ca92c3177ae449ada1480df13d99b5b3b2cdcf3202fd37dc30f294a1db1f473209f8bae9233e2d338632219d39b2bfa6941d158cea55255e4b0b30f90
   languageName: node
   linkType: hard
 
@@ -2472,20 +2439,30 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-sfc@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-sfc@npm:3.4.31"
+"@vue/compiler-dom@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-dom@npm:3.5.13"
   dependencies:
-    "@babel/parser": "npm:^7.24.7"
-    "@vue/compiler-core": "npm:3.4.31"
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/compiler-ssr": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
+    "@vue/compiler-core": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/8f424a71883c9ef4abdd125d2be8d12dd8cf94ba56089245c88734b1f87c65e10597816070ba2ea0a297a2f66dc579f39275a9a53ef5664c143a12409612cd72
+  languageName: node
+  linkType: hard
+
+"@vue/compiler-sfc@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-sfc@npm:3.5.13"
+  dependencies:
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/compiler-core": "npm:3.5.13"
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/compiler-ssr": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
     estree-walker: "npm:^2.0.2"
-    magic-string: "npm:^0.30.10"
-    postcss: "npm:^8.4.38"
+    magic-string: "npm:^0.30.11"
+    postcss: "npm:^8.4.48"
     source-map-js: "npm:^1.2.0"
-  checksum: 10c0/b8983a52dd3d5d7f9640dbda5946f01fcb92213a6c3a9a76d1df8f67fd43c59402ab6ff4211a205bf91155c4cd2a45fb39c36a83199bc1256eaeb9f690895b73
+  checksum: 10c0/5fd57895ce2801e480c08f31f91f0d1746ed08a9c1973895fd7269615f5bcdf75497978fb358bda738938d9844dea2404064c53b2cdda991014225297acce19e
   languageName: node
   linkType: hard
 
@@ -2506,16 +2483,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-ssr@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-ssr@npm:3.4.31"
-  dependencies:
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/8083959c21b344f8ee5029c0ea91d50118a32b7c7c430971a721785b0349ce92d82d9cf17d7991a283f79b4ec1c68db4d1d182e035c17aa9116aa07ee115bac0
-  languageName: node
-  linkType: hard
-
 "@vue/compiler-ssr@npm:3.4.34":
   version: 3.4.34
   resolution: "@vue/compiler-ssr@npm:3.4.34"
@@ -2526,6 +2493,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-ssr@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-ssr@npm:3.5.13"
+  dependencies:
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/67621337b12fc414fcf9f16578961850724713a9fb64501136e432c2dfe95de99932c46fa24be9820f8bcdf8e7281f815f585b519a95ea979753bafd637dde1b
+  languageName: node
+  linkType: hard
+
 "@vue/devtools-api@npm:^6.0.0-beta.11, @vue/devtools-api@npm:^6.5.0, @vue/devtools-api@npm:^6.5.1":
   version: 6.6.3
   resolution: "@vue/devtools-api@npm:6.6.3"
@@ -2546,53 +2523,46 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/reactivity@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/reactivity@npm:3.4.31"
+"@vue/reactivity@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/reactivity@npm:3.5.13"
   dependencies:
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/974ce9c9f26367845d71ab37aa5644b06f5e8e938ebe343004a8cb700505350da70fd315f39aecc46ffa62c474e3fb947529bd3981b66efab8ab45c34189a334
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/4bf2754a4b8cc31afc8da5bdfd12bba6be67b2963a65f7c9e2b59810883c58128dfc58cce6d1e479c4f666190bc0794f17208d9efd3fc909a2e4843d2cc0e69e
   languageName: node
   linkType: hard
 
-"@vue/runtime-core@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/runtime-core@npm:3.4.31"
+"@vue/runtime-core@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/runtime-core@npm:3.5.13"
   dependencies:
-    "@vue/reactivity": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/446711364e34520d5f38133950ecb27ede0d235fabb74237b51dc6ef22cce1b5db94033acbf6fc485c2dd3034862492eb247d267487bd36c88cb4ad151ffaf3c
+    "@vue/reactivity": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/b6be854bf082a224222614a334fbeac0e7b6445f3cf4ea45cbd49ae4bb1551200c461c14c7a452d748f2459f7402ad4dee5522d51be5a28ea4ae1f699a7c016f
   languageName: node
   linkType: hard
 
-"@vue/runtime-dom@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/runtime-dom@npm:3.4.31"
+"@vue/runtime-dom@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/runtime-dom@npm:3.5.13"
   dependencies:
-    "@vue/reactivity": "npm:3.4.31"
-    "@vue/runtime-core": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
+    "@vue/reactivity": "npm:3.5.13"
+    "@vue/runtime-core": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
     csstype: "npm:^3.1.3"
-  checksum: 10c0/4c0b20f16ad3a676d1a61b07f24d1668166e5b0cc133344eafcecde308952d577005fc4a1fa77fd055dffce5dbacbd4577688f2dc151ac0f2f6e1d31529fdfc6
+  checksum: 10c0/8ee7f3980d19f77f8e7ae854e3ff1f7ee9a9b8b4e214c8d0492e1180ae818e33c04803b3d094503524d557431a30728b78cf15c3683d8abbbbd1b263a299d62a
   languageName: node
   linkType: hard
 
-"@vue/server-renderer@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/server-renderer@npm:3.4.31"
+"@vue/server-renderer@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/server-renderer@npm:3.5.13"
   dependencies:
-    "@vue/compiler-ssr": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
+    "@vue/compiler-ssr": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
   peerDependencies:
-    vue: 3.4.31
-  checksum: 10c0/1e01142c2f7b6ee9b1e94a25142452fc60ef7fbdd47b4c145db001fbfd20e5c9fab97a74d7c0978b4a0beacc043f330524623b22f1bd7faa353c41feb824c549
-  languageName: node
-  linkType: hard
-
-"@vue/shared@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/shared@npm:3.4.31"
-  checksum: 10c0/45643c0c7aa6b208891aac5798629ee5b982a5e52343c0a23ecc15b7aeb580b606ce78e70daee0fd691ccddb5f10196c4d56c7da4b8716157be1772a43f1c45e
+    vue: 3.5.13
+  checksum: 10c0/f500bdabc199abf41f1d84defd2a365a47afce1f2223a34c32fada84f6193b39ec2ce50636483409eec81b788b8ef0fa1ff59c63ca0c74764d738c24409eef8f
   languageName: node
   linkType: hard
 
@@ -2603,6 +2573,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/shared@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/shared@npm:3.5.13"
+  checksum: 10c0/2c940ef907116f1c2583ca1d7733984e5705983ab07054c4e72f1d95eb0f7bdf4d01efbdaee1776c2008f79595963f44e98fced057f5957d86d57b70028f5025
+  languageName: node
+  linkType: hard
+
 "@vue/test-utils@npm:^2.4.6":
   version: 2.4.6
   resolution: "@vue/test-utils@npm:2.4.6"
@@ -2613,34 +2590,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vueuse/core@npm:^10.10.0":
-  version: 10.11.0
-  resolution: "@vueuse/core@npm:10.11.0"
-  dependencies:
-    "@types/web-bluetooth": "npm:^0.0.20"
-    "@vueuse/metadata": "npm:10.11.0"
-    "@vueuse/shared": "npm:10.11.0"
-    vue-demi: "npm:>=0.14.8"
-  checksum: 10c0/5cb0f8858123237d2dff12e7175c80f8752d6b5ed52217cef294f1ca287c0ee4fef45dbb4b0895c541266a2a85b280fd4c7c56ca95c9410918fa4c1ea61f77a4
-  languageName: node
-  linkType: hard
-
-"@vueuse/metadata@npm:10.11.0":
-  version: 10.11.0
-  resolution: "@vueuse/metadata@npm:10.11.0"
-  checksum: 10c0/5a252d6da6ecaa2ac125a722f4635edea99c09d22ef656f7d4516e34ea4a603f2635c89e011352f81beff01e0f114d37fa512d90f5beb1a7af324b724cb568d5
-  languageName: node
-  linkType: hard
-
-"@vueuse/shared@npm:10.11.0":
-  version: 10.11.0
-  resolution: "@vueuse/shared@npm:10.11.0"
-  dependencies:
-    vue-demi: "npm:>=0.14.8"
-  checksum: 10c0/9ea0bf86d316ff0e4dcf8dd1c1cbdc07a5b26437fd404ebbb91ff9b1d4d5a718c5db602a2fbd4627be3377e2f763b5b5c1b0aec0169fdb3bf93ce143201de34a
-  languageName: node
-  linkType: hard
-
 "@wry/caches@npm:^1.0.0":
   version: 1.0.1
   resolution: "@wry/caches@npm:1.0.1"
@@ -2766,7 +2715,7 @@ __metadata:
     babel-preset-env: "npm:^1.7.0"
     babel-preset-vue: "npm:^2.0.2"
     bootstrap: "npm:^5.3.3"
-    bootstrap-vue-next: "npm:^0.23.2"
+    bootstrap-vue-next: "npm:0.26.8"
     cross-env: "npm:^7.0.3"
     date-fns: "npm:^2.29.3"
     dotenv-webpack: "npm:^7.0.3"
@@ -2803,7 +2752,7 @@ __metadata:
     vite-plugin-environment: "npm:^1.1.3"
     vitest: "npm:^2.0.5"
     vitest-canvas-mock: "npm:^0.3.3"
-    vue: "npm:3.4.31"
+    vue: "npm:3.5.13"
     vue-apollo: "npm:3.1.2"
     vue-i18n: "npm:9.13.1"
     vue-router: "npm:4.4.0"
@@ -3911,15 +3860,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"bootstrap-vue-next@npm:^0.23.2":
-  version: 0.23.5
-  resolution: "bootstrap-vue-next@npm:0.23.5"
-  dependencies:
-    "@floating-ui/vue": "npm:^1.1.1"
-    "@vueuse/core": "npm:^10.10.0"
+"bootstrap-vue-next@npm:0.26.8":
+  version: 0.26.8
+  resolution: "bootstrap-vue-next@npm:0.26.8"
   peerDependencies:
-    vue: ^3.4.27
-  checksum: 10c0/1655e82f898b7793424777b709cccf0a80d455622a90b0e21d095acb772d5d68652e7a01129ba612442be860b3208d5ccc04d0f362e366a1652a9efc497046b9
+    vue: ^3.5.13
+  checksum: 10c0/c10e7dd8a3188ca6e67451806cc2b2b91a7ae84bd87cae609824e4b9c77a1ac4abe5e073f660664627e628c4d8748f02696152dd1229304066a96ce5047086d3
   languageName: node
   linkType: hard
 
@@ -7175,6 +7121,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"magic-string@npm:^0.30.11":
+  version: 0.30.14
+  resolution: "magic-string@npm:0.30.14"
+  dependencies:
+    "@jridgewell/sourcemap-codec": "npm:^1.5.0"
+  checksum: 10c0/c52c2a6e699dfa8a840e13154da35464a40cd8b07049b695a8b282883b0426c0811af1e36ac26860b4267289340b42772c156a5608e87be97b63d510e617e87a
+  languageName: node
+  linkType: hard
+
 "magicast@npm:^0.3.4":
   version: 0.3.5
   resolution: "magicast@npm:0.3.5"
@@ -8002,6 +7957,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"picocolors@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "picocolors@npm:1.1.1"
+  checksum: 10c0/e2e3e8170ab9d7c7421969adaa7e1b31434f789afb9b3f115f6b96d91945041ac3ceb02e9ec6fe6510ff036bcc0bf91e69a1772edc0b707e12b19c0f2d6bcf58
+  languageName: node
+  linkType: hard
+
 "picomatch@npm:^2.0.4, picomatch@npm:^2.2.1, picomatch@npm:^2.3.1":
   version: 2.3.1
   resolution: "picomatch@npm:2.3.1"
@@ -8141,7 +8103,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss@npm:^8.4.0, postcss@npm:^8.4.18, postcss@npm:^8.4.38, postcss@npm:^8.4.39, postcss@npm:^8.4.8":
+"postcss@npm:^8.4.0, postcss@npm:^8.4.18, postcss@npm:^8.4.39, postcss@npm:^8.4.8":
   version: 8.4.40
   resolution: "postcss@npm:8.4.40"
   dependencies:
@@ -8163,6 +8125,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:^8.4.48":
+  version: 8.4.49
+  resolution: "postcss@npm:8.4.49"
+  dependencies:
+    nanoid: "npm:^3.3.7"
+    picocolors: "npm:^1.1.1"
+    source-map-js: "npm:^1.2.1"
+  checksum: 10c0/f1b3f17aaf36d136f59ec373459f18129908235e65dbdc3aee5eef8eba0756106f52de5ec4682e29a2eab53eb25170e7e871b3e4b52a8f1de3d344a514306be3
+  languageName: node
+  linkType: hard
+
 "prelude-ls@npm:^1.2.1":
   version: 1.2.1
   resolution: "prelude-ls@npm:1.2.1"
@@ -8971,6 +8944,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"source-map-js@npm:^1.2.1":
+  version: 1.2.1
+  resolution: "source-map-js@npm:1.2.1"
+  checksum: 10c0/7bda1fc4c197e3c6ff17de1b8b2c20e60af81b63a52cb32ec5a5d67a20a7d42651e2cb34ebe93833c5a2a084377e17455854fee3e21e7925c64a51b6a52b0faf
+  languageName: node
+  linkType: hard
+
 "source-map-support@npm:^0.5.16":
   version: 0.5.21
   resolution: "source-map-support@npm:0.5.21"
@@ -10064,7 +10044,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vue-demi@npm:>=0.13.0, vue-demi@npm:>=0.14.8, vue-demi@npm:^0.14.6":
+"vue-demi@npm:^0.14.6":
   version: 0.14.10
   resolution: "vue-demi@npm:0.14.10"
   peerDependencies:
@@ -10121,21 +10101,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vue@npm:3.4.31":
-  version: 3.4.31
-  resolution: "vue@npm:3.4.31"
+"vue@npm:3.5.13":
+  version: 3.5.13
+  resolution: "vue@npm:3.5.13"
   dependencies:
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/compiler-sfc": "npm:3.4.31"
-    "@vue/runtime-dom": "npm:3.4.31"
-    "@vue/server-renderer": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/compiler-sfc": "npm:3.5.13"
+    "@vue/runtime-dom": "npm:3.5.13"
+    "@vue/server-renderer": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
   peerDependencies:
     typescript: "*"
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/d9d7ac45f2f9b69b3c2f1cabf2d70cad4e829f7daebc2d2896b5e2e58074fee002d870691cfeb12af891ce1bedac2318269dffc4c581319823ed5e5e9173cd03
+  checksum: 10c0/4bbb5caf3f04fed933b01c100804f3693ff902984a3152ea1359a972264fa3240f6551d32f0163a79c64df3715b4d6691818c9f652cdd41b2473c69e2b0a373d
   languageName: node
   linkType: hard
 
diff --git a/frontend/package.json b/frontend/package.json
index 5aeb01cce..e95d62110 100755
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -35,7 +35,7 @@
     "babel-core": "^7.0.0-bridge.0",
     "babel-preset-vue": "^2.0.2",
     "bootstrap": "^5.3.3",
-    "bootstrap-vue-next": "^0.23.3",
+    "bootstrap-vue-next": "0.26.8",
     "clipboard-polyfill": "^4.0.0-rc1",
     "date-fns": "^2.29.3",
     "es6-promise": "^4.1.1",
@@ -56,7 +56,7 @@
     "vee-validate": "^4.13.2",
     "vite": "3.2.10",
     "vite-plugin-commonjs": "^0.10.1",
-    "vue": "3.4.31",
+    "vue": "3.5.13",
     "vue-apollo": "^3.1.2",
     "vue-flatpickr-component": "^8.1.2",
     "vue-i18n": "^9.13.1",
@@ -93,7 +93,7 @@
     "postcss-html": "^1.3.0",
     "postcss-scss": "^4.0.3",
     "prettier": "^3.3.3",
-    "sass": "^1.38.0",
+    "sass": "1.77.6",
     "stylelint": "16.7.0",
     "stylelint-config-recommended-vue": "1.5.0",
     "stylelint-config-standard-scss": "13.1.0",
diff --git a/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss b/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss
index 9e22c81d8..be37bf29a 100644
--- a/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss
+++ b/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss
@@ -19,7 +19,7 @@ $h3-font-size: $font-size-base * 1.0625 ;
 $h4-font-size: $font-size-base * 0.9375 ;
 $h5-font-size: $font-size-base * 0.8125 ;
 $h6-font-size: $font-size-base * 0.625 ;
-$headings-margin-bottom: ($spacer / 2);
+$headings-margin-bottom: calc($spacer / 2);
 $headings-font-family: inherit ;
 $headings-font-weight: $font-weight-bold ;
 $headings-line-height: 1.5 ;
diff --git a/frontend/src/components/DecayInformations/CollapseLinksList.vue b/frontend/src/components/DecayInformations/CollapseLinksList.vue
index 366e13bea..5e0abd568 100644
--- a/frontend/src/components/DecayInformations/CollapseLinksList.vue
+++ b/frontend/src/components/DecayInformations/CollapseLinksList.vue
@@ -42,7 +42,7 @@ export default {
       type: Number,
       required: true,
     },
-    value: { type: Number, required: true },
+    modelValue: { type: Number, required: true },
     pageSize: { type: Number, default: 5 },
     pending: { type: Boolean, default: false },
   },
@@ -56,10 +56,10 @@ export default {
   },
   methods: {
     resetTransactionLinkList() {
-      this.$emit('input', 0)
+      this.$emit('update:modelValue', 0)
     },
     loadMoreLinks() {
-      this.$emit('input', this.value + 1)
+      this.$emit('update:modelValue', this.modelValue + 1)
     },
   },
 }
diff --git a/frontend/src/components/Inputs/InputUsername.vue b/frontend/src/components/Inputs/InputUsername.vue
index d3944a961..530f60304 100644
--- a/frontend/src/components/Inputs/InputUsername.vue
+++ b/frontend/src/components/Inputs/InputUsername.vue
@@ -14,7 +14,7 @@
             data-test="username"
             @update:modelValue="usernameValue = $event"
           />
-          <BButton size="md" text="Button" variant="secondary" append @click="emitSetIsEdit">
+          <BButton size="md" text="Button" variant="secondary" append @click="clearInput">
             <IBiXCircle style="height: 17px; width: 17px" />
           </BButton>
         </BInputGroup>
@@ -47,18 +47,17 @@ import { ref, computed, watch, defineProps, defineEmits } from 'vue'
 import { useField, useForm } from 'vee-validate'
 
 const props = defineProps({
-  isEdit: { type: Boolean, default: false },
   rules: { type: Object, default: () => ({ required: true }) },
   name: { type: String, default: 'username' },
   label: { type: String, default: 'Username' },
   placeholder: { type: String, default: 'Username' },
-  modelValue: { type: String, required: true },
   showAllErrors: { type: Boolean, default: false },
   immediate: { type: Boolean, default: false },
   unique: { type: Boolean, required: true },
+  initialUsernameValue: { type: String, default: '' },
 })
 
-const currentValue = ref(props?.modelValue)
+const currentValue = ref(props.initialUsernameValue)
 
 const {
   meta: usernameMeta,
@@ -69,11 +68,13 @@ const {
   initialValue: currentValue,
 })
 
-const emit = defineEmits(['update:modelValue', 'set-is-edit'])
+const clearInput = () => (usernameValue.value = '')
 
 const labelFor = computed(() => `${props.name}-input-field`)
-
-const emitSetIsEdit = (bool) => {
-  emit('set-is-edit', bool)
-}
 </script>
+
+<style>
+div#username_form > div > label {
+  margin-bottom: 8px;
+}
+</style>
diff --git a/frontend/src/components/Transactions/GddTransaction.vue b/frontend/src/components/Transactions/GddTransaction.vue
index 4e0983d9a..b5e6939e1 100644
--- a/frontend/src/components/Transactions/GddTransaction.vue
+++ b/frontend/src/components/Transactions/GddTransaction.vue
@@ -14,7 +14,10 @@
       </BCol>
       <BCol>
         <div>
-          <component :is="nameComponent" v-bind="nameProps" />
+          <Name v-if="useNameComponent" v-bind="nameProps" />
+          <div v-else :class="nameProps.class">
+            {{ nameProps.creationLinkedUser }}
+          </div>
         </div>
         <span class="small">{{ $d(new Date(props.transaction.balanceDate), 'short') }}</span>
         <span class="ms-4 small">{{ $d(new Date(props.transaction.balanceDate), 'time') }}</span>
@@ -112,14 +115,15 @@ const avatarProps = computed(() => {
   }
 })
 
-const nameComponent = computed(() => {
-  return isCreationType.value ? 'div' : Name
+const useNameComponent = computed(() => {
+  return !isCreationType.value
 })
 
 const nameProps = computed(() => {
   if (isCreationType.value) {
     return {
       class: 'fw-bold',
+      creationLinkedUser: `${props.transaction.linkedUser.firstName} ${props.transaction.linkedUser.lastName}`,
     }
   } else {
     return {
diff --git a/frontend/src/components/UserSettings/UserGMSLocationFormat.vue b/frontend/src/components/UserSettings/UserGMSLocationFormat.vue
index f3dab95aa..3bae2208d 100644
--- a/frontend/src/components/UserSettings/UserGMSLocationFormat.vue
+++ b/frontend/src/components/UserSettings/UserGMSLocationFormat.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="user-gms-location-format">
-    <BDropdown v-model="selectedOption">
-      <template #button-content>{{ selectedOptionLabel }}</template>
+    <BDropdown :text="selectedOptionLabel">
       <BDropdownItem
         v-for="option in dropdownOptions"
         :key="option.value"
diff --git a/frontend/src/components/UserSettings/UserGmsLocationCapturing.vue b/frontend/src/components/UserSettings/UserGmsLocationCapturing.vue
index 946dcd577..8620ad318 100644
--- a/frontend/src/components/UserSettings/UserGmsLocationCapturing.vue
+++ b/frontend/src/components/UserSettings/UserGmsLocationCapturing.vue
@@ -47,11 +47,12 @@ const communityLocation = ref({ lat: 0, lng: 0 })
 const emit = defineEmits(['close'])
 
 onResult(({ data }) => {
-  communityLocation.value.lng = data.userLocation.longitude
-  communityLocation.value.lat = data.userLocation.latitude
+  const locationData = data.userLocation
+  communityLocation.value.lng = locationData.communityLocation.longitude
+  communityLocation.value.lat = locationData.communityLocation.latitude
 
-  userLocation.value.lng = data?.userLocation?.longitude ?? communityLocation.value.lng
-  userLocation.value.lat = data?.userLocation?.latitude ?? communityLocation.value.lat
+  userLocation.value.lng = locationData.userLocation?.longitude ?? communityLocation.value.lng
+  userLocation.value.lat = locationData.userLocation?.latitude ?? communityLocation.value.lat
 })
 
 onError((err) => {
@@ -79,6 +80,7 @@ const saveUserLocation = async () => {
       },
     })
     toastSuccess(t('settings.GMS.location.updateSuccess'))
+    userLocation.value = capturedLocation.value
     isModalOpen.value = false
   } catch (error) {
     toastError(error.message)
diff --git a/frontend/src/components/UserSettings/UserLocationMap.vue b/frontend/src/components/UserSettings/UserLocationMap.vue
index ad56e13a3..c96ebdd1b 100644
--- a/frontend/src/components/UserSettings/UserLocationMap.vue
+++ b/frontend/src/components/UserSettings/UserLocationMap.vue
@@ -1,6 +1,7 @@
 <template>
   <div>
     <coordinates-display
+      v-if="map"
       :community-position="communityPosition"
       :user-position="userPosition"
       @centerMap="handleMapCenter"
@@ -45,8 +46,7 @@ onMounted(async () => {
   }
   console.log('onMounted() userPosition=', userPosition)
   console.log('onMounted() communityPosition=', communityPosition)
-  await nextTick()
-  initMap()
+  setTimeout(() => initMap(), 250)
   window.addEventListener('resize', handleResize)
 })
 
@@ -58,13 +58,14 @@ onUnmounted(() => {
 })
 
 function initMap() {
-  console.log('initMap()... mapContainer.value=',mapContainer.value)
-  console.log('initMap()... map.value=',map.value)
+  console.log('initMap()... mapContainer.value=', mapContainer.value)
+  console.log('initMap()... map.value=', map.value)
   if (mapContainer.value && !map.value) {
     map.value = L.map(mapContainer.value, {
       center: [userPosition.value.lat, userPosition.value.lng],
       zoom: defaultZoom,
       zoomControl: false,
+      closePopupOnClick: false,
     })
     console.log('initMap() map=', map)
 
@@ -78,6 +79,7 @@ function initMap() {
     // User marker (movable)
     userMarker.value = L.marker([userPosition.value.lat, userPosition.value.lng], {
       draggable: true,
+      interactive: false,
       icon: L.icon({
         iconUrl:
           'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-blue.png',
@@ -90,11 +92,18 @@ function initMap() {
     }).addTo(map.value)
     console.log('initMap() userMarker=', userMarker)
 
-    userMarker.value.bindPopup(t('settings.GMS.map.userLocationLabel')).openPopup()
+    userMarker.value
+      .bindPopup(t('settings.GMS.map.userLocationLabel'), {
+        autoClose: false,
+        closeOnClick: false,
+        closeButton: false,
+      })
+      .openPopup()
 
     // Community marker (fixed)
     communityMarker.value = L.marker([communityPosition.value.lat, communityPosition.value.lng], {
       draggable: false,
+      interactive: false,
       icon: L.icon({
         iconUrl:
           'https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-red.png',
@@ -107,7 +116,13 @@ function initMap() {
     }).addTo(map.value)
     console.log('initMap() communityMarker=', communityMarker)
 
-    communityMarker.value.bindPopup(t('settings.GMS.map.communityLocationLabel'))
+    communityMarker.value
+      .bindPopup(t('settings.GMS.map.communityLocationLabel'), {
+        autoClose: false,
+        closeOnClick: false,
+        closeButton: false,
+      })
+      .openPopup()
 
     map.value.on('click', onMapClick)
     userMarker.value.on('dragend', onMarkerDragEnd)
diff --git a/frontend/src/components/UserSettings/UserName.vue b/frontend/src/components/UserSettings/UserName.vue
index c34999048..3042fa35a 100644
--- a/frontend/src/components/UserSettings/UserName.vue
+++ b/frontend/src/components/UserSettings/UserName.vue
@@ -21,16 +21,13 @@
           <BRow class="mb-3">
             <BCol class="col-12">
               <input-username
-                :model-value="username"
                 name="username"
                 :placeholder="$t('form.username-placeholder')"
                 show-all-errors
                 :unique="true"
                 :rules="rules"
-                :is-edit="isEdit"
                 data-test="component-input-username"
-                @set-is-edit="setIsEdit(true)"
-                @update:model-value="username = $event"
+                :initial-username-value="username"
               />
             </BCol>
             <BCol class="col-12">
@@ -64,7 +61,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
+import { computed } from 'vue'
 import { useStore } from 'vuex'
 import { useMutation } from '@vue/apollo-composable'
 import { useI18n } from 'vue-i18n'
@@ -78,9 +75,6 @@ const store = useStore()
 const { toastError, toastSuccess } = useAppToast()
 const { t } = useI18n()
 
-const isEdit = ref(false)
-const username = ref(store.state.username || '')
-const usernameUnique = ref(false)
 const rules = {
   required: true,
   min: 3,
@@ -103,12 +97,9 @@ const onSubmit = handleSubmit(async () => {
   }
 })
 
-const setIsEdit = (bool) => {
-  username.value = store.state.username
-  isEdit.value = bool
-}
+const username = computed(() => store.state.username || '')
 
-const newUsername = computed(() => username.value !== store.state.username)
+const newUsername = computed(() => values.username && values.username !== store.state.username)
 
 const disabled = (err) => {
   return !newUsername.value || !!Object.keys(err).length
diff --git a/frontend/src/components/UserSettings/UserNamingFormat.vue b/frontend/src/components/UserSettings/UserNamingFormat.vue
index 664cd4a00..530bc235d 100644
--- a/frontend/src/components/UserSettings/UserNamingFormat.vue
+++ b/frontend/src/components/UserSettings/UserNamingFormat.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="user-naming-format">
-    <BDropdown v-model="selectedOption">
-      <template #button-content>{{ selectedOptionLabel }}</template>
+    <BDropdown :text="selectedOptionLabel">
       <BDropdownItem
         v-for="option in dropdownOptions"
         :key="option.value"
diff --git a/frontend/src/composables/useToast.js b/frontend/src/composables/useToast.js
index 826119ec2..c3f6697dd 100644
--- a/frontend/src/composables/useToast.js
+++ b/frontend/src/composables/useToast.js
@@ -1,9 +1,9 @@
 import { useI18n } from 'vue-i18n'
-import { useToast } from 'bootstrap-vue-next'
+import { useToastController } from 'bootstrap-vue-next'
 
 export function useAppToast() {
   const { t } = useI18n()
-  const { show } = useToast()
+  const { show } = useToastController()
   const toastSuccess = (message) => {
     toast(message, {
       title: t('success'),
diff --git a/frontend/src/pages/Settings.vue b/frontend/src/pages/Settings.vue
index 33a99044e..53a926d39 100644
--- a/frontend/src/pages/Settings.vue
+++ b/frontend/src/pages/Settings.vue
@@ -94,7 +94,7 @@
             </BCol>
             <BCol cols="12" md="6" lg="6" class="text-end">
               <user-settings-switch
-                :initial-value="$store.state.humhubAllowed"
+                :initial-value="state.humhubAllowed"
                 :attr-name="'humhubAllowed'"
                 :disabled="isHumhubActivated"
                 :enabled-text="$t('settings.humhub.enabled')"
@@ -111,7 +111,7 @@
             </BCol>
             <BCol cols="12" md="6" lg="6">
               <user-naming-format
-                :initial-value="$store.state.humhubPublishName"
+                :initial-value="state.humhubPublishName"
                 :attr-name="'humhubPublishName'"
                 :success-message="$t('settings.humhub.publish-name.updated')"
               />
@@ -125,7 +125,7 @@
             </BCol>
             <BCol cols="12" md="6" lg="6" class="text-end">
               <user-settings-switch
-                :initial-value="$store.state.gmsAllowed"
+                :initial-value="state.gmsAllowed"
                 :attr-name="'gmsAllowed'"
                 :enabled-text="$t('settings.GMS.enabled')"
                 :disabled-text="$t('settings.GMS.disabled')"
@@ -141,7 +141,7 @@
               </BCol>
               <BCol cols="12" md="6" lg="6">
                 <user-naming-format
-                  :initial-value="$store.state.gmsPublishName"
+                  :initial-value="state.gmsPublishName"
                   :attr-name="'gmsPublishName'"
                   :success-message="$t('settings.GMS.publish-name.updated')"
                 />
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 37ae05220..04b355921 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -385,7 +385,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/parser@npm:^7.24.7, @babel/parser@npm:^7.25.0, @babel/parser@npm:^7.25.3":
+"@babel/parser@npm:^7.25.0, @babel/parser@npm:^7.25.3":
   version: 7.25.3
   resolution: "@babel/parser@npm:7.25.3"
   dependencies:
@@ -1758,43 +1758,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@floating-ui/core@npm:^1.6.0":
-  version: 1.6.7
-  resolution: "@floating-ui/core@npm:1.6.7"
-  dependencies:
-    "@floating-ui/utils": "npm:^0.2.7"
-  checksum: 10c0/5c9ae274854f87ed09a61de758377d444c2b13ade7fd1067d74287b3e66de5340ae1281e48604b631c540855a2595cfc717adf9a2331eaadc4fa6d28e8571f64
-  languageName: node
-  linkType: hard
-
-"@floating-ui/dom@npm:^1.0.0":
-  version: 1.6.10
-  resolution: "@floating-ui/dom@npm:1.6.10"
-  dependencies:
-    "@floating-ui/core": "npm:^1.6.0"
-    "@floating-ui/utils": "npm:^0.2.7"
-  checksum: 10c0/ed7d7b400e00b2f31f1b8f11863af2cb95d0d3cd84635186ca31b41d8d9fe7fe12c85e4985617d7df7ed365abad48b327d0bae35934842007b4e1052d9780576
-  languageName: node
-  linkType: hard
-
-"@floating-ui/utils@npm:^0.2.7":
-  version: 0.2.7
-  resolution: "@floating-ui/utils@npm:0.2.7"
-  checksum: 10c0/0559ea5df2dc82219bad26e3509e9d2b70f6987e552dc8ddf7d7f5923cfeb7c44bf884567125b1f9cdb122a4c7e6e7ddbc666740bc30b0e4091ccbca63c6fb1c
-  languageName: node
-  linkType: hard
-
-"@floating-ui/vue@npm:^1.1.1":
-  version: 1.1.4
-  resolution: "@floating-ui/vue@npm:1.1.4"
-  dependencies:
-    "@floating-ui/dom": "npm:^1.0.0"
-    "@floating-ui/utils": "npm:^0.2.7"
-    vue-demi: "npm:>=0.13.0"
-  checksum: 10c0/cab5db01302e586ca10dd164c20fd09c0de92c3c43fc9a2872f6c58a38a0c0b755c20ecbac755756479ec095ed382f5975704a7d5191a27b518825fdbb711360
-  languageName: node
-  linkType: hard
-
 "@googlemaps/js-api-loader@npm:^1.16.6":
   version: 1.16.8
   resolution: "@googlemaps/js-api-loader@npm:1.16.8"
@@ -2135,150 +2098,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@parcel/watcher-android-arm64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-android-arm64@npm:2.5.0"
-  conditions: os=android & cpu=arm64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-darwin-arm64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-darwin-arm64@npm:2.5.0"
-  conditions: os=darwin & cpu=arm64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-darwin-x64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-darwin-x64@npm:2.5.0"
-  conditions: os=darwin & cpu=x64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-freebsd-x64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-freebsd-x64@npm:2.5.0"
-  conditions: os=freebsd & cpu=x64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-arm-glibc@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-arm-glibc@npm:2.5.0"
-  conditions: os=linux & cpu=arm & libc=glibc
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-arm-musl@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-arm-musl@npm:2.5.0"
-  conditions: os=linux & cpu=arm & libc=musl
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-arm64-glibc@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-arm64-glibc@npm:2.5.0"
-  conditions: os=linux & cpu=arm64 & libc=glibc
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-arm64-musl@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-arm64-musl@npm:2.5.0"
-  conditions: os=linux & cpu=arm64 & libc=musl
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-x64-glibc@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-x64-glibc@npm:2.5.0"
-  conditions: os=linux & cpu=x64 & libc=glibc
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-linux-x64-musl@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-linux-x64-musl@npm:2.5.0"
-  conditions: os=linux & cpu=x64 & libc=musl
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-win32-arm64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-win32-arm64@npm:2.5.0"
-  conditions: os=win32 & cpu=arm64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-win32-ia32@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-win32-ia32@npm:2.5.0"
-  conditions: os=win32 & cpu=ia32
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher-win32-x64@npm:2.5.0":
-  version: 2.5.0
-  resolution: "@parcel/watcher-win32-x64@npm:2.5.0"
-  conditions: os=win32 & cpu=x64
-  languageName: node
-  linkType: hard
-
-"@parcel/watcher@npm:^2.4.1":
-  version: 2.5.0
-  resolution: "@parcel/watcher@npm:2.5.0"
-  dependencies:
-    "@parcel/watcher-android-arm64": "npm:2.5.0"
-    "@parcel/watcher-darwin-arm64": "npm:2.5.0"
-    "@parcel/watcher-darwin-x64": "npm:2.5.0"
-    "@parcel/watcher-freebsd-x64": "npm:2.5.0"
-    "@parcel/watcher-linux-arm-glibc": "npm:2.5.0"
-    "@parcel/watcher-linux-arm-musl": "npm:2.5.0"
-    "@parcel/watcher-linux-arm64-glibc": "npm:2.5.0"
-    "@parcel/watcher-linux-arm64-musl": "npm:2.5.0"
-    "@parcel/watcher-linux-x64-glibc": "npm:2.5.0"
-    "@parcel/watcher-linux-x64-musl": "npm:2.5.0"
-    "@parcel/watcher-win32-arm64": "npm:2.5.0"
-    "@parcel/watcher-win32-ia32": "npm:2.5.0"
-    "@parcel/watcher-win32-x64": "npm:2.5.0"
-    detect-libc: "npm:^1.0.3"
-    is-glob: "npm:^4.0.3"
-    micromatch: "npm:^4.0.5"
-    node-addon-api: "npm:^7.0.0"
-    node-gyp: "npm:latest"
-  dependenciesMeta:
-    "@parcel/watcher-android-arm64":
-      optional: true
-    "@parcel/watcher-darwin-arm64":
-      optional: true
-    "@parcel/watcher-darwin-x64":
-      optional: true
-    "@parcel/watcher-freebsd-x64":
-      optional: true
-    "@parcel/watcher-linux-arm-glibc":
-      optional: true
-    "@parcel/watcher-linux-arm-musl":
-      optional: true
-    "@parcel/watcher-linux-arm64-glibc":
-      optional: true
-    "@parcel/watcher-linux-arm64-musl":
-      optional: true
-    "@parcel/watcher-linux-x64-glibc":
-      optional: true
-    "@parcel/watcher-linux-x64-musl":
-      optional: true
-    "@parcel/watcher-win32-arm64":
-      optional: true
-    "@parcel/watcher-win32-ia32":
-      optional: true
-    "@parcel/watcher-win32-x64":
-      optional: true
-  checksum: 10c0/9bad727d8b11e5d150ec47459254544c583adaa47d047b8ef65e1c74aede1a0767dc7fc6b8997649dae07318d6ef39caba6a1c405d306398d5bcd47074ec5d29
-  languageName: node
-  linkType: hard
-
 "@pkgjs/parseargs@npm:^0.11.0":
   version: 0.11.0
   resolution: "@pkgjs/parseargs@npm:0.11.0"
@@ -2484,13 +2303,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/web-bluetooth@npm:^0.0.20":
-  version: 0.0.20
-  resolution: "@types/web-bluetooth@npm:0.0.20"
-  checksum: 10c0/3a49bd9396506af8f1b047db087aeeea9fe4301b7fad4fe06ae0f6e00d331138caae878fd09e6410658b70b4aaf10e4b191c41c1a5ff72211fe58da290c7d003
-  languageName: node
-  linkType: hard
-
 "@types/zen-observable@npm:^0.8.0":
   version: 0.8.7
   resolution: "@types/zen-observable@npm:0.8.7"
@@ -2733,19 +2545,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-core@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-core@npm:3.4.31"
-  dependencies:
-    "@babel/parser": "npm:^7.24.7"
-    "@vue/shared": "npm:3.4.31"
-    entities: "npm:^4.5.0"
-    estree-walker: "npm:^2.0.2"
-    source-map-js: "npm:^1.2.0"
-  checksum: 10c0/17833fa55af0168da4ec79b1233aba2bf6df9a88cd95be513a122f3433901e70284ce467a504a36547debdf49f887cf807734360a7660fd8f7622bf15c74b01d
-  languageName: node
-  linkType: hard
-
 "@vue/compiler-core@npm:3.5.12":
   version: 3.5.12
   resolution: "@vue/compiler-core@npm:3.5.12"
@@ -2759,13 +2558,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-dom@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-dom@npm:3.4.31"
+"@vue/compiler-core@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-core@npm:3.5.13"
   dependencies:
-    "@vue/compiler-core": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/136b2208685d7d67e282a7da5f377f40878c467832789be21aadbe322832541aa20a4e2d0c5faa57b4f5608067eeb680d123fdb08c2ef9b28f0d6a94a3d79dbc
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/shared": "npm:3.5.13"
+    entities: "npm:^4.5.0"
+    estree-walker: "npm:^2.0.2"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/b89f3e3ca92c3177ae449ada1480df13d99b5b3b2cdcf3202fd37dc30f294a1db1f473209f8bae9233e2d338632219d39b2bfa6941d158cea55255e4b0b30f90
   languageName: node
   linkType: hard
 
@@ -2779,20 +2581,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-sfc@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-sfc@npm:3.4.31"
+"@vue/compiler-dom@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-dom@npm:3.5.13"
   dependencies:
-    "@babel/parser": "npm:^7.24.7"
-    "@vue/compiler-core": "npm:3.4.31"
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/compiler-ssr": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-    estree-walker: "npm:^2.0.2"
-    magic-string: "npm:^0.30.10"
-    postcss: "npm:^8.4.38"
-    source-map-js: "npm:^1.2.0"
-  checksum: 10c0/b8983a52dd3d5d7f9640dbda5946f01fcb92213a6c3a9a76d1df8f67fd43c59402ab6ff4211a205bf91155c4cd2a45fb39c36a83199bc1256eaeb9f690895b73
+    "@vue/compiler-core": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/8f424a71883c9ef4abdd125d2be8d12dd8cf94ba56089245c88734b1f87c65e10597816070ba2ea0a297a2f66dc579f39275a9a53ef5664c143a12409612cd72
   languageName: node
   linkType: hard
 
@@ -2813,13 +2608,20 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/compiler-ssr@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/compiler-ssr@npm:3.4.31"
+"@vue/compiler-sfc@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-sfc@npm:3.5.13"
   dependencies:
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/8083959c21b344f8ee5029c0ea91d50118a32b7c7c430971a721785b0349ce92d82d9cf17d7991a283f79b4ec1c68db4d1d182e035c17aa9116aa07ee115bac0
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/compiler-core": "npm:3.5.13"
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/compiler-ssr": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+    estree-walker: "npm:^2.0.2"
+    magic-string: "npm:^0.30.11"
+    postcss: "npm:^8.4.48"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/5fd57895ce2801e480c08f31f91f0d1746ed08a9c1973895fd7269615f5bcdf75497978fb358bda738938d9844dea2404064c53b2cdda991014225297acce19e
   languageName: node
   linkType: hard
 
@@ -2833,6 +2635,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-ssr@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/compiler-ssr@npm:3.5.13"
+  dependencies:
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/67621337b12fc414fcf9f16578961850724713a9fb64501136e432c2dfe95de99932c46fa24be9820f8bcdf8e7281f815f585b519a95ea979753bafd637dde1b
+  languageName: node
+  linkType: hard
+
 "@vue/devtools-api@npm:^6.0.0-beta.11, @vue/devtools-api@npm:^6.5.0, @vue/devtools-api@npm:^6.6.1, @vue/devtools-api@npm:^6.6.3":
   version: 6.6.3
   resolution: "@vue/devtools-api@npm:6.6.3"
@@ -2851,15 +2663,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/reactivity@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/reactivity@npm:3.4.31"
-  dependencies:
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/974ce9c9f26367845d71ab37aa5644b06f5e8e938ebe343004a8cb700505350da70fd315f39aecc46ffa62c474e3fb947529bd3981b66efab8ab45c34189a334
-  languageName: node
-  linkType: hard
-
 "@vue/reactivity@npm:3.5.12":
   version: 3.5.12
   resolution: "@vue/reactivity@npm:3.5.12"
@@ -2869,13 +2672,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/runtime-core@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/runtime-core@npm:3.4.31"
+"@vue/reactivity@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/reactivity@npm:3.5.13"
   dependencies:
-    "@vue/reactivity": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  checksum: 10c0/446711364e34520d5f38133950ecb27ede0d235fabb74237b51dc6ef22cce1b5db94033acbf6fc485c2dd3034862492eb247d267487bd36c88cb4ad151ffaf3c
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/4bf2754a4b8cc31afc8da5bdfd12bba6be67b2963a65f7c9e2b59810883c58128dfc58cce6d1e479c4f666190bc0794f17208d9efd3fc909a2e4843d2cc0e69e
   languageName: node
   linkType: hard
 
@@ -2889,15 +2691,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/runtime-dom@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/runtime-dom@npm:3.4.31"
+"@vue/runtime-core@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/runtime-core@npm:3.5.13"
   dependencies:
-    "@vue/reactivity": "npm:3.4.31"
-    "@vue/runtime-core": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-    csstype: "npm:^3.1.3"
-  checksum: 10c0/4c0b20f16ad3a676d1a61b07f24d1668166e5b0cc133344eafcecde308952d577005fc4a1fa77fd055dffce5dbacbd4577688f2dc151ac0f2f6e1d31529fdfc6
+    "@vue/reactivity": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  checksum: 10c0/b6be854bf082a224222614a334fbeac0e7b6445f3cf4ea45cbd49ae4bb1551200c461c14c7a452d748f2459f7402ad4dee5522d51be5a28ea4ae1f699a7c016f
   languageName: node
   linkType: hard
 
@@ -2913,15 +2713,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/server-renderer@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/server-renderer@npm:3.4.31"
+"@vue/runtime-dom@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/runtime-dom@npm:3.5.13"
   dependencies:
-    "@vue/compiler-ssr": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
-  peerDependencies:
-    vue: 3.4.31
-  checksum: 10c0/1e01142c2f7b6ee9b1e94a25142452fc60ef7fbdd47b4c145db001fbfd20e5c9fab97a74d7c0978b4a0beacc043f330524623b22f1bd7faa353c41feb824c549
+    "@vue/reactivity": "npm:3.5.13"
+    "@vue/runtime-core": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+    csstype: "npm:^3.1.3"
+  checksum: 10c0/8ee7f3980d19f77f8e7ae854e3ff1f7ee9a9b8b4e214c8d0492e1180ae818e33c04803b3d094503524d557431a30728b78cf15c3683d8abbbbd1b263a299d62a
   languageName: node
   linkType: hard
 
@@ -2937,10 +2737,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vue/shared@npm:3.4.31":
-  version: 3.4.31
-  resolution: "@vue/shared@npm:3.4.31"
-  checksum: 10c0/45643c0c7aa6b208891aac5798629ee5b982a5e52343c0a23ecc15b7aeb580b606ce78e70daee0fd691ccddb5f10196c4d56c7da4b8716157be1772a43f1c45e
+"@vue/server-renderer@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/server-renderer@npm:3.5.13"
+  dependencies:
+    "@vue/compiler-ssr": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
+  peerDependencies:
+    vue: 3.5.13
+  checksum: 10c0/f500bdabc199abf41f1d84defd2a365a47afce1f2223a34c32fada84f6193b39ec2ce50636483409eec81b788b8ef0fa1ff59c63ca0c74764d738c24409eef8f
   languageName: node
   linkType: hard
 
@@ -2951,6 +2756,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/shared@npm:3.5.13":
+  version: 3.5.13
+  resolution: "@vue/shared@npm:3.5.13"
+  checksum: 10c0/2c940ef907116f1c2583ca1d7733984e5705983ab07054c4e72f1d95eb0f7bdf4d01efbdaee1776c2008f79595963f44e98fced057f5957d86d57b70028f5025
+  languageName: node
+  linkType: hard
+
 "@vue/test-utils@npm:^2.4.5":
   version: 2.4.6
   resolution: "@vue/test-utils@npm:2.4.6"
@@ -2961,34 +2773,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vueuse/core@npm:^10.10.0":
-  version: 10.11.0
-  resolution: "@vueuse/core@npm:10.11.0"
-  dependencies:
-    "@types/web-bluetooth": "npm:^0.0.20"
-    "@vueuse/metadata": "npm:10.11.0"
-    "@vueuse/shared": "npm:10.11.0"
-    vue-demi: "npm:>=0.14.8"
-  checksum: 10c0/5cb0f8858123237d2dff12e7175c80f8752d6b5ed52217cef294f1ca287c0ee4fef45dbb4b0895c541266a2a85b280fd4c7c56ca95c9410918fa4c1ea61f77a4
-  languageName: node
-  linkType: hard
-
-"@vueuse/metadata@npm:10.11.0":
-  version: 10.11.0
-  resolution: "@vueuse/metadata@npm:10.11.0"
-  checksum: 10c0/5a252d6da6ecaa2ac125a722f4635edea99c09d22ef656f7d4516e34ea4a603f2635c89e011352f81beff01e0f114d37fa512d90f5beb1a7af324b724cb568d5
-  languageName: node
-  linkType: hard
-
-"@vueuse/shared@npm:10.11.0":
-  version: 10.11.0
-  resolution: "@vueuse/shared@npm:10.11.0"
-  dependencies:
-    vue-demi: "npm:>=0.14.8"
-  checksum: 10c0/9ea0bf86d316ff0e4dcf8dd1c1cbdc07a5b26437fd404ebbb91ff9b1d4d5a718c5db602a2fbd4627be3377e2f763b5b5c1b0aec0169fdb3bf93ce143201de34a
-  languageName: node
-  linkType: hard
-
 "@wry/caches@npm:^1.0.0":
   version: 1.0.1
   resolution: "@wry/caches@npm:1.0.1"
@@ -3676,7 +3460,7 @@ __metadata:
     babel-plugin-transform-require-context: "npm:^0.1.1"
     babel-preset-vue: "npm:^2.0.2"
     bootstrap: "npm:^5.3.3"
-    bootstrap-vue-next: "npm:^0.23.3"
+    bootstrap-vue-next: "npm:0.26.8"
     clipboard-polyfill: "npm:^4.0.0-rc1"
     cross-env: "npm:^7.0.3"
     date-fns: "npm:^2.29.3"
@@ -3710,7 +3494,7 @@ __metadata:
     prettier: "npm:^3.3.3"
     qrcanvas-vue: "npm:3"
     regenerator-runtime: "npm:^0.13.7"
-    sass: "npm:^1.38.0"
+    sass: "npm:1.77.6"
     stylelint: "npm:16.7.0"
     stylelint-config-recommended-vue: "npm:1.5.0"
     stylelint-config-standard-scss: "npm:13.1.0"
@@ -3725,7 +3509,7 @@ __metadata:
     vite-plugin-html: "npm:^3.2.2"
     vitest: "npm:^2.0.5"
     vitest-canvas-mock: "npm:^0.3.3"
-    vue: "npm:3.4.31"
+    vue: "npm:3.5.13"
     vue-apollo: "npm:^3.1.2"
     vue-flatpickr-component: "npm:^8.1.2"
     vue-i18n: "npm:^9.13.1"
@@ -3737,15 +3521,12 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"bootstrap-vue-next@npm:^0.23.3":
-  version: 0.23.5
-  resolution: "bootstrap-vue-next@npm:0.23.5"
-  dependencies:
-    "@floating-ui/vue": "npm:^1.1.1"
-    "@vueuse/core": "npm:^10.10.0"
+"bootstrap-vue-next@npm:0.26.8":
+  version: 0.26.8
+  resolution: "bootstrap-vue-next@npm:0.26.8"
   peerDependencies:
-    vue: ^3.4.27
-  checksum: 10c0/1655e82f898b7793424777b709cccf0a80d455622a90b0e21d095acb772d5d68652e7a01129ba612442be860b3208d5ccc04d0f362e366a1652a9efc497046b9
+    vue: ^3.5.13
+  checksum: 10c0/c10e7dd8a3188ca6e67451806cc2b2b91a7ae84bd87cae609824e4b9c77a1ac4abe5e073f660664627e628c4d8748f02696152dd1229304066a96ce5047086d3
   languageName: node
   linkType: hard
 
@@ -3951,7 +3732,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"chokidar@npm:^3.6.0":
+"chokidar@npm:>=3.0.0 <4.0.0, chokidar@npm:^3.6.0":
   version: 3.6.0
   resolution: "chokidar@npm:3.6.0"
   dependencies:
@@ -3970,15 +3751,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"chokidar@npm:^4.0.0":
-  version: 4.0.1
-  resolution: "chokidar@npm:4.0.1"
-  dependencies:
-    readdirp: "npm:^4.0.1"
-  checksum: 10c0/4bb7a3adc304059810bb6c420c43261a15bb44f610d77c35547addc84faa0374265c3adc67f25d06f363d9a4571962b02679268c40de07676d260de1986efea9
-  languageName: node
-  linkType: hard
-
 "chownr@npm:^2.0.0":
   version: 2.0.0
   resolution: "chownr@npm:2.0.0"
@@ -4512,15 +4284,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"detect-libc@npm:^1.0.3":
-  version: 1.0.3
-  resolution: "detect-libc@npm:1.0.3"
-  bin:
-    detect-libc: ./bin/detect-libc.js
-  checksum: 10c0/4da0deae9f69e13bc37a0902d78bf7169480004b1fed3c19722d56cff578d16f0e11633b7fbf5fb6249181236c72e90024cbd68f0b9558ae06e281f47326d50d
-  languageName: node
-  linkType: hard
-
 "dir-glob@npm:^3.0.1":
   version: 3.0.1
   resolution: "dir-glob@npm:3.0.1"
@@ -7547,16 +7310,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"micromatch@npm:^4.0.5":
-  version: 4.0.8
-  resolution: "micromatch@npm:4.0.8"
-  dependencies:
-    braces: "npm:^3.0.3"
-    picomatch: "npm:^2.3.1"
-  checksum: 10c0/166fa6eb926b9553f32ef81f5f531d27b4ce7da60e5baf8c021d043b27a388fb95e46a8038d5045877881e673f8134122b59624d5cecbd16eb50a42e7a6b5ca8
-  languageName: node
-  linkType: hard
-
 "mime-db@npm:1.52.0":
   version: 1.52.0
   resolution: "mime-db@npm:1.52.0"
@@ -7830,15 +7583,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"node-addon-api@npm:^7.0.0":
-  version: 7.1.1
-  resolution: "node-addon-api@npm:7.1.1"
-  dependencies:
-    node-gyp: "npm:latest"
-  checksum: 10c0/fb32a206276d608037fa1bcd7e9921e177fe992fc610d098aa3128baca3c0050fc1e014fa007e9b3874cf865ddb4f5bd9f43ccb7cbbbe4efaff6a83e920b17e9
-  languageName: node
-  linkType: hard
-
 "node-environment-flags@npm:^1.0.5":
   version: 1.0.6
   resolution: "node-environment-flags@npm:1.0.6"
@@ -8389,6 +8133,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"picocolors@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "picocolors@npm:1.1.1"
+  checksum: 10c0/e2e3e8170ab9d7c7421969adaa7e1b31434f789afb9b3f115f6b96d91945041ac3ceb02e9ec6fe6510ff036bcc0bf91e69a1772edc0b707e12b19c0f2d6bcf58
+  languageName: node
+  linkType: hard
+
 "picomatch@npm:^2.0.4, picomatch@npm:^2.2.1, picomatch@npm:^2.2.2, picomatch@npm:^2.3.1":
   version: 2.3.1
   resolution: "picomatch@npm:2.3.1"
@@ -8539,7 +8290,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss@npm:^8.4.0, postcss@npm:^8.4.18, postcss@npm:^8.4.38, postcss@npm:^8.4.39, postcss@npm:^8.4.8":
+"postcss@npm:^8.4.0, postcss@npm:^8.4.18, postcss@npm:^8.4.39, postcss@npm:^8.4.8":
   version: 8.4.41
   resolution: "postcss@npm:8.4.41"
   dependencies:
@@ -8572,6 +8323,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:^8.4.48":
+  version: 8.4.49
+  resolution: "postcss@npm:8.4.49"
+  dependencies:
+    nanoid: "npm:^3.3.7"
+    picocolors: "npm:^1.1.1"
+    source-map-js: "npm:^1.2.1"
+  checksum: 10c0/f1b3f17aaf36d136f59ec373459f18129908235e65dbdc3aee5eef8eba0756106f52de5ec4682e29a2eab53eb25170e7e871b3e4b52a8f1de3d344a514306be3
+  languageName: node
+  linkType: hard
+
 "prelude-ls@npm:^1.2.1":
   version: 1.2.1
   resolution: "prelude-ls@npm:1.2.1"
@@ -8769,13 +8531,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"readdirp@npm:^4.0.1":
-  version: 4.0.2
-  resolution: "readdirp@npm:4.0.2"
-  checksum: 10c0/a16ecd8ef3286dcd90648c3b103e3826db2b766cdb4a988752c43a83f683d01c7059158d623cbcd8bdfb39e65d302d285be2d208e7d9f34d022d912b929217dd
-  languageName: node
-  linkType: hard
-
 "readdirp@npm:~3.6.0":
   version: 3.6.0
   resolution: "readdirp@npm:3.6.0"
@@ -9106,20 +8861,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"sass@npm:^1.38.0":
-  version: 1.80.6
-  resolution: "sass@npm:1.80.6"
+"sass@npm:1.77.6":
+  version: 1.77.6
+  resolution: "sass@npm:1.77.6"
   dependencies:
-    "@parcel/watcher": "npm:^2.4.1"
-    chokidar: "npm:^4.0.0"
+    chokidar: "npm:>=3.0.0 <4.0.0"
     immutable: "npm:^4.0.0"
     source-map-js: "npm:>=0.6.2 <2.0.0"
-  dependenciesMeta:
-    "@parcel/watcher":
-      optional: true
   bin:
     sass: sass.js
-  checksum: 10c0/04ce40d4dcf06cf2a94a66c1cc4fd4a9eb4033fd039291acd0be9d1d4123860da568c5cbef9de8493ffbedd8acae1cd0b8346f5da21c6f7cf0ffd3477730beca
+  checksum: 10c0/fe5a393c0aa29eda9f83c06be9b94788b61fe8bad0616ee6e3a25d21ab504f430d40c0064fdca89b02b8e426411ae6dcd906c91f2e48c263575c3d392b6daeb1
   languageName: node
   linkType: hard
 
@@ -10675,7 +10426,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vue-demi@npm:>=0.13.0, vue-demi@npm:>=0.14.8, vue-demi@npm:^0.14.6":
+"vue-demi@npm:^0.14.6":
   version: 0.14.10
   resolution: "vue-demi@npm:0.14.10"
   peerDependencies:
@@ -10752,21 +10503,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vue@npm:3.4.31":
-  version: 3.4.31
-  resolution: "vue@npm:3.4.31"
+"vue@npm:3.5.13":
+  version: 3.5.13
+  resolution: "vue@npm:3.5.13"
   dependencies:
-    "@vue/compiler-dom": "npm:3.4.31"
-    "@vue/compiler-sfc": "npm:3.4.31"
-    "@vue/runtime-dom": "npm:3.4.31"
-    "@vue/server-renderer": "npm:3.4.31"
-    "@vue/shared": "npm:3.4.31"
+    "@vue/compiler-dom": "npm:3.5.13"
+    "@vue/compiler-sfc": "npm:3.5.13"
+    "@vue/runtime-dom": "npm:3.5.13"
+    "@vue/server-renderer": "npm:3.5.13"
+    "@vue/shared": "npm:3.5.13"
   peerDependencies:
     typescript: "*"
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/d9d7ac45f2f9b69b3c2f1cabf2d70cad4e829f7daebc2d2896b5e2e58074fee002d870691cfeb12af891ce1bedac2318269dffc4c581319823ed5e5e9173cd03
+  checksum: 10c0/4bbb5caf3f04fed933b01c100804f3693ff902984a3152ea1359a972264fa3240f6551d32f0163a79c64df3715b4d6691818c9f652cdd41b2473c69e2b0a373d
   languageName: node
   linkType: hard