import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";

export async function getStaticProps() {
  const fs = require("fs");
  const yaml = require("js-yaml");
  let PRONOUNS = "";

  try {
    let fileContent = fs.readFileSync("./data/identities/pronouns.yml", "utf8");
    PRONOUNS = yaml.load(fileContent);
  } catch (e) {
    console.log(e);
  }
  return {
    props: {
      PRONOUNS,
    },
  };
}

export default function Pronouns({ PRONOUNS }) {
  return (
    <BasicPage
      page_title={PRONOUNS["Pronouns"].page_title}
      card_title={PRONOUNS["Pronouns"].card_title}
    >
      {Object.keys(PRONOUNS).map((pronouns) => (
        <IDCard
          key={pronouns}
          title={PRONOUNS[pronouns].title}
          info={PRONOUNS[pronouns].info}
          url={PRONOUNS[pronouns].url}
          src={PRONOUNS[pronouns].src}
          alt={PRONOUNS[pronouns].alt}
        />
      ))}
    </BasicPage>
  );
}