/**
 * @copyright nhcarrigan
 * @license Naomi's Public License
 * @author Naomi Carrigan
 */
import { Member } from "../../components/member";
import { Rule } from "../../components/rule";
import { TeamMembers } from "../../config/TeamMembers";
import type { JSX } from "react";

/**
 * Renders the /team page.
 * @returns A React Component.
 */
const Team = (): JSX.Element => {
  return (
    <main className="w-[95%] text-center
      max-w-4xl m-auto mt-16 mb-16 rounded-lg">
      <h1 className="text-5xl">{`Our Team`}</h1>
      <section>
        <p className="mb-2">
          {`Meet the people behind nhcarrigan's success!`}
        </p>
        <Rule />
        <div className="w-full">
          {TeamMembers.map((member) => {
            return <Member
              avatar={member.avatar}
              joinDate={member.joinDate}
              key={member.name}
              name={member.name}
              role={member.role}
              url={member.url}
            />;
          })}
        </div>
      </section>
    </main>
  );
};

export default Team;