move pwa manifest to backend

src/App.vue

@@ -8,6 +8,11 @@
   </div>
   <Footer @contextmenu.prevent />
   <Notification />
+
+  <Teleport to="head">
+    <link rel="icon" type="image/ico" :href="config.server_address + '/api/public/favicon.ico'" />
+    <link rel="manifest" :href="config.server_address + '/api/public/manifest.webmanifest'" />
+  </Teleport>
 </template>
 
 <script setup lang="ts">
@@ -15,20 +20,32 @@ import { defineComponent } from "vue";
 import { RouterView } from "vue-router";
 import Header from "./components/Header.vue";
 import Footer from "./components/Footer.vue";
-import { mapState } from "pinia";
+import { mapActions, mapState } from "pinia";
 import { useAuthStore } from "./stores/auth";
 import { isAuthenticatedPromise } from "./router/authGuard";
 import ContextMenu from "./components/ContextMenu.vue";
 import Modal from "./components/Modal.vue";
 import Notification from "./components/Notification.vue";
+import { config } from "./config";
+import { useConfigurationStore } from "@/stores/configuration";
 </script>
 
 <script lang="ts">
 export default defineComponent({
+  watch: {
+    clubName() {
+      document.title = this.clubName;
+    },
+  },
   computed: {
     ...mapState(useAuthStore, ["authCheck"]),
+    ...mapState(useConfigurationStore, ["clubName"]),
   },
   mounted() {
+    this.configure();
+
+    document.title = this.clubName;
+
     if (!this.authCheck && localStorage.getItem("access_token")) {
       isAuthenticatedPromise().catch(() => {
         localStorage.removeItem("access_token");
@@ -36,5 +53,8 @@ export default defineComponent({
       });
     }
   },
+  methods: {
+    ...mapActions(useConfigurationStore, ["configure"]),
+  },
 });
 </script>

src/components/AppLogo.vue

@@ -0,0 +1,7 @@
+<template>
+  <img :src="url + '/api/public/applogo.png'" alt="LOGO" class="h-full w-auto" />
+</template>
+
+<script setup lang="ts">
+import { url } from "@/serverCom";
+</script>

src/components/Header.vue

@@ -1,7 +1,7 @@
 <template>
   <header class="flex flex-row h-16 min-h-16 justify-between p-3 md:px-5 bg-white shadow-xs">
     <RouterLink to="/" class="flex flex-row gap-2 align-bottom w-fit h-full">
-      <img src="/Logo.png" alt="LOGO" class="h-full w-auto" />
+      <AppLogo />
       <h1 v-if="false" class="font-bold text-3xl w-fit whitespace-nowrap">
         {{ config.app_name_overwrite || "FF Admin" }}
       </h1>
@@ -42,6 +42,7 @@ import { config } from "@/config";
 
 <script lang="ts">
 import { defineComponent } from "vue";
+import AppLogo from "./AppLogo.vue";
 export default defineComponent({
   computed: {
     ...mapState(useAuthStore, ["authCheck"]),

src/main.ts

@@ -9,6 +9,9 @@ import "../node_modules/nprogress/nprogress.css";
 import { http } from "./serverCom";
 import "./main.css";
 
+// auto generates splash screen for iOS
+import "pwacompat";
+
 NProgress.configure({ showSpinner: false });
 
 const app = createApp(App);

src/router/index.ts

@@ -2,14 +2,12 @@ import { createRouter, createWebHistory } from "vue-router";
 import Login from "@/views/Login.vue";
 
 import { isAuthenticated } from "./authGuard";
-import { loadAccountData } from "./accountGuard";
 import { isSetup } from "./setupGuard";
 import { abilityAndNavUpdate } from "./adminGuard";
 import type { PermissionType, PermissionSection, PermissionModule } from "@/types/permissionTypes";
 import { resetMemberStores, setMemberId } from "./memberGuard";
 import { resetProtocolStores, setProtocolId } from "./protocolGuard";
 import { resetNewsletterStores, setNewsletterId } from "./newsletterGuard";
-import { config } from "../config";
 import { setBackupPage } from "./backupGuard";
 
 const router = createRouter({
@@ -777,10 +775,6 @@ const router = createRouter({
   ],
 });
 
-router.afterEach((to, from) => {
-  document.title = config.app_name_overwrite || "FF Admin";
-});
-
 export default router;
 
 declare module "vue-router" {

src/serverCom.ts

@@ -135,4 +135,4 @@ async function* streamingFetch(path: string, abort?: AbortController) {
   }
 }
 
-export { http, newEventSource, streamingFetch, host };
+export { http, newEventSource, streamingFetch, host, url };

src/stores/configuration.ts

@@ -0,0 +1,30 @@
+import { defineStore } from "pinia";
+import { http } from "../serverCom";
+
+export const useConfigurationStore = defineStore("configuration", {
+  state: () => {
+    return {
+      clubName: "",
+      clubImprint: "",
+      clubPrivacy: "",
+      clubWebsite: "",
+      appCustom_login_message: "",
+      appShow_link_to_calendar: "",
+    };
+  },
+  actions: {
+    configure() {
+      http
+        .get("/public/configuration")
+        .then((res) => {
+          this.clubName = res.data["club.name"];
+          this.clubImprint = res.data["club.imprint"];
+          this.clubPrivacy = res.data["club.privacy"];
+          this.clubWebsite = res.data["club.website"];
+          this.appCustom_login_message = res.data["app.custom_login_message"];
+          this.appShow_link_to_calendar = res.data["app.show_link_to_calendar"];
+        })
+        .catch(() => {});
+    },
+  },
+});

src/views/Login.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">
           {{ config.app_name_overwrite || "FF Admin" }}
         </h2>
@@ -51,6 +51,7 @@ import FailureXMark from "@/components/FailureXMark.vue";
 import { resetAllPiniaStores } from "@/helpers/piniaReset";
 import FormBottomBar from "@/components/FormBottomBar.vue";
 import { config } from "@/config";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">

src/views/invite/Verify.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">Einrichtung</h2>
       </div>
 
@@ -49,6 +49,7 @@ import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
 import FormBottomBar from "@/components/FormBottomBar.vue";
 import TextCopy from "@/components/TextCopy.vue";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">

src/views/reset/Reset.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">TOTP zurücksetzen</h2>
       </div>
 
@@ -49,6 +49,7 @@ import FailureXMark from "@/components/FailureXMark.vue";
 import { RouterLink } from "vue-router";
 import FormBottomBar from "@/components/FormBottomBar.vue";
 import TextCopy from "@/components/TextCopy.vue";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">

src/views/reset/Start.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">TOTP zurücksetzen</h2>
       </div>
 
@@ -36,6 +36,7 @@ import Spinner from "@/components/Spinner.vue";
 import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
 import FormBottomBar from "@/components/FormBottomBar.vue";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">

src/views/setup/Setup.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">Einrichtung</h2>
       </div>
 
@@ -44,6 +44,7 @@ import Spinner from "@/components/Spinner.vue";
 import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
 import FormBottomBar from "@/components/FormBottomBar.vue";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">

src/views/setup/Verify.vue

@@ -2,7 +2,7 @@
   <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
-        <img src="/Logo.png" alt="LOGO" class="h-auto w-full" />
+        <AppLogo />
         <h2 class="text-center text-4xl font-extrabold text-gray-900">Einrichtung</h2>
       </div>
 
@@ -50,6 +50,7 @@ import FailureXMark from "@/components/FailureXMark.vue";
 import { RouterLink } from "vue-router";
 import FormBottomBar from "@/components/FormBottomBar.vue";
 import TextCopy from "@/components/TextCopy.vue";
+import AppLogo from "@/components/AppLogo.vue";
 </script>
 
 <script lang="ts">