From 853cfe358bb40860402fdbdacaf521a235703a93 Mon Sep 17 00:00:00 2001 From: Brian Nelson Date: Tue, 28 Oct 2025 14:54:56 -0400 Subject: [PATCH] Header nav bar --- src/Header/Nav/index.tsx | 25 +++++++++++++++++++++++++ src/app/(frontend)/layout.tsx | 5 +++++ src/components/Navbar.tsx | 7 +++++++ utilities/queries.ts | 4 ++++ 4 files changed, 41 insertions(+) create mode 100644 src/Header/Nav/index.tsx create mode 100644 src/components/Navbar.tsx diff --git a/src/Header/Nav/index.tsx b/src/Header/Nav/index.tsx new file mode 100644 index 0000000..0417a24 --- /dev/null +++ b/src/Header/Nav/index.tsx @@ -0,0 +1,25 @@ +'use client' + +import React from 'react' + +import type { Header as HeaderType } from '@/src/payload-types' + +import { CMSLink } from '@/src/components/Link' +import Link from 'next/link' +import { SearchIcon } from 'lucide-react' + +export const HeaderNav: React.FC<{ data: HeaderType }> = ({ data }) => { + const navItems = data?.navItems || [] + + return ( + + ) +} \ No newline at end of file diff --git a/src/app/(frontend)/layout.tsx b/src/app/(frontend)/layout.tsx index 80b0529..b895964 100644 --- a/src/app/(frontend)/layout.tsx +++ b/src/app/(frontend)/layout.tsx @@ -1,6 +1,8 @@ import React from 'react' import './globals.css' import { AdminBar } from '@/src/components/AdminBar' +import { GLOBALS_QUERY } from '@/utilities/queries' +import { Header } from '@/src/Header/Component' export const metadata = { description: 'Web developer', @@ -9,11 +11,14 @@ export const metadata = { export default async function RootLayout(props: { children: React.ReactNode }) { const { children } = props + const data = GLOBALS_QUERY + console.log(data) return ( +
{children}
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx new file mode 100644 index 0000000..8e449f6 --- /dev/null +++ b/src/components/Navbar.tsx @@ -0,0 +1,7 @@ +import React from 'react' + +export default function Navbar() { + return ( + + ) +} diff --git a/utilities/queries.ts b/utilities/queries.ts index 6525416..3150d63 100644 --- a/utilities/queries.ts +++ b/utilities/queries.ts @@ -3,6 +3,10 @@ import { getPayload } from "payload" const payload = await getPayload({ config: payloadConfig }) +export const GLOBALS_QUERY = await payload.findGlobal({ + slug: 'header', +}) + export const HOMEPAGE_QUERY = await payload.find({ collection: 'pages', where: {