@@ -119,15 +133,11 @@ const MyPage = () => {
스터디 모집공고
- {selectedCard === 'STUDY'
- ? temporarySavedCardMockData
- .filter((temporarySavedCard: TemporarySavedCardProps) => temporarySavedCard.card === 'STUDY')
- .map((studySavedCard: TemporarySavedCardProps) => )
- : temporarySavedCardMockData
- .filter((temporarySavedCard: TemporarySavedCardProps) => temporarySavedCard.card === 'RECRUITMENT')
- .map((recruitmentSavedCard: TemporarySavedCardProps) => (
-
- ))}
+
+ {getTempList(selectedCard)?.map((form: Partial & { savedKey: string }) => (
+
+ ))}
+
@@ -146,19 +156,22 @@ const MyPageWrapper = styled.div`
flex-direction: column;
max-width: 1224px;
margin: 40px auto 80px auto;
- gap: 32px;
+ gap: 40px;
.title {
display: flex;
align-items: center;
- gap: 12px;
+ gap: 8px;
align-self: stretch;
- color: ${({ theme }) => theme.color.black5};
- font-family: 'Pretendard800';
- font-size: ${({ theme }) => theme.font.xxlarge};
- font-style: normal;
- font-weight: 800;
- line-height: 48px;
+
+ span {
+ color: ${({ theme }) => theme.color.black5};
+ font-family: 'Pretendard700';
+ font-size: ${({ theme }) => theme.font.medium};
+ font-style: normal;
+ font-weight: 700;
+ line-height: 32px;
+ }
}
`;
@@ -174,6 +187,7 @@ const CardsWrapper = styled.div`
display: flex;
flex-direction: column;
align-items: flex-start;
+ min-height: 368px;
gap: 24px;
align-self: stretch;
`;
@@ -181,6 +195,26 @@ const CardsWrapper = styled.div`
const MyStudyTitleWrapper = styled.div`
display: flex;
align-items: center;
+ gap: 8px;
+ align-self: stretch;
+
+ span {
+ color: ${({ theme }) => theme.color.black5};
+ font-family: 'Pretendard700';
+ font-size: ${({ theme }) => theme.font.medium};
+ font-style: normal;
+ font-weight: 700;
+ line-height: 32px;
+ }
+`;
+
+const CardListWrapper = styled.div`
+ display: flex;
+ width: 100%;
+ flex-direction: column;
+ flex-wrap: wrap;
+ align-items: center;
+ align-content: center;
gap: 12px;
align-self: stretch;
`;
@@ -190,14 +224,15 @@ const ChipMenusWrapper = styled.div`
align-items: flex-start;
gap: 12px;
align-self: stretch;
+ overflow-x: hidden;
`;
const MypageButtonsWrapper = styled.div`
display: flex;
- justify-content: center;
+ padding-top: 24px;
+ flex-direction: column;
align-items: center;
- gap: 12px;
- align-self: stretch;
+ gap: 24px;
`;
export default MyPage;
diff --git a/src/Pages/Recruitments/index.tsx b/src/Pages/Recruitments/index.tsx
index ab9e2d9d..aee347f5 100644
--- a/src/Pages/Recruitments/index.tsx
+++ b/src/Pages/Recruitments/index.tsx
@@ -7,9 +7,7 @@ import { Create, Up } from '@/Assets';
import Button from '@/Components/Common/Button';
import UtiltiyButtons from '@/Components/UtilityButtons';
import { useLocation, useNavigate } from 'react-router-dom';
-import { useStack } from '@/Hooks/stack/useStack';
import { ALL, CATEGORIES, POSITIONS, PROGRESS_METHODS } from '@/Shared/study';
-import { Stack } from '@/Types/study';
import { useLoginStore } from '@/store/auth';
import { useModalStore } from '@/store/modal';
import { CREATE_STUDY } from '@/Constants/messages';
@@ -18,7 +16,6 @@ import { ROUTES } from '@/Constants/route';
import { useEffect } from 'react';
const RecruitmentsPage = () => {
- const { data, isLoading } = useStack();
const navigate = useNavigate();
const { isLoggedIn } = useLoginStore();
const { isModalOpen, openModal } = useModalStore();
@@ -32,10 +29,6 @@ const RecruitmentsPage = () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
};
- const stacks = data?.stacks?.map((stack: Stack) => {
- return { id: stack.id, name: stack.name };
- });
-
return (
diff --git a/src/Shared/study.ts b/src/Shared/study.ts
index e0707278..c432530b 100644
--- a/src/Shared/study.ts
+++ b/src/Shared/study.ts
@@ -1,4 +1,4 @@
-import { Position } from '@/Types/study';
+import { Position, Option } from '@/Types/study';
export const STUDY_STATUS = {
PROGRESS: '진행 중',
@@ -17,12 +17,12 @@ export const MEMBER_STATUS = {
PARTICIPATED: '참여 중',
};
-export const POSITION = {
- 1: '백엔드',
- 2: '프론트엔드',
- 3: '디자이너',
- 4: '데브옵스',
-};
+export const POSITION: Array> = [
+ { value: 1, label: '백엔드' },
+ { value: 2, label: '프론트엔드' },
+ { value: 3, label: '디자이너' },
+ { value: 4, label: '데브옵스' },
+];
export const PROGRESS_METHOD = {
ONLINE: '온라인',
diff --git a/src/Types/study.ts b/src/Types/study.ts
index 80c1d364..5176cb1b 100644
--- a/src/Types/study.ts
+++ b/src/Types/study.ts
@@ -1,4 +1,4 @@
-import { APPLY_STATUS, MEMBER_STATUS, PLATFORM, PROGRESS_METHOD, ROLE, STUDY_STATUS } from '@/Shared/study';
+import { APPLY_STATUS, POSITION, MEMBER_STATUS, PLATFORM, PROGRESS_METHOD, ROLE, STUDY_STATUS } from '@/Shared/study';
export type CategoryPropertyType = 'category' | 'stacks' | 'positions' | 'way' | 'sort';
export type StudyStatus = keyof typeof STUDY_STATUS;
@@ -7,6 +7,7 @@ export type ApplyStatus = keyof typeof APPLY_STATUS;
export type ProgressMethod = keyof typeof PROGRESS_METHOD;
export type Role = keyof typeof ROLE;
export type Platform = keyof typeof PLATFORM;
+export type PositionId = keyof typeof POSITION;
export type Card = 'STUDY' | 'RECRUITMENT';
export type Sort = '최신순' | '조회순';
export type ApplyTryStatus = 'NOT APPLY' | 'SUCCESS' | 'CLOSED' | 'ALREDAY_APPLY' | 'ALREDY_PARTICIPATED';
@@ -102,6 +103,18 @@ export interface Recruitments {
recruitments: Recruitment[];
}
+// TODO: recruitment 타입 중복 속성 개선, stackId 객체 만들기
+export interface RecruitmentForm {
+ title: string;
+ stackIds: number[];
+ positionIds: PositionId[];
+ applicantCount: number;
+ recruitmentEndDateTime: string;
+ contact: 'KAKAO' | 'EMAIL';
+ callUrl: string;
+ content: string;
+}
+
export interface FilterOptionParams {
pageParam?: number;
last?: number;
@@ -175,6 +188,11 @@ export interface ApplicantRecruitment {
applicantStatus: ApplyStatus;
}
+export interface Option {
+ value: T;
+ label: K;
+}
+
export interface CompletedStudy {
studyId: number;
title: string;
diff --git a/src/store/study.ts b/src/store/study.ts
index 5abc245c..57521f70 100644
--- a/src/store/study.ts
+++ b/src/store/study.ts
@@ -23,7 +23,19 @@ export interface SetSelectedCardAction {
setSelectedCard: (newSelectedCard: Card) => void;
}
+// 임시저장된 글 카드
export const useSelectedCardStore = create((set) => ({
selectedCard: 'STUDY',
setSelectedCard: (newSelectedCard: Card) => set({ selectedCard: newSelectedCard }),
}));
+
+export interface SavedKeyState {
+ savedKey: string;
+ setSavedKey: (newKey: string) => void;
+}
+
+// 선택된 카드 키
+export const useSavedKeyStore = create((set) => ({
+ savedKey: '',
+ setSavedKey: (newKey: string) => set(() => ({ savedKey: newKey })),
+}));
diff --git a/src/utils/axios.ts b/src/utils/axios.ts
index e344ce59..a5155a6e 100644
--- a/src/utils/axios.ts
+++ b/src/utils/axios.ts
@@ -1,5 +1,4 @@
import { logOut } from '@/Apis/auth';
-import { HttpStatus } from '@/Constants/StatusCodes';
import axios, { AxiosError, AxiosRequestConfig } from 'axios';
export const createClient = (config?: AxiosRequestConfig) => {
@@ -21,7 +20,7 @@ export const createClient = (config?: AxiosRequestConfig) => {
return response;
},
async (error: AxiosError) => {
- if (error.response?.status === HttpStatus.UNAUTHORIZED) {
+ if (error.response?.status === 401) {
try {
const data = await logOut(); // 로그아웃 통해 쿠키 제거
if (data) window.location.href = '/';