import React from "react";
import { Link } from "react-router-dom";

const FooterMiddleList = ({ items }) => {
  return (
    <div className="w-full grid grid-cols-4">
      {items.map((item, idx) => (
        <div key={item.id}>
          <h3 className="text-white text-base font-semibold mb-2">
            {item.title}
          </h3>
          <ul className="text-sm flex flex-col gap-2 font-bodyFont">
            {item.items.map((it, i) => (
              <li key={item.id + it.id + i} className="footerLink">
                <Link to={it.link}>{it.title}</Link>
              </li>
            ))}
          </ul>
        </div>
      ))}
    </div>
  );
};

export default FooterMiddleList;
