werefox-cafe/src/info/pages/identities/partners/index.js

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

// Use this to list out partner info on this page. >w>

const PARTNERS = {
  // parnter: {
  //   url: "",
  //   avi: "",
  //   fields: {
  //     "": "",
  //   },
  //   bio: ``,
  // },
};

export default function Partners() {
  if (Object.keys(PARTNERS).length) {
    return (
      <BasicPage page_title="Partners" card_title="Partners!">
        <WCard>
          <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>
        </WCard>
      </BasicPage>
    );
  } else {
    return (
      <BasicPage page_title="Partners" card_title="Partners!">
        <WCard>
          <IDCard
            title="My loves!"
            src="/emoji/blue_heart.svg"
            alt="Blue heart emoji"
          >
            <div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
              <p className="p-6 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
                Oh! It looks like I don't have any partners at the moment.
                <br />
                Oh well!
              </p>
            </div>
          </IDCard>
        </WCard>
      </BasicPage>
    );
  }
}