[FEATURE] 글플래너 페이지 폴더 UI

[hoyyChoi]

이슈내용

• 글플래너 페이지 폴더 UI 작업하기

작업내용

• 글 플래너 폴더 이미지 가져오기
• 글플래너 새로운 ui 레이아웃 작업
• 클릭시, 컴포넌트 전환
• 기존 컴포넌트가 나오게 됨. ( 임시저장 버튼 토글 삭제, -> 종료 챌린지로 변경)
• 뒤로가기 프로세스 생각하기
• 종료 챌린지 서버랑 통신하기

참고사항

라이톤 폴더형 구조에 대해서 어떻게 진행하지?
-> 일단 현재
카테고리, 챌린지명, 타이틀, 내가 작성한 글 , 퍼센티지를 바탕으로 리스트를 뿌려줌. -> 이건 나중에 컴포넌트화 작업해도 되지않을까?

-> 수정 사항
처음 들어갔을때, 진행챌린지 폴더 ui가 제공된다.
컴포넌트화를 먼저하자!
1. 일단 현재있는 리스트를 꾸미고 있는 태그들의 위치를 삭제하고, 그 위치에 폴더형 구조로 map을 뿌린다.
2. 폴더형 구조를 뿌릴때에는 카테고리명과 템플릿명,종료시간날짜와 시작날짜를 뺀 숫자값을 함께 보낸다. 여기서 중요포인드 -> 각각 배열 안에 들어있는 challenges로만 폴더형 구조를 만든다.
3. 클릭시, 파라미터 값으로 카테고리명을 보낸다
온클릭 함수 안에 상태값으로 받았던 카테고리명과 클릭했을때,. 카테고리 명이 같을때, 거기 안에 있는 usertempelte을 props로 보낸다. 여기서 props로 보낼 때는 위에서 말한 폴더 ui를 컴포넌트화 한 파일에 props로 보낸다.
그 후 함수를 빠져나오기전에, 상태값 하나를 false에서 true로 바꾸고, 폴더 ui가 아닌 list 컴포넌트를 보여준다.
4. 뒤로 가기 버튼을 통해 상태값을 다시 false로 바꿔주면 된다.