Conversation
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
|
수고 하셨습니다 ! 위클리 미션 하시느라 정말 수고 많으셨어요. |
kiJu2
approved these changes
May 1, 2024
| import { useAsync } from "sharing/util"; | ||
| import { axiosInstance } from "sharing/util"; | ||
|
|
||
| export const useGetFolder = () => { |
| @@ -0,0 +1,14 @@ | |||
| import { mapLinksData } from "link/util-map"; | |||
|
|
|||
| export const mapFolderData = (folder) => { | |||
|
|
||
| export const useGetFolder = () => { | ||
| const getFolder = () => axiosInstance.get("sample/folder"); | ||
| const { loading, error, data } = useAsync(getFolder); |
There was a problem hiding this comment.
loading, error, data 등 비동기에 필요한 상태관리가 컴팩트하게 잘 이루어져있군요 ! 👍
| const { loading, error, data } = useAsync(getFolders); | ||
|
|
||
| const folders = data?.data ?? []; | ||
| const sortedFolders = folders.sort((a, b) => a?.id - b?.id); |
There was a problem hiding this comment.
정렬은 함수로 따로 구분할 수 있을 것 같아요.
useGetFolders의 책임이 두 가지 이상이 되는 것 같아서요 ! 물론, 모두 다 코드를 분리하게되면 생산성이 좋지 못하기에 참고 정도로만 봐주시면 될 것 같습니다 😊
|
|
||
| const cx = classNames.bind(styles); | ||
|
|
||
| export const AddFolderButton = ({ onClick }) => { |
There was a problem hiding this comment.
해당 컴포넌트는 IconButton과 같이 확장성 있는 컴포넌트로 만들어볼 수 있을 것 같아요:
Suggested change
| export const AddFolderButton = ({ onClick }) => { | |
| export const IconButton = ({ onClick, icon }) => { |
| import { CardContent } from "sharing/ui-card-content"; | ||
| import { CardImage } from "sharing/ui-card-image"; | ||
|
|
||
| export const ReadOnlyCard = ({ url, imageSource, alt, elapsedTime, description, createdAt }) => { |
There was a problem hiding this comment.
훌륭합니다 !
ui 계층을 분리하여 Card를 사용하고 합성하여 새로운 ReadOnlyCard를 만드셨군요 ! 👍👍
| return ( | ||
| <div className={cx("container")}> | ||
| <input className={cx("input")} type="search" placeholder="링크를 검색해 보세요." /> | ||
| <img src={SEARCH_IMAGE} alt="검색창인 것을 알려주는 돋보기 아이콘" className={cx("icon")} /> |
| const { data: folders } = useGetFolders(); | ||
| const [selectedFolderId, setSelectedFolderId] = useState(ALL_LINKS_ID); | ||
| const { data: links, loading } = useGetLinks(selectedFolderId); | ||
| const cardList = useMemo(() => { |
| return ( | ||
| <CardList> | ||
| {links.map((link) => ( | ||
| <EditableCard key={link?.id} {...link} /> |
| <span className={cx("copyright")}>{TEXT.codeit}</span> | ||
| <div className={cx("links")}> | ||
| <a className={cx("link")} href={ROUTE.개인정보처리방침}> | ||
| {TEXT.privacyPolicy} |
There was a problem hiding this comment.
혹시 TEXT라는 상수를 따로 정의한 이유가 있으실까요?
상수로 파일을 분리하면서 이득을 얻을 수 있는게 무엇이 있을지 궁금합니다 !
|
수고 많으셨습니다 찬욱님 ! ㅎㅎㅎ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
요구사항
기본
심화
주요 변경사항
스크린샷
멘토에게