From 9271d79e039a9dc3c02abb7f69ad7f36eb6aec8b Mon Sep 17 00:00:00 2001
From: Caleb Denio <cjdenio44@gmail.com>
Date: Tue, 3 May 2022 17:13:15 -0400
Subject: [PATCH] Next-ify some links (#442)

---
 components/slack.js  | 22 ++++++++++++----------
 pages/index.js       | 21 +++++++++++----------
 pages/philosophy.js  | 16 +++++++++-------
 pages/slack/index.js |  1 -
 4 files changed, 32 insertions(+), 28 deletions(-)

diff --git a/components/slack.js b/components/slack.js
index 7ee0b34d..6e1ebb12 100644
--- a/components/slack.js
+++ b/components/slack.js
@@ -3,6 +3,7 @@ import styled from '@emotion/styled'
 import usePrefersMotion from '../lib/use-prefers-motion'
 import useHasMounted from '../lib/use-has-mounted'
 import { formatted } from '../lib/members'
+import Link from 'next/link'
 
 let Highlight = styled(Text)`
   color: inherit;
@@ -45,16 +46,17 @@ const Content = () => (
       For leaders, you'll be able to connect with other leaders and support one
       another.
     </Text>
-    <Button
-      as="a"
-      href="https://hackclub.com/slack/"
-      variant="ctaLg"
-      sx={{
-        background: 'linear-gradient(-132deg, #338eda 14%, #33d6a6 82%)'
-      }}
-    >
-      Join our Slack →
-    </Button>
+    <Link href="/slack" passHref>
+      <Button
+        as="a"
+        variant="ctaLg"
+        sx={{
+          background: 'linear-gradient(-132deg, #338eda 14%, #33d6a6 82%)'
+        }}
+      >
+        Join our Slack →
+      </Button>
+    </Link>
   </Container>
 )
 
diff --git a/pages/index.js b/pages/index.js
index f342256a..cab0381d 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -430,16 +430,17 @@ const Page = () => (
           <Highlight>every&nbsp;Hack&nbsp;Club is student-led</Highlight> &
           members make self-directed projects.
         </Text>
-        <Button
-          as="a"
-          href="https://hackclub.com/philosophy/"
-          variant="ctaLg"
-          sx={{
-            background: 'linear-gradient(-32deg, #6f31b7 14%, #fb558e 82%)'
-          }}
-        >
-          Our philosophy →
-        </Button>
+        <NextLink href="/philosophy" passHref>
+          <Button
+            as="a"
+            variant="ctaLg"
+            sx={{
+              background: 'linear-gradient(-32deg, #6f31b7 14%, #fb558e 82%)'
+            }}
+          >
+            Our philosophy →
+          </Button>
+        </NextLink>
       </Container>
     </Box>
     <Box as="section" sx={{ py: [4, 5, 6], color: 'black' }}>
diff --git a/pages/philosophy.js b/pages/philosophy.js
index 4d781236..4b0e75a1 100644
--- a/pages/philosophy.js
+++ b/pages/philosophy.js
@@ -4,6 +4,7 @@ import { Box, Heading, Container, Text, Button, Link } from 'theme-ui'
 import Nav from '../components/nav'
 import styled from '@emotion/styled'
 import Footer from '../components/footer'
+import NextLink from "next/link"
 
 const Header = styled(Box)`
   color: white;
@@ -268,13 +269,14 @@ export default function Philosophy() {
           >
             Start a club
           </Button>
-          <Button
-            sx={{ bg: 'white', color: 'red' }}
-            as="a"
-            href="https://hackclub.com/slack"
-          >
-            Join our Slack
-          </Button>
+          <NextLink href="/slack" passHref>
+            <Button
+              sx={{ bg: 'white', color: 'red' }}
+              as="a"
+            >
+              Join our Slack
+            </Button>
+          </NextLink>
         </Box>
       </Box>
       <Footer light />
diff --git a/pages/slack/index.js b/pages/slack/index.js
index d7b2f3d7..50d72e6f 100644
--- a/pages/slack/index.js
+++ b/pages/slack/index.js
@@ -183,7 +183,6 @@ const SlackPage = () => {
           </Card>
           <Card
             bg="red"
-            as="a"
             sx={{
               gridColumn: ['span 2 !important', 'span 2 !important'],
               gridRow: ['span 1 !important', 'span 3 !important'],