feat(ui): add anchor links to Header nav and expand FAQ block

This commit is contained in:
MichalC
2026-09-03 23:43:26 +02:00
parent 2964cf66c5
commit 2e782c431a
4 changed files with 60 additions and 21 deletions
+2 -2
View File
@@ -48,8 +48,8 @@ export default async function RootLayout({
}),
]);
// Filtrujemy tylko poprawnie spopulowane strony (chroni przed brakiem dostępu lub usuniętymi relacjami)
const headerNavItems = (headerData.navigation || []).map((item: any) => item.page).filter((page: any) => typeof page === 'object' && page !== null);
// Filtrujemy tylko poprawnie spopulowane strony (chroni przed brakiem dostępu lub usuniętymi relacjami) lub linki anchor
const headerNavItems = (headerData.navigation || []).filter((item: any) => (item.page && typeof item.page === 'object' && item.page !== null) || item.anchor);
const footerNavItems = (footerData.navigation || []).map((item: any) => item.page).filter((page: any) => typeof page === 'object' && page !== null);
return (
+50 -17
View File
@@ -52,14 +52,31 @@ export function Header({ navItems = [] }: { navItems?: any[] }) {
{/* Desktop Navigation */}
<nav className="hidden xl:flex items-center gap-10">
{navItems.map((page, index) => (
<LocalizedLink
key={index}
page={page}
currentLocaleCode={currentLocale.code}
className="text-sm font-medium text-foreground/90 hover:text-accent transition-colors"
/>
))}
{navItems.map((item, index) => {
if (item.page && item.page.slug) {
return (
<LocalizedLink
key={index}
page={item.page}
currentLocaleCode={currentLocale.code}
className="text-sm font-medium text-foreground/90 hover:text-accent transition-colors"
/>
)
} else if (item.anchor) {
// If anchor only
const title = item.anchor.toUpperCase() // Fallback title
return (
<Link
key={index}
href={`/${currentLocale.code}#${item.anchor}`}
className="text-sm font-medium text-foreground/90 hover:text-accent transition-colors"
>
FAQ
</Link>
)
}
return null;
})}
</nav>
{/* Right Actions & Hamburger */}
@@ -87,15 +104,31 @@ export function Header({ navItems = [] }: { navItems?: any[] }) {
}`}
>
<nav className="flex flex-col gap-8 text-center w-full px-6">
{navItems.map((page, index) => (
<LocalizedLink
key={index}
page={page}
currentLocaleCode={currentLocale.code}
className="text-2xl font-bold text-foreground hover:text-accent transition-colors"
onClick={() => setIsMobileMenuOpen(false)}
/>
))}
{navItems.map((item, index) => {
if (item.page && item.page.slug) {
return (
<LocalizedLink
key={index}
page={item.page}
currentLocaleCode={currentLocale.code}
className="text-2xl font-bold text-foreground hover:text-accent transition-colors"
onClick={() => setIsMobileMenuOpen(false)}
/>
)
} else if (item.anchor) {
return (
<Link
key={index}
href={`/${currentLocale.code}#${item.anchor}`}
className="text-2xl font-bold text-foreground hover:text-accent transition-colors"
onClick={() => setIsMobileMenuOpen(false)}
>
FAQ
</Link>
)
}
return null;
})}
</nav>
<div className="absolute bottom-12 left-0 right-0 px-6 flex flex-col items-center">
+5 -1
View File
@@ -14,7 +14,11 @@ export const Header: GlobalConfig = {
name: 'page',
type: 'relationship',
relationTo: 'pages',
required: true,
required: false,
},
{
name: 'anchor',
type: 'text',
},
],
},
+3 -1
View File
@@ -989,7 +989,8 @@ export interface Header {
id: number;
navigation?:
| {
page: number | Page;
page?: (number | null) | Page;
anchor?: string | null;
id?: string | null;
}[]
| null;
@@ -1214,6 +1215,7 @@ export interface HeaderSelect<T extends boolean = true> {
| T
| {
page?: T;
anchor?: T;
id?: T;
};
updatedAt?: T;