content(resources): add link to GitHub

src/components/ResourcesLink/index.tsx

@@ -7,5 +7,15 @@ export function ResourcesLink({
 }: PropsWithChildren<{
   to: string
 }>) {
-  return <SC.ResourcesLinkWrapper to={to}>{children}</SC.ResourcesLinkWrapper>
+  if (!to.match(/^(https?:\/\/)/)) {
+    return (
+      <SC.ResourcesLinkInternal to={to}>{children}</SC.ResourcesLinkInternal>
+    )
+  }
+
+  return (
+    <SC.ResourcesLinkExternal href={to} target="_blank">
+      {children}
+    </SC.ResourcesLinkExternal>
+  )
 }

src/components/ResourcesLink/styles.tsx

@@ -1,7 +1,7 @@
 import { Link } from "gatsby"
-import styled from "styled-components"
+import styled, { css } from "styled-components"
 
-export const ResourcesLinkWrapper = styled(Link)`
+const linkStyle = css`
   color: #0090d8;
   font-weight: 700;
   border-bottom: 2px solid;
@@ -14,3 +14,11 @@ export const ResourcesLinkWrapper = styled(Link)`
     transition: none;
   }
 `
+
+export const ResourcesLinkInternal = styled(Link)`
+  ${linkStyle}
+`
+
+export const ResourcesLinkExternal = styled.a`
+  ${linkStyle}
+`

src/pages/resources.tsx

@@ -1,5 +1,6 @@
 import React, { Fragment } from "react"
 
+import packageJson from "../../package.json"
 import { ResourcesLink } from "../components/ResourcesLink"
 import { ResourcesList } from "../components/ResourcesList"
 import { SEO } from "../components/SEO"
@@ -14,6 +15,10 @@ function ResourcesPage() {
         on our Discord community,{" "}
         <ResourcesLink to="/about">The Programmer's Hangout</ResourcesLink>.
       </p>
+      <p>
+        All of it is open source, and you can contribute to it on{" "}
+        <ResourcesLink to={packageJson.repository.url}>GitHub</ResourcesLink>.
+      </p>
       <ResourcesList />
     </Fragment>
   )