Create contributors metadata (as an ESM module)

in a new "data" folder.

Author: briangershon

components/mdx/Author.tsx

@@ -1,33 +1,13 @@
 import { Box, Text, Link, HStack, Avatar } from '@chakra-ui/react'
 import NextLink from 'next/link'
+import { contributors } from '@data/contributors'
 
 interface AuthorProps {
   handle: string
 }
 
-interface AuthorDetails {
-  displayName: string
-  moreInfoUrl?: string
-  avatarUrl?: string
-  about?: string
-}
-
-interface AuthorLookup {
-  [key: string]: AuthorDetails
-}
-
-const authors: AuthorLookup = {
-  brianfive: {
-    displayName: 'Brian Gershon',
-    moreInfoUrl: 'https://brianfive.xyz',
-    avatarUrl: 'https://brianfive.xyz/profile.png',
-    about:
-      'Brian has been a member of the DeveloperDAO since November 2021, and enjoys building Web3 user experiences and smart contracts. Also active with Next.js, React and Serverless.',
-  },
-}
-
 export function Author({ handle }: AuthorProps) {
-  const author = authors[handle]
+  const author = contributors[handle]
   if (!author) {
     return null
   }

data/contributors.ts

@@ -0,0 +1,20 @@
+export interface ContributorDetails {
+  displayName: string
+  moreInfoUrl?: string
+  avatarUrl?: string
+  about?: string
+}
+
+export interface ContributorLookup {
+  [key: string]: ContributorDetails
+}
+
+export const contributors: ContributorLookup = {
+  brianfive: {
+    displayName: 'Brian Gershon',
+    moreInfoUrl: 'https://brianfive.xyz',
+    avatarUrl: 'https://brianfive.xyz/profile.png',
+    about:
+      'Brian has been a member of the DeveloperDAO since November 2021, and enjoys building Web3 user experiences and smart contracts. Also active with Next.js, React and Serverless.',
+  },
+}

pages/lessons/projects/4.mdx

@@ -8,7 +8,10 @@ icons: ['solidity', 'hardhat', 'openzeppelin']
 import { LessonHeader } from '../../../components/mdx/LessonHeader'
 import { Author } from '../../../components/mdx/Author'
 
-<LessonHeader title="Lesson 4: Testing your TierNFT" discussionUrl="https://developerdao.peeranha.io/discussions/1372/testing-solidity-contracts" />
+<LessonHeader
+  title="Lesson 4: Testing your TierNFT"
+  discussionUrl="https://developerdao.peeranha.io/discussions/1372/testing-solidity-contracts"
+/>
 
 In this lesson, we'll be adding automated tests for our smart contract created
 in Lesson 3.

tsconfig.json

@@ -18,6 +18,7 @@
     "paths": {
       "@components/*": ["components/*"],
       "@lib/*": ["lib/*"],
+      "@data/*": ["data/*"],
       "@utils/*": ["utils/*"],
       "@theme": ["theme"]
     }