import { useState } from "react";
import Logo from "/MAV.svg";
import DevModal from "./DevModal";
import { useGetVersions } from "../hooks/useGetVersions";

const Footer = () => {
  const [isDevModalOpen, setDevModalOpen] = useState(false);
  const { versionsQuery } = useGetVersions();

  const versionData = versionsQuery?.data;

  const handleClick = () => {
    setDevModalOpen(true);
  };
  return (
    <>
      <footer className="bg-gray-900 border-t border-gray-700 text-white py-5 text-left p-8 h-30 mt-5 flex flex-col space-y-4 ">
        <img src={Logo} alt="Logo" width={100} height={100} onClick={handleClick} />
        <p className="text-sm">{new Date().getFullYear()} MAV Systems &copy; All rights reserved.</p>
      </footer>
      <DevModal isDevModalOpen={isDevModalOpen} handleClose={() => setDevModalOpen(false)} data={versionData} />
    </>
  );
};

export default Footer;