add /join redirect to get membership from EUSA shop

app/join/page.tsx

@@ -0,0 +1,35 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { redirect } from 'next/navigation'
+import { EUSA_MEMBERSHIP_URL } from '@/constants/socials'
+import Heading from '@/components/heading'
+
+export default function JoinPage() {
+  useEffect(() => {
+    redirect(EUSA_MEMBERSHIP_URL)
+  }, [])
+
+  // For the unlikely event that the redirect fails, show an error button
+  const [showErrorButton, setShowErrorButton] = useState(false)
+
+  useEffect(() => {
+    setTimeout(() => {
+      setShowErrorButton(true)
+    }, 750)
+  }, [])
+
+  return (
+    <div
+      className={`max-w-xl mx-auto mt-12 flex flex-col gap-6 ${showErrorButton ? 'opacity-100' : 'opacity-0'} transition-opacity duration-250`}
+    >
+      <Heading title="Become an official member" />
+      <p>If you did not get redirected, please click the button below.</p>
+      <a href={EUSA_MEMBERSHIP_URL}>
+        <button className="bg-csred text-white px-4 py-2 rounded-md">
+          Become a member ↗
+        </button>
+      </a>
+    </div>
+  )
+}

constants/socials.ts

@@ -2,3 +2,5 @@ export const DISCORD_INVITE_URL = 'https://discord.gg/fmp7p9Ca4y'
 export const INSTAGRAM_URL = 'https://www.instagram.com/comp_soc/'
 export const LINKEDIN_URL = 'https://uk.linkedin.com/company/compsoc'
 export const X_URL = 'https://mobile.x.com/CompSoc'
+export const EUSA_MEMBERSHIP_URL =
+  'https://www.eusa.ed.ac.uk/shop?activity_id=96'