uldp.edu.vn/app/components/layout/Footer/FooterBottom.tsx

"use client";

import Link from "next/link";
import { FooterData } from "../../../../api/footerApi";
import footerData from "./footer.json";

interface FooterBottomProps {
    data: FooterData;
}

const FooterBottom = ({ data }: FooterBottomProps) => {
    const effectiveData = data || footerData;

    // Ensure we always have a valid `bottom` object, even if API shape changes
    const bottom = effectiveData?.bottom || footerData.bottom;

    // If bottom is still missing, avoid rendering to prevent runtime errors
    if (!bottom) {
        return null;
    }

    return (
        <div className="footer-bottom">
            <div className="container">
                <div className="footer-wrapper">
                    <p>
                        {bottom.copyright.text} <span>{bottom.copyright.brand}</span> {bottom.copyright.rights}
                    </p>
                    <ul className="bottom-list">
                        {bottom.menuLinks.map((item, index) => (
                            <li key={index}>
                                <Link href={item.href}>{item.label}</Link>
                            </li>
                        ))}
                    </ul>
                </div>
            </div>
        </div>
    );
};

export default FooterBottom;