import { getCachedGlobal } from '@/utilities/getGlobals'
import Link from 'next/link'
import React from 'react'

import { CMSLink } from '@/components/Link'

export async function Footer() {
  const footerData = await getCachedGlobal('footer', 1)()

  const navItems = footerData?.navItems || []

  return (
<footer className="mt-auto border-t border-foreground/10 relative z-10">
  <div className="container py-8 flex flex-col items-center gap-4">

    <nav className="flex flex-wrap justify-center gap-6">
      {navItems.map(({ link }, i) => {
        return <CMSLink className="text-foreground/60 hover:text-foreground transition-colors text-sm" key={i} {...link} />
      })}
    </nav>

    <p className="text-foreground/40 text-sm text-center">
      &copy; {new Date().getFullYear()} ByMackie. All rights reserved.
    </p>

  </div>
</footer>
  )
}