카테고리 조회 API 적용 및 Graphic 컴포넌트 개발

[hyesungoh]

🤔 해결하려는 문제가 무엇인가요?

• closes #134

• 그래픽의 ENUM 타입을 기준으로 그래픽 컴포넌트를 반환해야 함

🎉 어떻게 해결했나요?

• useGetCategories라는 이름의 custom hook을 개발했어요

  • hooks/api/category 이렇게 분류를 해볼까 하는데 어떻게 생각하시나요?

  • 사용하는 곳인 CategorySection에서는 전역 상태인 currentCategory에 대한 로직과 함께 하단에 커스텀 훅을 배치해 추상화(?)해 사용했어요

• String Graphic Type에 따라 그래픽 아이콘을 반환하는 Graphic이라는 컴포넌트를 만들었어요

  • 작업한 것처럼 type에 따라 switch case 밖에 생각이 안낫는데.. 최선일지는 잘 모르겠어요. 비슷한 경험이 있다면 공유 부탁드려요!
  • 또 문제점이라고 생각되는 것이.. 이 컴포넌트를 사용할 때는 모든 그래픽 컴포넌트가 import가 되는 점이에요 ...

📚 Attachment (Option)

[github-actions[bot]]

Bundle Sizes

Compared against d60aec3b9c500433b7ab7d9e618e3cde75ad6f5a

Route	Size (gzipped)	Diff
/	94.98 KB	+4.3 KB

Dynamic import	Size (gzipped)	Diff
../components/route-home/category/CategorySection.tsx -> ./CategorySettingBottomSheet	4.16 KB	-4.45 KB

[cloudflare-pages[bot]]

Deploying with    Cloudflare Pages

Latest commit:	aef95a5
Status:	✅  Deploy successful!
Preview URL:	https://62495cda.12-team3-web.pages.dev
Branch Preview URL:	https://issue-134.12-team3-web.pages.dev

View logs

[codecov-commenter]

Codecov Report

Base: 100.00% // Head: 100.00% // No change to project coverage :thumbsup:

Coverage data is based on head (b2f132a) compared to base (0b05a62). Patch has no changes to coverable lines.

:exclamation: Current head b2f132a differs from pull request most recent head aef95a5. Consider uploading reports for the commit aef95a5 to get more accurate results

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #170 +/- ## ========================================= Coverage 100.00% 100.00% ========================================= Files 21 21 Lines 192 192 Branches 37 37 ========================================= Hits 192 192 ``` Help us with your feedback. Take ten seconds to tell us [how you rate us](https://about.codecov.io/nps?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=depromeet). Have a feature suggestion? [Share it here.](https://app.codecov.io/gh/feedback/?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=depromeet)

:umbrella: View full report at Codecov.
:loudspeaker: Do you have feedback about the report comment? Let us know in this issue.