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

// An object listing pages folks can visit
export async function getStaticProps() {
  const fs = require("fs");
  const yaml = require("js-yaml");
  let PARTNERS = {};

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

export default function Partners({ PARTNERS }) {
  if (Object.keys(PARTNERS).length) {
    return (
      <BasicPage page_title="Partners" card_title="Partners!">
        <IDCard
          title="My loves!"
          src="/emoji/blue_heart.svg"
          alt="Blue heart emoji"
        >
          {Object.keys(PARTNERS).map((partner) => (
            <LCard
              key={PARTNERS[partner].url}
              src={PARTNERS[partner].avi}
              alt={`${partner}'s Avatar`}
              url={PARTNERS[partner].url}
              user={partner}
              fields={PARTNERS[partner].fields}
              bio={PARTNERS[partner].bio}
            ></LCard>
          ))}
        </IDCard>
      </BasicPage>
    );
  } else {
    return (
      <BasicPage page_title="Partners" card_title="Partners!">
        <IDCard
          title="My loves!"
          src="/emoji/blue_heart.svg"
          alt="Blue heart emoji"
          info={{
            info: `Oh! It looks like I don't have any partners at the moment.`,
            more: `Oh well!`,
          }}
        ></IDCard>
      </BasicPage>
    );
  }
}