display app configuration values

src/components/FormBottomBar.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="flex flex-col text-gray-400 text-sm mt-4 items-center">
     <div class="flex flex-row gap-2 justify-center">
-      <a v-if="config.imprint_link" :href="config.imprint_link" target="_blank">Datenschutz</a>
-      <a v-if="config.privacy_link" :href="config.privacy_link" target="_blank">Impressum</a>
+      <a v-if="clubImprint" :href="clubImprint" target="_blank">Datenschutz</a>
+      <a v-if="clubPrivacy" :href="clubPrivacy" target="_blank">Impressum</a>
     </div>
-    <p v-if="config.custom_login_message">{{ config.custom_login_message }}</p>
+    <p v-if="appCustom_login_message">{{ appCustom_login_message }}</p>
     <p>
       <a href="https://ff-admin.de/admin" target="_blank">FF Admin</a>
       entwickelt von
@@ -14,5 +14,21 @@
 </template>
 
 <script setup lang="ts">
-import { config } from "@/config";
+import { defineComponent } from "vue";
+import { mapActions, mapState } from "pinia";
+import { useConfigurationStore } from "@/stores/configuration";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  computed: {
+    ...mapState(useConfigurationStore, [
+      "appCustom_login_message",
+      "appShow_link_to_calendar",
+      "clubImprint",
+      "clubPrivacy",
+      "clubWebsite",
+    ]),
+  },
+});
 </script>

src/components/Header.vue

@@ -3,7 +3,7 @@
     <RouterLink to="/" class="flex flex-row gap-2 align-bottom w-fit h-full">
       <AppLogo />
       <h1 v-if="false" class="font-bold text-3xl w-fit whitespace-nowrap">
-        {{ config.app_name_overwrite || "FF Admin" }}
+        {{ clubName }}
       </h1>
     </RouterLink>
     <div class="flex flex-row gap-2 items-center">
@@ -37,16 +37,17 @@ import { useAuthStore } from "@/stores/auth";
 import { useNavigationStore } from "@/stores/admin/navigation";
 import TopLevelLink from "./admin/TopLevelLink.vue";
 import UserMenu from "./UserMenu.vue";
-import { config } from "@/config";
 </script>
 
 <script lang="ts">
 import { defineComponent } from "vue";
 import AppLogo from "./AppLogo.vue";
+import { useConfigurationStore } from "../stores/configuration";
 export default defineComponent({
   computed: {
     ...mapState(useAuthStore, ["authCheck"]),
     ...mapState(useNavigationStore, ["topLevel"]),
+    ...mapState(useConfigurationStore, ["clubName"]),
     routeName() {
       return typeof this.$route.name == "string" ? this.$route.name : "";
     },

src/components/UserMenu.vue

@@ -25,7 +25,7 @@
               <button button primary @click="close">Mein Account</button>
             </RouterLink>
           </MenuItem>
-          <MenuItem v-slot="{ close }">
+          <MenuItem v-if="false" v-slot="{ close }">
             <RouterLink to="/docs" target="_blank">
               <button button primary @click="close">Dokumentation</button>
             </RouterLink>