첨삭 반영 페이지
사용하는 데이터 세 가지
복사본 예시 데이터
스냅샷 예시 데이터
코멘트 예시 데이터
복사본
스냅샷
- componentId: 수정 전 컴포넌트 아이디 (수정해도 안 바뀜, 안 씀)
코멘트
조건
코멘트는 해당 블럭에 코멘트가 있기만 하면 항상 보여준다
스냅샷은 복사본을 수정 또는 삭제한 경우에 보여준다복사본 삭제해버리면 reflectFeedback도 못 읽는데?- →
스냅샷의 componentId와 복사본의 componentId 비교
→ 값이 다르면 수정한 거고, 복사본에 해당 componentId가 없으면 삭제한 거임!
→ 둘 중 하나에 해당하면 스냅샷을 보여준다!
렌더링 구조
☝
복사본 데이터, 코멘트 데이터는 구조 변환 과정을 거친다!
id를 인덱스로 바로 타겟 블럭을 가져올 수 있도록 기존 배열에서 id를 키로 가진 객체로 변환시킴
전제: 복사본의 특정 블럭을 하더라도 해당 블럭에 코멘트 데이터가 존재한다면 코멘트와 스냅샷 데이터는 보여준다.
➡️ 스냅샷 데이터로 map을 돌려야 함.
- 복사본 카테고리 블럭 (~Details):
스냅샷 데이터의 originComponentId와 일치하는 복사본 블럭을 보여준다. - cf. 해당하는 복사본 블럭이 없는 경우 (= undefined, 삭제한 경우) 안 보여줌.
- 토글: 코멘트가 있는 경우에 보여준다.
- 코멘트 (FeedbackView):
복사본 데이터의 componentId와 일치하는 코멘트 데이터를 보여준다. - 1번에서 보여주는 복사본 블럭의 componentId를 알아야 하는데, 문제는 복사본 블럭을 삭제한 경우 componentId를 알 수 없음.
- 스냅샷 카테고리 블럭 (~Details): map 내에서 현재 순회하고 있는 데이터를 보여준다.
{
"careers": [
{
"type": "careers",
"type": "careers",
"componentId": 2203,
"originComponentId": 2073,
"reflectFeedback": false,
"createdDate": "2023-11-25T21:05:35.713568",
"companyName": "그렙 수정",
"position": "프론트",
"skills": [
""
],
"duties": [],
"careerStartDate": "2023-11-01",
"endDate": null,
"careerContent": "",
"currentlyEmployed": true
},
{
"type": "careers",
"type": "careers",
"componentId": 2181,
"originComponentId": 2152,
"reflectFeedback": false,
"createdDate": "2023-11-25T21:05:35.7136",
"companyName": "카카오",
"position": "프론트",
"skills": [
""
],
"duties": [],
"careerStartDate": "2023-11-16",
"endDate": null,
"careerContent": "",
"currentlyEmployed": true
}
]
}
{
"careers": [
{
"type": "careers",
"type": null,
"componentId": 2175,
"originComponentId": 2073,
"reflectFeedback": false,
"createdDate": "2023-11-25T21:05:35.713568",
"companyName": "그렙",
"position": "프론트",
"skills": [
"자바",
"자바스크립트"
],
"duties": [],
"careerStartDate": "2023-11-01",
"endDate": null,
"careerContent": "",
"currentlyEmployed": true
},
{
"type": "careers",
"type": null,
"componentId": 2181,
"originComponentId": 2152,
"reflectFeedback": false,
"createdDate": "2023-11-25T21:05:35.7136",
"companyName": "카카오",
"position": "프론트",
"skills": [
""
],
"duties": [],
"careerStartDate": "2023-11-16",
"endDate": null,
"careerContent": "",
"currentlyEmployed": true
}
],
"projects": [],
...
}
{
"commentResponses": [
{
"commentId": 452,
"content": "rff",
"componentId": 2203,
"lastModifiedAt": "2023-11-25T21:05:55.820769"
},
{
"commentId": 453,
"content": "aaaa~~",
"componentId": 2181,
"lastModifiedAt": "2023-11-25T21:06:02.168908"
},
{
"commentId": 454,
"content": "dd",
"componentId": 2193,
"lastModifiedAt": "2023-11-25T21:06:07.538874"
}
],
"overallReview": "good!",
"mentorId": 1
}
