import "./assets/css/styles.css";

// Define the Developer interface
interface Developer {
  name: string;
  lastName: string;
  role: string;
  linkedInURL: string;
}

// Footer component
export const Footer = () => {
  // Inline style for text elements
  const style: React.CSSProperties = {
    fontSize: 11,
    textDecoration: "none",
    color: "black",
    textAlign: "left",
  };

  // List of developers
  const developers: Developer[] = [
    {
      name: "Lorenzo",
      lastName: "Trujillo",
      role: "Desarrollador FrontEnd Mobile",
      linkedInURL: "https://www.linkedin.com/in/lorenzotrujillorojassd/",
    },
    {
      name: "Diego I.",
      lastName: "Correa",
      role: "Desarrollador BackEnd",
      linkedInURL: "https://www.linkedin.com/in/diego-ivan-correa/",
    },
    {
      name: "Omar",
      lastName: "Luna",
      role: "Desarrollador FrontEnd Web",
      linkedInURL:
        "https://www.linkedin.com/in/omar-luna-hern%C3%A1ndez-a280ba267/",
    },
  ];

  return (
    <div className="footer">
      {/* Footer credits section */}
      <div className="footer_credits">
        <div className="footer_license">
          <div style={style}>
            ©2024
            <a href="https://labsol.cozcyt.gob.mx/" style={style}>
              {" "}
              Labsol Network.
            </a>
          </div>
          <a href="https://www.gnu.org/licenses/gpl-3.0.html" style={style}>
            Bajo licencia GPL v.3.
          </a>
        </div>
        {/* Developer links */}
        <div className="footer_developers">
          {developers.map((dev, index) => {
            return (
              <a key={index} style={style} href={dev.linkedInURL}>
                @ {dev.name + " " + dev.lastName + " (" + dev.role + ")"}
              </a>
            );
          })}
        </div>
      </div>

      {/* Footer icons section */}
      <div className="footer_icons">
        <div className="footer_images">
          <img
            src="https://sit.cozcyt.gob.mx/static/images/sit_logo_texto_lab.png?v=2"
            title="Laboratorio de Software Libre Network"
            alt=""
          />
          <img
            src="https://sit.cozcyt.gob.mx/static/images/sit_logo_licencia.png?v=2"
            title="GNU General Public License v.3."
            alt=""
          />
        </div>
      </div>
    </div>
  );
};
