"use client";

import { useEffect, useState } from 'react';
import FooterTop from './FooterTop';
import FooterBottom from './FooterBottom';
import { footerApi, FooterData } from "../../../../api/footerApi";
import footerData from "./footer.json";

const Footer = () => {
    const [data, setData] = useState<FooterData>(footerData as FooterData);

    useEffect(() => {
        const loadFooterData = async () => {
            try {
                const apiData = await footerApi.getFooter();
                setData(apiData);
            } catch (error) {
                console.error("Failed to load footer data from API, using static data:", error);
                // Keep using static data as fallback
            }
        };

        loadFooterData();
    }, []);

    return (
        <>
            <FooterTop data={data} />
            <FooterBottom data={data} />
        </>
    );
};

export default Footer;