feat: 4기 모집 준비 반영

apps/web/src/app/error.tsx

@@ -16,7 +16,7 @@ export default function Error({ error, reset }: { error: Error; reset: () => voi
  () => reset()
  }
  >
- Try again
+ 재시도
  </button>
  </div>
  );

apps/web/src/components/common/RecruitButton.tsx → apps/web/src/components/common/AboutRecruit/RecruitButton.tsx

@@ -1,11 +1,10 @@
 'use client';
 
 import dayjs from 'dayjs';
-import Link from 'next/link';
 import React, { useEffect, useState } from 'react';
 
 export default function RecruitButton() {
- const [timeLeft, setTimeLeft] = useState<string>('');
+ const [_timeLeft, setTimeLeft] = useState<string>('');
 
  useEffect(() => {
  const deadline = dayjs('2023-08-07T14:59:00.000Z');
@@ -44,12 +43,27 @@ export default function RecruitButton() {
  }, []);
 
  return (
- <Link
- href='/recruit/'
+ <button
+ onClick={() => {
+ alert('모집이 시작되면 다시 찾아와 주세요!');
+ }}
  className='bg-dark1 mb-[3rem] mt-[4rem] rounded-[1.2rem] border border-solid border-[#808388] px-[4rem] py-[1.6rem]'
  >
- <p className='md:text-24-semibold text-18-semibold'>3기 합류하기 (~8/7)</p>
- <p className='text-16-regular mt-[1.2rem] text-center'>{timeLeft}</p>
- </Link>
+ <p className='md:text-24-semibold text-18-semibold text-center'>
+ 곧 4기 모집이 시작됩니다.
+ <br />
+ (1월 29일 월 ~ )
+ </p>
+ </button>
  );
+
+ // return (
+ // <Link
+ // href='/recruit/'
+ // className='bg-dark1 mb-[3rem] mt-[4rem] rounded-[1.2rem] border border-solid border-[#808388] px-[4rem] py-[1.6rem]'
+ // >
+ // <p className='md:text-24-semibold text-18-semibold'>4기 합류하기 (~2/7)</p>
+ // {/* <p className='text-16-regular mt-[1.2rem] text-center'>{timeLeft}</p> */}
+ // </Link>
+ // );
 }

apps/web/src/components/common/AboutRecruit/index.tsx

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+
+import RecruitButton from './RecruitButton';
+
+interface AboutRecruitProps {}
+
+// 모집 상태가 바뀌면 여기의 버튼을 상황에 맞게 <RecruitButton /> 과 <NoticeButton /> 으로 바꿔주면 됩니다.
+
+const AboutRecruit: FC<AboutRecruitProps> = ({}) => {
+ return <RecruitButton />;
+};
+
+export default AboutRecruit;

apps/web/src/components/common/SimpleMenu.tsx

@@ -0,0 +1,33 @@
+'use client';
+
+import { FC, useEffect, useState } from 'react';
+
+import AboutRecruit from './AboutRecruit';
+
+interface SimpleMenuProps {}
+
+const SimpleMenu: FC<SimpleMenuProps> = ({}) => {
+ const [isShowMenu, setIsShowMenu] = useState(false);
+
+ useEffect(() => {
+ const pid = setTimeout(() => {
+ setIsShowMenu(true);
+ }, 5000);
+
+ return () => {
+ clearTimeout(pid);
+ };
+ }, []);
+
+ if (!isShowMenu) {
+ return null;
+ }
+
+ return (
+ <div>
+ <AboutRecruit />
+ </div>
+ );
+};
+
+export default SimpleMenu;

apps/web/src/components/mainpage/floating/Footer.tsx

@@ -1,16 +1,13 @@
-import Link from 'next/link';
-
-import { RightArrowIcon } from '../../common/RightArrowIcon';
-
 export default function Footer() {
- return (
- <Link href='https://docs.google.com/forms/d/e/1FAIpQLScQQoHcjvOBnPAsNU_PJ27pO5ymNjoYfFIXt2n46KxjuPCSbg/viewform'>
- <button className='text-24-semibold fixed bottom-[6rem] right-[6rem] z-20'>
- <div className='flex flex-row items-center justify-center gap-[0.8rem]'>
- 4기 모집 알림 신청
- <RightArrowIcon />
- </div>
- </button>
- </Link>
- );
+ return null;
+ // return (
+ // <Link href='https://docs.google.com/forms/d/e/1FAIpQLScQQoHcjvOBnPAsNU_PJ27pO5ymNjoYfFIXt2n46KxjuPCSbg/viewform'>
+ // <button className='text-24-semibold fixed bottom-[6rem] right-[6rem] z-20'>
+ // <div className='flex flex-row items-center justify-center gap-[0.8rem]'>
+ // 4기 모집 알림 신청
+ // <RightArrowIcon />
+ // </div>
+ // </button>
+ // </Link>
+ // );
 }

apps/web/src/components/mainpage/greeting/Intro.tsx

@@ -4,8 +4,7 @@ import clsx from 'clsx';
 import { m, useScroll, useTransform } from 'framer-motion';
 import { SVGProps, useRef } from 'react';
 
-import NoticeButton from '@/components/common/NoticeButton';
-// import RecruitButton from '@/components/common/RecruitButton';
+import AboutRecruit from '@/components/common/AboutRecruit';
 
 interface GreetingProps {
  className?: string;
@@ -32,8 +31,7 @@ export default function Intro({ className }: GreetingProps) {
  SOPT에 없던 새로운 가치를 <br />
  프로덕트를 통해 만들어 갑니다.
  </h1>
- {/* <RecruitButton /> */}
- <NoticeButton />
+ <AboutRecruit />
  <ArrowIcon />
  </m.div>
  </article>

apps/web/src/components/mainpage/recruit/RecruitSection.tsx

@@ -3,9 +3,7 @@
 import { m, useInView } from 'framer-motion';
 import { useRef } from 'react';
 
-import NoticeButton from '@/components/common/NoticeButton';
-
-// import RecruitButton from '../../common/RecruitButton';
+import AboutRecruit from '@/components/common/AboutRecruit';
 
 export default function RecruitSection() {
  const ref = useRef(null);
@@ -31,8 +29,7 @@ export default function RecruitSection() {
  <br />
  메이커스에 합류하세요
  </h1>
- {/* <RecruitButton /> */}
- <NoticeButton />
+ <AboutRecruit />
  </div>
  </div>
  </m.article>