140 lines
4.8 KiB
TypeScript
140 lines
4.8 KiB
TypeScript
import type { GlobalConfig } from 'payload'
|
|
|
|
import { revalidateHeader } from './hooks/revalidateHeader'
|
|
import { defaultHeaderData } from '@/spa/cmsNavigation'
|
|
|
|
const linkFields = [
|
|
{ name: 'label', type: 'text' as const, required: true },
|
|
{ name: 'path', type: 'text' as const, required: true },
|
|
]
|
|
|
|
const socialFields = [
|
|
{ name: 'label', type: 'text' as const, required: true },
|
|
{ name: 'href', type: 'text' as const, required: true },
|
|
{
|
|
name: 'icon',
|
|
type: 'select' as const,
|
|
required: true,
|
|
options: [
|
|
{ label: 'Instagram', value: 'instagram' },
|
|
{ label: 'LinkedIn', value: 'linkedin' },
|
|
{ label: 'Facebook', value: 'facebook' },
|
|
],
|
|
},
|
|
]
|
|
|
|
export const Header: GlobalConfig = {
|
|
slug: 'header',
|
|
access: {
|
|
read: () => true,
|
|
},
|
|
admin: {
|
|
livePreview: {
|
|
url: () => '/',
|
|
},
|
|
preview: () => '/',
|
|
},
|
|
fields: [
|
|
{
|
|
type: 'tabs',
|
|
tabs: [
|
|
{
|
|
label: 'Brand & Overlay',
|
|
fields: [
|
|
{ name: 'logo', type: 'upload', relationTo: 'media', admin: { description: 'Falls leer, wird /bmp-logo.png verwendet.' } },
|
|
{ name: 'overlayLogoAlt', type: 'text', defaultValue: defaultHeaderData.overlayLogoAlt, required: true },
|
|
{ name: 'overlayKicker', type: 'text', defaultValue: defaultHeaderData.overlayKicker, required: true },
|
|
{ name: 'overlayHeadline', type: 'textarea', defaultValue: defaultHeaderData.overlayHeadline, required: true },
|
|
{ name: 'mobileWatermark', type: 'textarea', defaultValue: defaultHeaderData.mobileWatermark, required: true },
|
|
{ name: 'menuLabel', type: 'text', defaultValue: defaultHeaderData.menuLabel, required: true },
|
|
{ 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 },
|
|
],
|
|
},
|
|
{
|
|
label: 'Navigation',
|
|
fields: [
|
|
{
|
|
name: 'navItems',
|
|
type: 'array',
|
|
defaultValue: defaultHeaderData.navItems,
|
|
fields: [
|
|
{ name: 'key', type: 'text', required: true, admin: { description: 'Stable internal key, e.g. presse.' } },
|
|
...linkFields,
|
|
{ name: 'subLabel', type: 'text' },
|
|
{
|
|
name: 'sub',
|
|
label: 'Sub navigation',
|
|
type: 'array',
|
|
fields: linkFields,
|
|
admin: { initCollapsed: true },
|
|
},
|
|
],
|
|
maxRows: 8,
|
|
admin: {
|
|
initCollapsed: true,
|
|
components: {
|
|
RowLabel: '@/Header/RowLabel#RowLabel',
|
|
},
|
|
},
|
|
},
|
|
{
|
|
name: 'secondaryLinks',
|
|
type: 'array',
|
|
defaultValue: defaultHeaderData.secondaryLinks,
|
|
fields: linkFields,
|
|
admin: { initCollapsed: true },
|
|
},
|
|
{
|
|
name: 'ctas',
|
|
label: 'CTA links',
|
|
type: 'array',
|
|
defaultValue: defaultHeaderData.ctas,
|
|
fields: [
|
|
...linkFields,
|
|
{
|
|
name: 'variant',
|
|
type: 'select',
|
|
defaultValue: 'primary',
|
|
options: [
|
|
{ label: 'Primary gold button', value: 'primary' },
|
|
{ label: 'Secondary outline button', value: 'secondary' },
|
|
{ label: 'Upload dashed link', value: 'upload' },
|
|
],
|
|
},
|
|
],
|
|
maxRows: 3,
|
|
admin: { initCollapsed: true },
|
|
},
|
|
],
|
|
},
|
|
{
|
|
label: 'Social & Language',
|
|
fields: [
|
|
{
|
|
name: 'socialLinks',
|
|
type: 'array',
|
|
defaultValue: defaultHeaderData.socialLinks,
|
|
fields: socialFields,
|
|
admin: { initCollapsed: true },
|
|
},
|
|
{
|
|
name: 'languages',
|
|
type: 'array',
|
|
defaultValue: defaultHeaderData.languages.map((label) => ({ label })),
|
|
fields: [{ name: 'label', type: 'text', required: true }],
|
|
maxRows: 4,
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
],
|
|
hooks: {
|
|
afterChange: [revalidateHeader],
|
|
},
|
|
}
|