import React from "react";
import { Link } from "react-router-dom";
import { TopFooterOneMenuProps } from "./TopFooterOne";


const TopFooterOneMenu: React.FC<TopFooterOneMenuProps> = ({
  category,
  subItems,
}) => {
  return (
    <ul className="flex gap-2 flex-col">
      <li className="text-[.6875rem] font-bold text-[#5e2785] cursor-default">
        {category}
      </li>
      <ul className="flex flex-col gap-1">
        {subItems.map(({ href = "#", text }) => (
          <li
            key={text}
            className="text-[.6875rem] text-[#5e2785] hover:underline w-fit"
          >
            {href ? <Link to={href}>{text}</Link> : <span>{text}</span>}
          </li>
        ))}
      </ul>
    </ul>
  );
};

export default TopFooterOneMenu;