-
Notifications
You must be signed in to change notification settings - Fork 2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[FE] refactor: 리뷰 상세페이지에서 변경된 API를 연동 #297
Merged
soosoo22
merged 14 commits into
develop
from
fe/refactor/275-detailed-review-page-update-api
Aug 12, 2024
Merged
Changes from all commits
Commits
Show all changes
14 commits
Select commit
Hold shift + click to select a range
87c33a3
refactor: 새로운 API 구조에 맞춰 ReviewCard 컴포넌트 및 타입 수정
soosoo22 4a63c05
refactor: 새로운 API 구조에 맞춰 ReviewList Mock Data 수정
soosoo22 5cb988a
refactor: revieweeName 뒤에 붙는 메시지 상수 처리
soosoo22 e8eab70
design: ReviewListPage CSS 수정
soosoo22 c2fa27e
chore: ReviewList Mock Data 프로젝트명 변경
soosoo22 6a91804
refactor: 불필요한 코드 제거
soosoo22 f02f163
refactor: useGetReviewList의 데이터 변수명을 ReviewListData로 변경
soosoo22 e3d6de5
chore: useGetReviewList를 review 폴더로 이동
soosoo22 d862870
refactor: 상세페이지에서 변경된 API에 맞게 인터페이스 및 코드 변경
soosoo22 456582d
refactor: 변경된 API에 맞게 목 데이터 수정 및 createdAt 추가
soosoo22 007ddab
design: 상세페이지 전반적인 디자인 수정
soosoo22 cc15241
refactor: new Date() 추가
soosoo22 4cdf0c0
Merge remote-tracking branch 'origin/develop' into fe/refactor/275-de…
soosoo22 004aa27
Merge branch 'develop' into fe/refactor/275-detailed-review-page-upda…
soosoo22 File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
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 |
---|---|---|
|
@@ -5,26 +5,101 @@ export const DETAILED_PAGE_MOCK_API_SETTING_VALUES = { | |
memberId: 2, | ||
}; | ||
|
||
const ANSWER = | ||
'림순의 바람은 그윽한 산들바람처럼 잔잔하게 흘러갔습니다. \n 눈부신 햇살이 그의 어깨를 감싸며, 푸른 하늘 아래 펼쳐진 들판을 바라보았습니다.\n 그의 마음은 자연의 아름다움 속에서 평온을 찾았고, 그 순간마다 삶의 소중함을 느꼈습니다.\n 그는 늘 그러한 순간들을 기억하며, 미래의 나날들을 기대했습니다. \n 바람은 여전히 그를 감싸며, 그의 마음 속 깊은 곳에 있는 꿈과 희망을 불러일으켰습니다.\n 림순은 미소 지으며 앞으로 나아갔습니다.림순의 바람은 그윽한 산들바람처럼 잔잔하게 흘러갔습니다. \n 눈부신 햇살이 그의 어깨를 감싸며, 푸른 하늘 아래 펼쳐진 들판을 바라보았습니다.\n 그의 마음은 자연의 아름다움 속에서 평온을 찾았고, 그 순간마다 삶의 소중함을 느꼈습니다.\n 그는 늘 그러한 순간들을 기억하며, 미래의 나날들을 기대했습니다. 림순의 바람은 그윽한 산들바람처럼 잔잔하게 흘러갔습니다. \n 눈부신 햇살이 그의 어깨를 감싸며, 푸른 하늘 아래 펼쳐진 들판을 바라보았습니다.\n 그의 마음은 자연의 아름다움 속에서 평온을 찾았고, 그 순간마다 삶의 소중함을 느꼈습니다.\n 그는 늘 그러한 순간들을 기억하며, 미래의 나날들을 기대했습니다. \n 바람은 여전히 그를 감싸며, 그의 마음 속 깊은 곳에 있는 꿈과 희망을 불러일으켰습니다.\n 림순은 미소 지으며 앞으로 나아갔습니다.림순의 바람은 그윽한 산들바람처럼 잔잔하게 흘러갔습니다. \n 눈부신 햇살이 그의 어깨를 감싸며, 푸른 하늘 아래 펼쳐진 들판을 바라보았습니다.\n 그의 마음은 자연의 아름다움 속에서 평온을 찾았고, 그 순간마다 삶의 소중함을 느꼈습니다.\n 그는 늘 그러한 순간들을 기억하며, 미래의 나날들을 기대했습니다. '; | ||
const revieweeName = 'badahertz52'; | ||
|
||
export const DETAILED_REVIEW_MOCK_DATA: DetailReviewData = { | ||
id: 123456, | ||
createdAt: new Date('2024-07-16'), | ||
revieweeName: 'badahertz52', | ||
formId: 1, | ||
revieweeName: revieweeName, | ||
projectName: 'review-me', | ||
contents: [ | ||
createdAt: '2024-05-05', | ||
sections: [ | ||
{ | ||
id: 1, | ||
question: '[공개] 동료의 개발 역량 향상을 위해 피드백을 남겨 주세요.', | ||
answer: ANSWER, | ||
sectionId: 1, | ||
header: `💡 ${revieweeName}와 함께 한 기억을 떠올려볼게요.`, | ||
questions: [ | ||
{ | ||
questionId: 1, | ||
required: true, | ||
questionType: 'CHECKBOX', | ||
content: `프로젝트 기간 동안, ${revieweeName}의 강점이 드러났던 순간을 선택해주세요. (1~2개)`, | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 질문 내용 뒤에 |
||
optionGroup: { | ||
optionGroupId: 1, | ||
minCount: 1, | ||
maxCount: 2, | ||
options: [ | ||
{ optionId: 1, content: '🗣️ 커뮤니케이션, 협업 능력', isChecked: true }, | ||
{ optionId: 2, content: '💡 문제 해결 능력', isChecked: false }, | ||
], | ||
}, | ||
}, | ||
], | ||
}, | ||
{ | ||
sectionId: 2, | ||
header: '이제 선택한 순간을 바탕으로 리뷰를 작성해볼게요', | ||
questions: [ | ||
{ | ||
questionId: 2, | ||
required: true, | ||
questionType: 'CHECKBOX', | ||
content: `${revieweeName}에서 어떤 부분이 인상 깊었는지 선택해주세요. (1개 이상)`, | ||
optionGroup: { | ||
optionGroupId: 1, | ||
minCount: 1, | ||
maxCount: 3, | ||
options: [ | ||
{ | ||
optionId: 4, | ||
content: '반대 의견을 내더라도 듣는 사람이 기분 나쁘지 않게 이야기해요.', | ||
isChecked: true, | ||
}, | ||
{ optionId: 5, content: '팀원들의 의견을 잘 모아서 회의가 매끄럽게 진행되도록 해요.', isChecked: true }, | ||
], | ||
}, | ||
}, | ||
{ | ||
questionId: 3, | ||
required: true, | ||
questionType: 'TEXT', | ||
content: '위에서 선택한 사항에 대해 조금 더 자세히 설명해주세요.', | ||
optionGroup: null, | ||
hasGuideline: true, | ||
guideline: `상황을 자세하게 기록할수록 ${revieweeName}에게 도움이 돼요. OO 덕분에 팀이 원활한 소통을 이뤘거나, 함께 일하면서 배울 점이 있었는지 떠올려 보세요.`, | ||
answer: '쑤쑤 쑤퍼노바 인상깊어요', | ||
}, | ||
], | ||
}, | ||
{ | ||
sectionId: 3, | ||
header: '응원의 한마디를 남겨주세요', | ||
questions: [ | ||
{ | ||
questionId: 4, | ||
required: true, | ||
questionType: 'TEXT', | ||
content: `앞으로의 성장을 위해서 ${revieweeName}이 어떤 목표를 설정하면 좋을까요?`, | ||
optionGroup: null, | ||
hasGuideline: true, | ||
guideline: `어떤 점을 보완하면 좋을지와 함께 '이렇게 해보면 어떨까?'하는 간단한 솔루션을 제안해봐요.`, | ||
answer: '어디까지 성장할려구~?', | ||
}, | ||
], | ||
}, | ||
{ | ||
sectionId: 4, | ||
header: '응원의 한마디를 남겨주세요', | ||
questions: [ | ||
{ | ||
questionId: 5, | ||
required: false, | ||
questionType: 'TEXT', | ||
content: `${revieweeName}에게 전하고 싶은 다른 리뷰가 있거나 응원의 말이 있다면 적어주세요.`, | ||
optionGroup: null, | ||
hasGuideline: false, | ||
guideline: null, | ||
answer: '응원합니다 화이팅!!', | ||
}, | ||
], | ||
}, | ||
|
||
{ id: 2, question: '[공개] 동료의 소프트 스킬의 성장을 위해 피드백을 남겨 주세요.', answer: ANSWER }, | ||
{ id: 3, question: '[비공개] 팀 동료로 근무한다면 같이 일 하고 싶은 개발자인가요?', answer: ANSWER }, | ||
], | ||
keywords: [ | ||
{ id: 11, content: '친절해요' }, | ||
{ id: 22, content: '이야기를 잘 들어줘요.' }, | ||
], | ||
}; |
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 |
---|---|---|
|
@@ -7,6 +7,7 @@ import * as S from './styles'; | |
interface DetailedReviewPageContentsProps { | ||
groupAccessCode: string; | ||
} | ||
|
||
const DetailedReviewPageContents = ({ groupAccessCode }: DetailedReviewPageContentsProps) => { | ||
const { param: reviewId, queryString: memberId } = useSearchParamAndQuery({ | ||
paramKey: 'reviewId', | ||
|
@@ -30,10 +31,17 @@ const DetailedReviewPageContents = ({ groupAccessCode }: DetailedReviewPageConte | |
handleClickToggleButton={() => console.log('click toggle ')} | ||
/> | ||
{/* 시연 때 숨김 <RevieweeComments comment={detailedReview.reviewerGroup.description} /> */} | ||
{detailedReview.contents.map(({ id, question, answer }, index) => ( | ||
{/* {detailedReview.contents.map(({ id, question, answer }, index) => ( | ||
<ReviewSection key={id} question={question} answer={answer} index={index} /> | ||
))} | ||
<KeywordSection keywords={detailedReview.keywords} index={detailedReview.contents.length} /> | ||
))} */} | ||
Comment on lines
+34
to
+36
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 사용하지 않는 부분이라면 코드를 제거해도 좋겠네요. |
||
{detailedReview.sections.map((section) => | ||
section.questions.map((question, index) => ( | ||
<S.ReviewContentContainer key={index}> | ||
<ReviewSection question={question.content} answer={question.answer!} /> | ||
{question.questionType === 'CHECKBOX' && <KeywordSection options={question.optionGroup!.options} />} | ||
</S.ReviewContentContainer> | ||
)), | ||
)} | ||
</S.DetailedReviewPageContents> | ||
); | ||
}; | ||
|
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
15 changes: 6 additions & 9 deletions
15
frontend/src/pages/DetailedReviewPage/components/KeywordSection/index.tsx
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
9 changes: 2 additions & 7 deletions
9
frontend/src/pages/DetailedReviewPage/components/ReviewSectionHeader/index.tsx
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 |
---|---|---|
@@ -1,16 +1,11 @@ | ||
import * as S from './styles'; | ||
|
||
interface ReviewSectionHeaderProps { | ||
number: number; | ||
text: string; | ||
} | ||
|
||
const ReviewSectionHeader = ({ number, text }: ReviewSectionHeaderProps) => { | ||
return ( | ||
<S.ReviewSectionHeader> | ||
{number}. {text} | ||
</S.ReviewSectionHeader> | ||
); | ||
const ReviewSectionHeader = ({ text }: ReviewSectionHeaderProps) => { | ||
return <S.ReviewSectionHeader>{text}</S.ReviewSectionHeader>; | ||
}; | ||
|
||
export default ReviewSectionHeader; |
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
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
상수는 UPPER_CASE로 작성해주세요!