import React, { useEffect, useState } from "react";
import { Button } from "@/components/ui/button";
import { ArrowRight } from "lucide-react";
import PopupModal from "@/components/Home/PopupModal";

const Footer = () => {
    const [showPopup, setShowPopup] = useState(true);

    useEffect(() => {
        const hasSeenPopup = localStorage.getItem("hasSeenPopup");
        if (hasSeenPopup) {
            setShowPopup(false);
        }
    }, []);

    const handleClosePopup = () => {
        localStorage.setItem("hasSeenPopup", "true");
        setShowPopup(false);
    };

    return (
        <>
            {showPopup && <PopupModal onClose={handleClosePopup} />}
            <footer className="relative bg-green-800 bg-[url('/assets/wood.svg')] rounded-tr-3xl rounded-tl-3xl text-white pt-12 px-6 mt-16">
                <div className="md:container max-w-7xl mx-auto text-center">
                    <h2 className="text-3xl font-bold">
                        Dapatkan Newsletter Terbaru Sekarang!
                    </h2>
                    <div className="mt-6 flex flex-col md:flex-row justify-center items-center gap-4">
                        <input
                            type="email"
                            placeholder="Masukkan Email"
                            className="px-4 py-2 rounded-lg text-black w-full md:w-1/3"
                        />
                        <Button className="bg-white text-green-800 px-6 py-2 rounded-lg">
                            Ikuti Sekarang
                            <ArrowRight className="ml-2 w-4 h-4" />
                        </Button>
                    </div>
                    <div className="mt-12 bg-[url('/assets/bg-footer-2.jpg')] bg-cover bg-center text-white p-2 md:p-6 pt-10 rounded-lg bottom-0 mx-auto max-w-5xl">
                        <img
                            src="/assets/dlh-logo.svg"
                            alt="Logo"
                            className="mx-auto mb-4 w-32 object-contain"
                        />
                        <p className="font-bold">
                            Dinas Lingkungan Hidup Provinsi DKI Jakarta
                        </p>
                        <p className="text-sm">
                            Bidang Tata Lingkungan dan Kebersihan
                        </p>
                        <p className="text-sm mt-2">
                            Jalan Mandala V No.67, Cililitan, Kramat Jati,
                            RT.2/RW.3, Cililitan, Kota Jakarta Timur, Daerah
                            Khusus Ibukota Jakarta 13640
                        </p>
                        <p className="text-sm mt-2">
                            Telepon: (021) 8092744 | Fax: (021) 8091056
                        </p>
                        <p className="text-sm">Email: dinaslh@jakarta.go.id</p>
                        <p className="text-xs mt-6">© Copyright 2016</p>
                    </div>
                </div>
            </footer>
        </>
    );
};

export default Footer;