Cleanup contact lib code and fix linktree links

next.config.js

@@ -1,9 +1,9 @@
 // @ts-check
 // const contactsImport = require("./public/contacts.json");
 import contactsImport from "./public/contacts.json" assert { type: "json" };
-import { _compileUri } from "./src/lib/data/_contact.js";
+import { _compileUri } from "./src/lib/contact/_contact.js";
 
-/** @type {import('./src/lib/data/contact').Contacts} */
+/** @type {import('./src/lib/contact').Contacts} */
 const contacts = contactsImport.contacts;
 
 /** @type {import('next').NextConfig} */

src/lib/data/_contact.js → src/lib/contact/_contact.js

@@ -1,5 +1,5 @@
 /**
- * @param {import('./contact').Contact} contact 
+ * @param {import('../data/contact').Contact} contact 
  * @returns {string}
  */
 export function _compileUri(contact) {

src/lib/data/contact.ts → src/lib/contact/contact.ts

@@ -30,9 +30,9 @@ export function getHexAddress(contact: Contact): string {
 }
 
 /**
- * Compiles a contact into an address. Useful if the contact is of type 'uri'.
+ * Compiles a contact into a web address. Useful if the contact is of type 'uri'.
  */
-export function getContactAddressWithUri(contact: Contact): string | undefined {
+export function getContactWithUri(contact: Contact): string | undefined {
     if (contact.preferredType === "uri") {
         return _compileUri(contact);
     } else {

src/lib/contact/index.ts

@@ -0,0 +1 @@
+export * from "./contact";

src/pages/contact/index.tsx

@@ -9,7 +9,7 @@ import { BiWallet, BiBitcoin } from "react-icons/bi";
 import ContactTile from "../../components/ContactTile";
 import ModalTile from "../../components/ModalTile";
 import { FC } from "react";
-import { Contact, getContactAddressWithUri, getContactBlockchainViewerUrl } from "../../lib/data/contact";
+import { Contact, getContactWithUri, getContactBlockchainViewerUrl } from "../../lib/contact";
 
 const CryptoWalletsContent: FC<{ wallets: Contact[] }> = ({ wallets }) => (
     <div className="flex-grow flex flex-flow justify-center items-center flex-nowrap">
@@ -57,27 +57,27 @@ const ContactPage: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = ({
 
                 {/* Different links */}
                 <div className="container h-full flex-auto mx-auto flex flex-row justify-between items-start flex-wrap text-center">
-                    <ContactTile title={discord.displayName} href={getContactAddressWithUri(discord)}>
+                    <ContactTile title={discord.displayName} href={getContactWithUri(discord)}>
                         <BsDiscord />
                     </ContactTile>
 
-                    <ContactTile title={email.displayName} href={getContactAddressWithUri(email)} blankTarget={false} overwriteBlankTargetVisuals={true}>
+                    <ContactTile title={email.displayName} href={getContactWithUri(email)} blankTarget={false} overwriteBlankTargetVisuals={true}>
                         <MdEmail />
                     </ContactTile>
 
-                    <ContactTile title={github.displayName} href={getContactAddressWithUri(github)}>
+                    <ContactTile title={github.displayName} href={getContactWithUri(github)}>
                         <BsGithub />
                     </ContactTile>
 
-                    <ContactTile title={matrix.displayName} href={getContactAddressWithUri(matrix)}>
+                    <ContactTile title={matrix.displayName} href={getContactWithUri(matrix)}>
                         <SiMatrix />
                     </ContactTile>
 
                     <ModalTile title="Crypto Wallets" modalContent={<CryptoWalletsContent wallets={wallets} />}>
                         <BiWallet />
                     </ModalTile>
 
-                    <ContactTile title={openpgp.displayName} href={getContactAddressWithUri(openpgp)}>
+                    <ContactTile title={openpgp.displayName} href={getContactWithUri(openpgp)}>
                         <BsKeyFill />
                     </ContactTile>
                     <div className="basis-full lg:hidden h-16" />

src/pages/contact/linktree.tsx

@@ -8,7 +8,7 @@ import { BsDiscord, BsGithub } from "react-icons/bs";
 import { SiMatrix } from "react-icons/si";
 import { IconContext } from "react-icons";
 import { GetStaticProps, InferGetStaticPropsType, NextPage } from "next";
-import { Contact } from "../../lib/data/contact";
+import { getContactWithUri } from "../../lib/contact";
 
 const Linktree: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = ({ discord, email, github, matrix }) => (
     <>
@@ -37,25 +37,25 @@ const Linktree: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = ({ di
                         </ContactPill.BadgeWrapper>
                         <p>my portfolio website</p>
                     </ContactPill>
-                    <ContactPill href={email.target} disableBlankTarget={true}>
+                    <ContactPill href={email} disableBlankTarget={true}>
                         <ContactPill.BadgeWrapper>
                             <MdEmail color="black" />
                         </ContactPill.BadgeWrapper>
                         <p>you&apos;ve got mail</p>
                     </ContactPill>
-                    <ContactPill href={discord.target}>
+                    <ContactPill href={discord}>
                         <ContactPill.BadgeWrapper>
                             <BsDiscord color="black" />
                         </ContactPill.BadgeWrapper>
                         <p>e-girl hang out hotpot</p>
                     </ContactPill>
-                    <ContactPill href={matrix.target}>
+                    <ContactPill href={matrix}>
                         <ContactPill.BadgeWrapper>
                             <SiMatrix color="black" />
                         </ContactPill.BadgeWrapper>
                         <p>based next gen irc</p>
                     </ContactPill>
-                    <ContactPill href={github.target}>
+                    <ContactPill href={github}>
                         <ContactPill.BadgeWrapper>
                             <BsGithub color="black" />
                         </ContactPill.BadgeWrapper>
@@ -71,24 +71,33 @@ const Linktree: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = ({ di
     </>
 );
 
-export const getStaticProps: GetStaticProps<{
-    discord: Contact,
-    email: Contact,
-    github: Contact,
-    matrix: Contact,
-}> = async () => {
+type GSPProps = {
+    discord: string,
+    email: string,
+    github: string,
+    matrix: string,
+};
+
+export const getStaticProps: GetStaticProps<GSPProps> = async () => {
     // NB: You can't import JSON files at build into { default: contactsImport } because code split will break it if you try to import only a portion of it
     const contactsImport = await import("../../../public/contacts.json");
     const contacts = contactsImport.contacts;
 
-    return {
-        props: {
-            discord: contacts.discord,
-            email: contacts.email,
-            github: contacts.github,
-            matrix: contacts.matrix,
-        }
+    const props = {
+        discord: getContactWithUri(contacts.discord),
+        email: getContactWithUri(contacts.email),
+        github: getContactWithUri(contacts.github),
+        matrix: getContactWithUri(contacts.matrix),
     };
+
+    for (const [key, source] of Object.entries(props)) {
+        if (source === undefined) {
+            throw new Error("Compilation of contact into URI failed. Offending source: " + key);
+        }
+    }
+
+    // This is dead simple. If the above loop doesn't throw an error, then we can safely return the props.
+    return { props } as { props: GSPProps };
 };
 
 export default Linktree;