Merge pull request #142 from mash-up-kr/release/v0.3.0

Main Release/v0.3.0
mash-up-kr · Mar 18, 2022 · d48b69a · d48b69a
2 parents 94bd096 + c15f4f7
commit d48b69a
Show file tree

Hide file tree

Showing 36 changed files with 762 additions and 135 deletions.
diff --git a/public/assets/favicon.svg b/public/assets/favicon.svg
diff --git a/public/assets/og-image.png b/public/assets/og-image.png
diff --git a/public/index.html b/public/index.html
@@ -5,7 +5,11 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>mashup-admin</title>
+    <title>Mash-Up Adminsoo | IT 연합 동아리</title>
+    <meta
+      property="description"
+      content="매쉬업은 개발, 디자인에 관심과 열정이 있는 사람들이 모인 단체로 Product Design, Android, iOS, Backend(노드,스프링), Web 총 6개의 팀으로 구성되어 있습니다. 매쉬업에서는 전체모임의 세미나 및 네트워킹을 진행하고 있으며, 이를 통하여 개인의 전문역량과 협업능력을 증대시키고자 합니다."
+    />
     <link
       href="/fonts/SpoqaHanSansNeo-Regular.woff2"
       rel="preload"
@@ -27,6 +31,15 @@
       type="font/woff2"
       crossOrigin="anonymous"
     />
+    <meta property="og:url" content="https://adminsoo.mash-up.kr/" />
+    <meta property="og:type" content="website" />
+    <meta property="og:title" content="Mash-Up Adminsoo | IT 연합 동아리" />
+    <meta
+      property="og:description"
+      content="매쉬업은 개발, 디자인에 관심과 열정이 있는 사람들이 모인 단체로 Product Design, Android, iOS, Backend(노드,스프링), Web 총 6개의 팀으로 구성되어 있습니다. 매쉬업에서는 전체모임의 세미나 및 네트워킹을 진행하고 있으며, 이를 통하여 개인의 전문역량과 협업능력을 증대시키고자 합니다."
+    />
+    <meta property="og:image" content="/assets/og-image.png" />
+    <link rel="icon" href="/assets/favicon.svg" />
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/App.tsx b/src/App.tsx
@@ -12,6 +12,7 @@ import { ACCESS_TOKEN, PATH } from './constants';
 
 import {
   LoginPage,
+  ApplicationList,
   ApplicationFormList,
   CreateApplicationForm,
   UpdateApplicationForm,
@@ -63,6 +64,14 @@ const App = () => {
         <ModalViewer />
         <Routes>
           <Route path="/" element={<Layout />}>
+            <Route
+              path={PATH.APPLICATION}
+              element={
+                <RequiredAuth isAuth={isAuthorized}>
+                  <ApplicationList />
+                </RequiredAuth>
+              }
+            />
             <Route
               path={PATH.APPLICATION_FORM}
               element={
@@ -103,21 +112,14 @@ const App = () => {
                 </RequiredAuth>
               }
             />
-            {/* // TODO:(용재) 추후 PATH.APPLICATION로 변경 */}
-            <Route
-              path="/"
-              element={<Navigate to={TOKEN ? PATH.APPLICATION_FORM : PATH.LOGIN} />}
-            />
+            <Route path="/" element={<Navigate to={TOKEN ? PATH.APPLICATION : PATH.LOGIN} />} />
             {/* // TODO:(용재) 추후 404로 변경 */}
-            <Route
-              path="*"
-              element={<Navigate to={TOKEN ? PATH.APPLICATION_FORM : PATH.LOGIN} />}
-            />
+            <Route path="*" element={<Navigate to={TOKEN ? PATH.APPLICATION : PATH.LOGIN} />} />
           </Route>
           <Route
             path={PATH.LOGIN}
             element={
-              <RequiredAuth isAuth={!isAuthorized} to={PATH.APPLICATION_FORM}>
+              <RequiredAuth isAuth={!isAuthorized} to={PATH.APPLICATION}>
                 <LoginPage />
               </RequiredAuth>
             }

diff --git a/src/api/application.ts b/src/api/application.ts
@@ -6,6 +6,8 @@ import {
   BaseResponse,
   ApplicationUpdateResultByIdRequest,
   ApplicationUpdateMultipleResultRequest,
+  ApplicationRequest,
+  ApplicationResponse,
 } from '@/types';
 
 export const getApplicationById = ({
@@ -15,6 +17,14 @@ export const getApplicationById = ({
     url: `/applications/${applicationId}`,
   });
 
+export const getApplications = (
+  params: ApplicationRequest,
+): Promise<BaseResponse<ApplicationResponse[]>> =>
+  http.get({
+    url: '/applications',
+    params,
+  });
+
 export const postUpdateResult = ({
   applicationId,
   applicationResultStatus,

diff --git a/src/components/ApplicationDetail/ApplicationPanel/ApplicationPanel.component.tsx b/src/components/ApplicationDetail/ApplicationPanel/ApplicationPanel.component.tsx
@@ -181,14 +181,14 @@ const ControlArea = ({ confirmationStatus, resultStatus, interviewDate }: Contro
           {formatDate(date.format(), 'YYYY년 M월 D일(ddd) a hh시 mm분')}
         </TitleWithContent>
       )}
-      <Styled.ButtonContainer>
+      {/* <Styled.ButtonContainer>
         <Button
           $size={ButtonSize.sm}
           shape={ButtonShape.primaryLine}
           label="수정"
           onClick={handleToggleIsEdit}
         />
-      </Styled.ButtonContainer>
+      </Styled.ButtonContainer> */}
     </>
   );
 };

diff --git a/src/components/ApplicationDetail/ApplicationPanel/ApplicationPanel.stories.tsx b/src/components/ApplicationDetail/ApplicationPanel/ApplicationPanel.stories.tsx
@@ -14,7 +14,7 @@ const Template: ComponentStory<typeof ApplicationPanel> = (args: ApplicationPane
 export const applicationPanelTBD = Template.bind({});
 
 applicationPanelTBD.args = {
-  confirmationStatus: 'TBD',
+  confirmationStatus: 'TO_BE_DETERMINED',
   resultStatus: 'NOT_RATED',
   interviewDate: '2022-02-22T08:10:11+09:00',
 };

diff --git a/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.component.tsx b/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.component.tsx
@@ -1,15 +1,25 @@
 import React from 'react';
 import * as Styled from './ApplicationQnAItem.styled';
-import { Question } from '@/types';
+import { Question, Answer } from '@/types';
 
-const ApplicationQnAItem = ({ content, description, maxContentLength }: Question) => {
+export interface ApplicationQnAItemProps extends Question {
+  answer: Answer;
+}
+
+const ApplicationQnAItem = ({
+  content,
+  description,
+  maxContentLength,
+  answer,
+}: ApplicationQnAItemProps) => {
   return (
     <Styled.ApplicationQnAItemContainer>
       <Styled.Title>{content}</Styled.Title>
-      <Styled.Description>{description}</Styled.Description>
+      {description && <Styled.Description>{description}</Styled.Description>}
+      {answer.content && <Styled.Answer>{answer.content}</Styled.Answer>}
       {maxContentLength && (
         <Styled.TextLength>
-          총 <strong>{description?.length}</strong>
+          총 <strong>{answer.content.length}</strong>
           자/{maxContentLength}자
         </Styled.TextLength>
       )}

diff --git a/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.stories.tsx b/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.stories.tsx
@@ -1,14 +1,13 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
-import ApplicationQnAItem from './ApplicationQnAItem.component';
-import { Question } from '@/types';
+import ApplicationQnAItem, { ApplicationQnAItemProps } from './ApplicationQnAItem.component';
 
 export default {
   title: 'ApplicationDetail/Application Qn A Item',
   component: ApplicationQnAItem,
 } as ComponentMeta<typeof ApplicationQnAItem>;
 
-const Template: ComponentStory<typeof ApplicationQnAItem> = (args: Question) => (
+const Template: ComponentStory<typeof ApplicationQnAItem> = (args: ApplicationQnAItemProps) => (
   <ApplicationQnAItem {...args} />
 );
 
@@ -18,6 +17,11 @@ applicationQnAItem.args = {
   content: 'TEST',
   description: 'test',
   maxContentLength: 300,
-  questionId: '0',
+  questionId: 0,
   required: false,
+  answer: {
+    answerId: 0,
+    content: 'ㅎㅇㅎㅇㅎㅇㅎ',
+    questionId: 0,
+  },
 };
diff --git a/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.styled.ts b/src/components/ApplicationDetail/ApplicationQnAItem/ApplicationQnAItem.styled.ts
@@ -17,15 +17,23 @@ export const Title = styled.div`
 `;
 
 export const Description = styled.div`
+  ${({ theme }) => css`
+    ${theme.fonts.regular13};
+    color: ${theme.colors.gray60};
+  `}
+`;
+
+export const Answer = styled.div`
   ${({ theme }) => css`
     ${theme.fonts.regular15};
+    margin-top: 1.2rem;
     color: ${theme.colors.gray70};
   `}
 `;
 
 export const TextLength = styled.div`
   ${({ theme }) => css`
-    ${theme.fonts.regular15};
+    ${theme.fonts.regular14};
     width: 100%;
     margin-top: 1.2rem;
     padding-top: 1.2rem;

diff --git a/src/components/ApplicationDetail/MessageListPanel/MessageListPanel.component.tsx b/src/components/ApplicationDetail/MessageListPanel/MessageListPanel.component.tsx
@@ -80,11 +80,13 @@ const MessageListPanel = ({ smsRequests, id }: MessageListPanelProps) => {
           SMS 발송
         </Button>
       </Styled.MessageListPanelTitle>
-      <Styled.MessageListPanelContent>
-        {smsRequests?.map((each: MessageInfoProps) => (
-          <MessageInfo key={each.smsRequestId} {...each} />
-        ))}
-      </Styled.MessageListPanelContent>
+      {smsRequests.length > 0 && (
+        <Styled.MessageListPanelContent>
+          {smsRequests.map((each: MessageInfoProps) => (
+            <MessageInfo key={each.smsRequestId} {...each} />
+          ))}
+        </Styled.MessageListPanelContent>
+      )}
     </Styled.MessageListPanelContainer>
   );
 };

diff --git a/src/components/ApplicationDetail/TitleWithContent/TitleWithContent.styled.ts b/src/components/ApplicationDetail/TitleWithContent/TitleWithContent.styled.ts
@@ -31,10 +31,12 @@ interface StyledContentProps {
 
 export const Content = styled.span<StyledContentProps>`
   ${({ theme, isLineThrough }) => css`
+    ${theme.fonts.regular16}
+
     width: 100%;
     margin-top: 0.4rem;
     color: ${theme.colors.gray80};
-    font-size: 1.6rem;
+    font-weight: 500;
     line-height: 2.4rem;
 
     ${isLineThrough

diff --git a/src/components/common/ApplicationStatusBadge/ApplicationStatusBadge.component.tsx b/src/components/common/ApplicationStatusBadge/ApplicationStatusBadge.component.tsx
@@ -3,20 +3,19 @@ import { KeyOf, ValueOf } from '@/types';
 import * as Styled from './ApplicationStatusBadge.styled';
 
 export const ApplicationConfirmationStatus = {
-  TBD: '미검토',
+  TO_BE_DETERMINED: '미검토',
   NOT_APPLICABLE: '대상 없음',
   INTERVIEW_CONFIRM_WAITING: '면접 확인 대기',
   INTERVIEW_CONFIRM_ACCEPTED: '면접 수락',
   INTERVIEW_CONFIRM_REJECTED: '면접 거절',
   FINAL_CONFIRM_WAITING: '최종 확인 대기',
   FINAL_CONFIRM_ACCEPTED: '최종 합격',
   FINAL_CONFIRM_REJECTED: '최종 거절',
-  TO_BE_DETERMINED: '미정',
 } as const;
 
 export const ApplicationResultStatus = {
   NOT_RATED: '미검토',
-  SCREENING_TBD: '서류 보류',
+  SCREENING_TO_BE_DETERMINED: '서류 보류',
   SCREENING_FAILED: '서류 불합격',
   SCREENING_PASSED: '서류 합격',
   INTERVIEW_FAILED: '최종 불합격',

diff --git a/src/components/common/ApplicationStatusBadge/ApplicationStatusBadge.stories.tsx b/src/components/common/ApplicationStatusBadge/ApplicationStatusBadge.stories.tsx
@@ -23,7 +23,7 @@ NOT_RATED.args = {
 
 export const SCREENING_TBD = Template.bind({});
 SCREENING_TBD.args = {
-  text: ApplicationResultStatus.SCREENING_TBD,
+  text: ApplicationResultStatus.SCREENING_TO_BE_DETERMINED,
 };
 
 export const SCREENING_FAILED = Template.bind({});