feat: manage spa loader copy via payload

src/Header/config.ts

@@ -50,6 +50,8 @@ export const Header: GlobalConfig = {
             { name: 'openLabel', type: 'text', defaultValue: defaultHeaderData.openLabel, required: true },
             { name: 'closeLabel', type: 'text', defaultValue: defaultHeaderData.closeLabel, required: true },
             { name: 'overviewLabel', type: 'text', defaultValue: defaultHeaderData.overviewLabel, required: true },
+            { name: 'loadingBrand', type: 'text', defaultValue: defaultHeaderData.loadingBrand, required: true },
+            { name: 'loadingLabel', type: 'text', defaultValue: defaultHeaderData.loadingLabel, required: true },
           ],
         },
         {

src/payload-types.ts

@@ -5776,6 +5776,8 @@ export interface Header {
   openLabel: string;
   closeLabel: string;
   overviewLabel: string;
+  loadingBrand: string;
+  loadingLabel: string;
   navItems?:
     | {
         /**
@@ -5897,6 +5899,8 @@ export interface HeaderSelect<T extends boolean = true> {
   openLabel?: T;
   closeLabel?: T;
   overviewLabel?: T;
+  loadingBrand?: T;
+  loadingLabel?: T;
   navItems?:
     | T
     | {

src/spa/NextApp.tsx

@@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react'
 
 import Layout from '@/spa/components/layout/Layout'
 import ScrollToTop from '@/spa/components/layout/ScrollToTop'
-import type { SpaFooterData, SpaHeaderData } from '@/spa/cmsNavigation'
+import { defaultHeaderData, type SpaFooterData, type SpaHeaderData } from '@/spa/cmsNavigation'
 import { CmsRouteProvider, type CmsRouteData } from '@/spa/cmsRoute'
 import About from '@/spa/pages/About'
 import BlogDetail from '@/spa/pages/BlogDetail'
@@ -65,6 +65,7 @@ export default function NextApp({
   cmsRoute?: CmsRouteData
 }) {
   const [loading, setLoading] = useState(true)
+  const headerData = header || defaultHeaderData
 
   useEffect(() => {
     const timer = window.setTimeout(() => setLoading(false), 1500)
@@ -77,11 +78,11 @@ export default function NextApp({
         <div className="relative">
           <div className="w-24 h-24 border-2 border-accent/20 border-t-accent rounded-full animate-spin" />
           <div className="absolute inset-0 flex items-center justify-center">
-            <span className="text-accent font-display font-bold text-2xl">BMP</span>
+            <span className="text-accent font-display font-bold text-2xl">{headerData.loadingBrand}</span>
           </div>
         </div>
         <div className="mt-8 text-white/40 uppercase tracking-[0.4em] text-[10px] font-bold animate-pulse">
-          Exzellenz wird geladen...
+          {headerData.loadingLabel}
         </div>
       </div>
     )

src/spa/cmsNavigation.ts

@@ -22,6 +22,8 @@ export type SpaHeaderData = {
   openLabel: string
   closeLabel: string
   overviewLabel: string
+  loadingBrand: string
+  loadingLabel: string
   navItems: SpaHeaderNavItem[]
   secondaryLinks: SpaLink[]
   socialLinks: SpaSocialLink[]
@@ -65,6 +67,8 @@ export const defaultHeaderData: SpaHeaderData = {
   openLabel: 'Navigation öffnen',
   closeLabel: 'Menü schließen',
   overviewLabel: 'Überblick',
+  loadingBrand: 'BMP',
+  loadingLabel: 'Exzellenz wird geladen...',
   languages: ['DE', 'EN'],
   socialLinks: defaultSocialLinks,
   navItems: [