-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #106 from wafflestudio/main
release: 결과 페이지
- Loading branch information
Showing
9 changed files
with
404 additions
and
11 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| import { QueryClient } from "@tanstack/react-query"; | ||
| import { getRecruitingResult } from "../../apis/recruiting"; | ||
| import { LoaderReturnType } from "../../types/commonTypes"; | ||
|
|
||
| export const recruitingResultQuery = (id: number) => ({ | ||
| queryKey: ["recruiting", "result", id], | ||
| queryFn: () => getRecruitingResult(id), | ||
| staleTime: Infinity, | ||
| }); | ||
|
|
||
| export const resultLoader = | ||
| (queryClient: QueryClient) => | ||
| async ({ params }: { params: Record<string, unknown> }) => { | ||
| const resultQuery = recruitingResultQuery(Number(params.recruit_id)); | ||
| const cachedResult = queryClient.getQueryData<{ status: number }>( | ||
| resultQuery.queryKey, | ||
| ); | ||
| return { | ||
| result: | ||
| cachedResult !== undefined | ||
| ? cachedResult | ||
| : await queryClient.fetchQuery(resultQuery), | ||
| }; | ||
| }; | ||
|
|
||
| export type ResultLoaderReturnType = LoaderReturnType<typeof resultLoader>; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,158 @@ | ||
| import { useLoaderData, useNavigate } from "react-router-dom"; | ||
| import styled from "styled-components"; | ||
| import Header from "../components/home/Header/Header"; | ||
| import { ResultLoaderReturnType } from "./Loader/ResultLoader"; | ||
| import { useEffect } from "react"; | ||
|
|
||
| export default function Result() { | ||
| const { result } = useLoaderData() as ResultLoaderReturnType; | ||
| if (result.status === 3) { | ||
| //불합격 시 | ||
| return ( | ||
| <> | ||
| <Header /> | ||
| <Main> | ||
| <Container> | ||
| <LogoWrapper> | ||
| <img src="/image/result/fail.svg"></img> | ||
| </LogoWrapper> | ||
| <Title>합격자 명단에 없습니다.</Title> | ||
| <Description> | ||
| 와플스튜디오 리크루팅에 참여해 주셔서 감사드립니다. | ||
| <br /> | ||
| 지원서를 검토한 결과, 아쉽게도 21.5기 루키 합격자 명단에 포함되지 | ||
| 않았음을 알려드립니다. | ||
| <br /> | ||
| 지원해 주신 노력에 진심으로 감사드리며, 미래에 더 나은 기회가 | ||
| 있기를 바라며 응원하겠습니다. 감사합니다. | ||
| </Description> | ||
| <Contact> | ||
| 기타 문의사항은{" "} | ||
| <a href="mailto:[email protected] "> | ||
| mailto:[email protected] | ||
| </a>{" "} | ||
| 이메일로 문의주세요. | ||
| </Contact>{" "} | ||
| </Container> | ||
| </Main> | ||
| </> | ||
| ); | ||
| } | ||
|
|
||
| if (result.status === 2) { | ||
| //합격 시 | ||
| return ( | ||
| <> | ||
| <Header /> | ||
| <Main> | ||
| <Container> | ||
| <LogoWrapper> | ||
| <img src="/image/result/pass.svg"></img> | ||
| </LogoWrapper> | ||
| <Title> | ||
| 와플스튜디오 <Emphasis>합격</Emphasis>을 축하드립니다! | ||
| </Title> | ||
| <Description> | ||
| 지원 시 적어주셨던 이메일로 슬랙 및 노션 초대 예정입니다. <br /> | ||
| 또한 8월 20일 (일요일) 오후 2시에 루키 오리엔테이션이 진행될 | ||
| 예정이니 참고 바랍니다. 오티 참석은 필수입니다. | ||
| </Description> | ||
| <Contact> | ||
| 기타 문의사항은{" "} | ||
| <a href="mailto:[email protected] "> | ||
| mailto:[email protected] | ||
| </a>{" "} | ||
| 이메일로 문의주세요. | ||
| </Contact> | ||
| </Container> | ||
| </Main> | ||
| </> | ||
| ); | ||
| } | ||
|
|
||
| //결과가 없을 시 | ||
| return ( | ||
| <> | ||
| <Header /> | ||
| <Main> | ||
| <Container> | ||
| <LogoWrapper> | ||
| <img src="/image/result/pass.svg"></img> | ||
| </LogoWrapper> | ||
| <Title>아직 합/불 결과가 나오지 않았습니다.</Title> | ||
| <Contact> | ||
| 기타 문의사항은{" "} | ||
| <a href="mailto:[email protected] "> | ||
| mailto:[email protected] | ||
| </a>{" "} | ||
| 이메일로 문의주세요. | ||
| </Contact> | ||
| </Container> | ||
| </Main> | ||
| </> | ||
| ); | ||
| } | ||
|
|
||
| export function NoResult() { | ||
| const navigate = useNavigate(); | ||
| useEffect(() => { | ||
| alert("지원하지 않은 리크루팅입니다."); | ||
| navigate("../"); | ||
| }, []); | ||
| return <div></div>; | ||
| } | ||
| const Main = styled.main` | ||
| width: 100%; | ||
| min-height: 100vh; | ||
| display: flex; | ||
| align-items: center; | ||
| justify-content: center; | ||
| `; | ||
|
|
||
| const Container = styled.div` | ||
| display: flex; | ||
| flex-direction: column; | ||
| align-items: center; | ||
| width: 1100px; | ||
| padding: 60px 0; | ||
| `; | ||
|
|
||
| const LogoWrapper = styled.div` | ||
| margin-bottom: 48px; | ||
| `; | ||
|
|
||
| const Title = styled.div` | ||
| color: #222; | ||
| font-size: 52px; | ||
| font-weight: 700; | ||
| margin-bottom: 36px; | ||
| `; | ||
| const Emphasis = styled.span` | ||
| color: #f0745f; | ||
| font-size: 64px; | ||
| font-weight: 700; | ||
| `; | ||
| const Description = styled.div` | ||
| color: #484848; | ||
| text-align: center; | ||
| font-size: 24px; | ||
| font-weight: 500; | ||
| line-height: 150%; | ||
| margin-bottom: 36px; | ||
| word-break: keep-all; | ||
| `; | ||
| const Contact = styled.div` | ||
| color: #484848; | ||
| font-family: Pretendard; | ||
| font-size: 16px; | ||
| font-weight: 400; | ||
| text-align: center; | ||
| a { | ||
| color: #484848; | ||
| font-family: Pretendard; | ||
| font-size: 16px; | ||
| font-weight: 500; | ||
| text-decoration-line: underline; | ||
| cursor: pointer; | ||
| } | ||
| `; |