58 lines
1.7 KiB
TypeScript
58 lines
1.7 KiB
TypeScript
import Link from "next/link";
|
|
import { buttonVariants } from "./ui/button";
|
|
import docuConfig from "@/docu.json"; // Import JSON
|
|
|
|
export function Footer() {
|
|
const { footer } = docuConfig; // Extract footer from JSON
|
|
|
|
return (
|
|
<footer className="border-t w-full h-16">
|
|
<div className="container flex items-center sm:justify-between justify-center sm:gap-0 gap-4 h-full text-muted-foreground text-sm flex-wrap sm:py-0 py-3 max-sm:px-4">
|
|
{/* Footer Text */}
|
|
<div className="flex items-center gap-3">
|
|
<p className="text-center">
|
|
Copyright © {new Date().getFullYear()} {footer.copyright} - Crafted with love using{" "}
|
|
<Link
|
|
href="https://www.docubook.pro"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="underline underline-offset-2"
|
|
>
|
|
DocuBook
|
|
</Link>
|
|
</p>
|
|
</div>
|
|
|
|
{/* Footer Buttons */}
|
|
<div className="gap-4 items-center hidden md:flex">
|
|
<FooterButtons />
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|
|
|
|
export function FooterButtons() {
|
|
const { footer } = docuConfig; // Extract footer from JSON
|
|
|
|
return (
|
|
<>
|
|
{footer.buttons.map((button, index) => {
|
|
const Icon = require("lucide-react")[button.iconName]; // Dynamically load icon
|
|
return (
|
|
<Link
|
|
key={index}
|
|
href={button.url}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className={buttonVariants({ variant: "outline", size: "sm" })}
|
|
>
|
|
<Icon className="h-4 w-4 mr-2 dark:text-primary dark:hover:text-accent-foreground" />
|
|
{button.text}
|
|
</Link>
|
|
);
|
|
})}
|
|
</>
|
|
);
|
|
}
|