diff --git a/package-lock.json b/package-lock.json index d1ddcd81..d12af9de 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "@fortawesome/free-brands-svg-icons": "^6.3.0", "@fortawesome/free-solid-svg-icons": "^6.3.0", "@fortawesome/react-fontawesome": "^0.2.0", + "@notionhq/client": "^2.2.15", "dotenv": "^16.0.3", "gatsby": "^5.11.0", "gatsby-plugin-dark-mode": "^1.1.2", @@ -3374,6 +3375,19 @@ "node": ">= 8" } }, + "node_modules/@notionhq/client": { + "version": "2.2.15", + "resolved": "https://registry.npmjs.org/@notionhq/client/-/client-2.2.15.tgz", + "integrity": "sha512-XhdSY/4B1D34tSco/GION+23GMjaS9S2zszcqYkMHo8RcWInymF6L1x+Gk7EmHdrSxNFva2WM8orhC4BwQCwgw==", + "license": "MIT", + "dependencies": { + "@types/node-fetch": "^2.5.10", + "node-fetch": "^2.6.1" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/@parcel/bundler-default": { "version": "2.8.3", "resolved": "https://registry.npmjs.org/@parcel/bundler-default/-/bundler-default-2.8.3.tgz", diff --git a/package.json b/package.json index 3bb329b2..f9a13b02 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "@fortawesome/free-brands-svg-icons": "^6.3.0", "@fortawesome/free-solid-svg-icons": "^6.3.0", "@fortawesome/react-fontawesome": "^0.2.0", + "@notionhq/client": "^2.2.15", "dotenv": "^16.0.3", "gatsby": "^5.11.0", "gatsby-plugin-dark-mode": "^1.1.2", diff --git a/src/components/Links/Links.tsx b/src/components/Links/Links.tsx index 99427fc5..ee662687 100644 --- a/src/components/Links/Links.tsx +++ b/src/components/Links/Links.tsx @@ -23,6 +23,9 @@ export const Destinations = [ { name: "travel", }, + { + name: "music", + }, { name: "about", }, @@ -36,25 +39,28 @@ const InnerLinks = (props: InnerLinksProps): ReactElement => { const { location } = props; const prefix = location === Locations.HOMEPAGE ? "homepage" : ""; - const EMOJIS = ["🤠", "🐢", "👾", "🤖", "⚡", "🦅", "🦕", "🐧"] + const EMOJIS = ["🤠", "🐢", "👾", "🤖", "⚡", "🦅", "🦕", "🐧"]; const emoji = EMOJIS[Math.floor(Math.random() * EMOJIS.length)]; return (
- Hey there! {`I'm`} Michael, a {universityYear} Honours Computer Science student from the University of British Columbia (UBC) in Vancouver, Canada. - I am originally from Edmonton, Alberta; I made the leap one province over to pursue my undergraduate studies in the fall of 2019. - Alongside my major, I am working towards a minor in Data Science and am a participant in the co-op program. I also am completing a study abroad at the National University of Singapore. + Hey there! {`I'm`} Michael, a {universityYear} Honours Computer + Science student from the{" "} + + University of British Columbia (UBC) + {" "} + in Vancouver, Canada. I am originally from Edmonton, Alberta; I + made the leap one province over to pursue my undergraduate + studies in the fall of 2019. Alongside my major, I am working + towards a{" "} + + minor in Data Science + {" "} + and am a participant in the{" "} + + co-op program + + . I also am completing a study abroad at the{" "} + + National University of Singapore + + .
- In the past, {`I've`} worked at General Genomics, Samsung Electronics in business-to-business (B2B) software, Amazon in {`"Supply Chain Optimization Technologies"`} or SCOT, Tesla in Supercharging, and as an Undergraduate Teaching Assistant (UTA). - To date, {`I've`} taught seven separate courses, including introductory programming in Python, introductory data science, computer systems, computer networking, and data structures and algorithms. + In the past, {`I've`} worked at{" "} + + General Genomics + + ,{" "} + + Samsung Electronics + {" "} + in business-to-business (B2B) software,{" "} + + Amazon + {" "} + in {`"Supply Chain Optimization Technologies"`} or SCOT,{" "} + + Tesla + {" "} + in Supercharging, and as an{" "} + + Undergraduate Teaching Assistant (UTA) + + . To date, {`I've`} taught seven separate courses, including + introductory programming in Python, introductory data science, + computer systems, computer networking, and data structures and + algorithms. +
++ This blog is my sandbox on the Internet. It has been a passion + project for a number of years. It showcases my writing, + projects, design, and travel expereinces. +
++ I hope you enjoy your stay. To wrap up, here are some photos I + particularly enjoy.
-This blog is my sandbox on the Internet. It has been a passion project for a number of years. It showcases my writing, projects, design, and travel expereinces.
-I hope you enjoy your stay. To wrap up, here are some photos I particularly enjoy.
> - ) -} + ); +}; interface AboutProps { location: string; } const About = ({ location }: AboutProps): ReactElement => { - // Fetch bio, photos - const data = useStaticQuery(graphql`query AboutQuery { - site { - siteMetadata { - title - } - } - leo1: file(relativePath: {eq: "images/leo1.png" }) { - childImageSharp { - gatsbyImageData( - width: 600 - layout: CONSTRAINED - ) - } - } - collision: file(relativePath: {eq: "images/collision.jpg" }) { - childImageSharp { - gatsbyImageData( - width: 600 - layout: CONSTRAINED - ) - } - } - amazon3: file(relativePath: {eq: "images/amazon3.jpg" }) { - childImageSharp { - gatsbyImageData( - width: 600 - layout: CONSTRAINED - ) - } - } -} -`); + const query = graphql` + query AboutQuery { + site { + siteMetadata { + title + } + } + leo1: file(relativePath: { eq: "images/leo1.png" }) { + childImageSharp { + gatsbyImageData(width: 600, layout: CONSTRAINED) + } + } + collision: file(relativePath: { eq: "images/collision.jpg" }) { + childImageSharp { + gatsbyImageData(width: 600, layout: CONSTRAINED) + } + } + amazon3: file(relativePath: { eq: "images/amazon3.jpg" }) { + childImageSharp { + gatsbyImageData(width: 600, layout: CONSTRAINED) + } + } + } + `; + const data = useStaticQuery(query); const { title } = data.site.siteMetadata; - const leoImage = getImage(data.leo1.childImageSharp) - const collisionImage = getImage(data.collision.childImageSharp) - const amazonImage = getImage(data.amazon3.childImageSharp) + const leoImage = getImage(data.leo1.childImageSharp); + const collisionImage = getImage(data.collision.childImageSharp); + const amazonImage = getImage(data.amazon3.childImageSharp); - if (leoImage === undefined || collisionImage === undefined || amazonImage === undefined) { - throw new Error("Could not find image for /about page!") + if ( + leoImage === undefined || + collisionImage === undefined || + amazonImage === undefined + ) { + throw new Error("Could not find image for /about page!"); } return ( @@ -94,11 +161,24 @@ const About = ({ location }: AboutProps): ReactElement => { justifyContent: "center", }} > -My pet tortoise Leo! (Jun 2020)
-Volunteering at Collision 2022. (June 2022)
-Interning in Toronto, Ontario for the summer. (July 2022)
+ View these reivews on my Notion site{" "} + + here + + ! +
+{album.Arist}
++ {formattedDate} +
+{album.Rating}
+{album.Review}
+ + Listen + +