Disable frontend access to applications that have not opened yet

frontend/pages/club/[club]/application/[application]/index.tsx

@@ -5,7 +5,8 @@ import { Container, Icon, Title } from 'components/common'
 import { Field, Form, Formik } from 'formik'
 import moment from 'moment'
 import { NextPageContext } from 'next'
-import React, { ReactElement, useState } from 'react'
+import { ReactElement, useState } from 'react'
+import TimeAgo from 'react-timeago'
 import renderPage from 'renderPage'
 import styled from 'styled-components'
 import {
@@ -111,6 +112,18 @@ const ApplicationPage = ({
   questions,
   initialValues,
 }: ApplicationPageProps): ReactElement => {
+  if (new Date() < new Date(application.application_start_time)) {
+    return (
+      <Container paddingTop>
+        <Title>Application Not Open</Title>
+        <p>
+          This application is not open yet. Please check back{' '}
+          <TimeAgo date={application.application_start_time} />.
+        </p>
+      </Container>
+    )
+  }
+
   const [errors, setErrors] = useState<string | null>(null)
   const [saved, setSaved] = useState<boolean>(false)
   const [currentCommittee, setCurrentCommittee] = useState<{

frontend/pages/club/[club]/apply.tsx

@@ -14,6 +14,7 @@ import {
 } from 'components/common'
 import { NextPageContext } from 'next'
 import Link from 'next/link'
+import { useRouter } from 'next/router'
 import { ReactElement, useState } from 'react'
 import TimeAgo from 'react-timeago'
 import renderPage from 'renderPage'
@@ -35,6 +36,7 @@ type Props = {
 }
 
 const ApplyPage = ({ club, applications }: Props): ReactElement => {
+  const router = useRouter()
   const [updatedIsRequest, setUpdatedIsRequest] = useState<boolean>(
     club.is_request,
   )
@@ -170,13 +172,15 @@ const ApplyPage = ({ club, applications }: Props): ReactElement => {
                   {new Date(app.result_release_time).toLocaleString()} (
                   <TimeAgo date={app.result_release_time} />)
                 </div>
-                <a
-                  href={app.external_url}
-                  rel="noopener noreferrer"
+                <button
+                  onClick={() => {
+                    router.push(app.external_url)
+                  }}
                   className="button is-success mt-3"
+                  disabled={new Date() < new Date(app.application_start_time)}
                 >
                   <Icon name="edit" /> Apply
-                </a>
+                </button>
               </div>
             ))}
             <Subtitle>Already a member?</Subtitle>