Fix/77: 쿼리키 추가 #78

cindycho0423 · 2024-12-10T11:40:01Z

#️⃣ 이슈

close 🚑️ Fix: 체결내역 캐싱 수정 #77

📝 작업 내용

이번 PR에서 작업한 내용을 간략히 설명해주세요.

쿼리키 추가하여 캐싱되지 않게 처리
Todo
Todo

📸 스크린샷

✅ 체크 리스트

👩‍💻 공유 포인트 및 논의 사항

Summary by CodeRabbit

기능 추가
- 주식 이름에 따라 거래 기록을 동적으로 가져오는 기능 개선.
버그 수정
- 데이터 로딩 상태를 관리하는 로직 개선.

coderabbitai · 2024-12-10T11:40:09Z

Walkthrough

이 변경 사항은 src/app/search/[id]/_components/transaction-form/history.tsx의 History 컴포넌트에서 useQuery 훅의 구성을 수정합니다. queryKey가 ["tradeHistory"]에서 ["tradeHistory", ${stockName}]로 업데이트되어 stockName이 쿼리 키의 동적 부분으로 추가됩니다. 이로 인해 쿼리가 주식 이름에 따라 고유하게 식별되며, 데이터 가져오기 및 캐싱 방식에 영향을 미칠 수 있습니다. queryFn은 동일하게 유지되며, 로딩 상태 처리 및 거래 내역 데이터 렌더링 로직은 변경되지 않았습니다.

Changes

파일 경로	변경 요약
`src/app/search/[id]/_components/transaction-form/history.tsx`	`useQuery`의 `queryKey`를 `["tradeHistory"]`에서 `["tradeHistory",` ${stockName}`]`로 수정.

Assessment against linked issues

Objective	Addressed	Explanation
체결내역 캐싱 수정 (#77)	✅

Possibly related PRs

Feat/56: 체결내역 불러오기 #63: 이 PR은 History 컴포넌트에서 직접 호출되는 getTradeHistory 함수를 도입합니다.
Refactor/64: 로딩/에러 처리 #68: 이 PR은 getTradeHistory 함수의 반환 타입을 업데이트하고 API 엔드포인트를 수정하여 History 컴포넌트의 useQuery 훅과 관련이 있습니다.
Fix/69: input 에러 해결 #70: 이 PR은 EditCancel 컴포넌트의 queryKey를 stockName을 포함하도록 업데이트하여, History 컴포넌트와의 변경 사항을 일치시킵니다.

Suggested labels

🛠️ FIX, 우선순위: HIGH

Suggested reviewers

Han-wo

🐇 변화의 바람이 불어와
거래 내역이 새롭게 빛나네
주식 이름을 담아내고
로딩 스피너가 춤을 추네
새로운 쿼리로 모두가 기뻐해! 🌟

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Generate unit testing code for this file.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai generate unit testing code for this file.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and generate unit testing code.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR. (Experiment)
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

coderabbitai

Actionable comments posted: 0

🧹 Outside diff range and nitpick comments (2)

src/app/search/[id]/_components/transaction-form/history.tsx (2)
Line range hint 31-39: 성능 최적화를 위한 제안사항이 있습니다.

현재 정렬 로직이 프론트엔드에서 처리되고 있습니다. 데이터가 많아질 경우 성능에 영향을 줄 수 있으므로, 백엔드에서 정렬된 데이터를 받아오는 것이 좋습니다.
- [...tradeHistoryData]
-   .sort((a, b) => b.id - a.id)
-   .map((history) => (
+ tradeHistoryData.map((history) => (
Line range hint 15-24: 에러 처리 로직 추가를 제안드립니다.

현재 로딩 상태만 처리되어 있고 에러 상태에 대한 처리가 없습니다. 사용자 경험 향상을 위해 에러 처리를 추가하는 것이 좋습니다.
  const {
    data: tradeHistoryData,
    isLoading,
    isPending,
+   error,
  } = useQuery({
    queryKey: ["tradeHistory", `${stockName}`],
    queryFn: () => getTradeHistory(token, stockName),
    enabled: !!isAuthenticated && !!token,
  });

+ if (error) {
+   return (
+     <div className="text-center text-red-500">
+       데이터를 불러오는 중 오류가 발생했습니다.
+     </div>
+   );
+ }

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between e55fb9f and 568e017.

📒 Files selected for processing (1)

src/app/search/[id]/_components/transaction-form/history.tsx (1 hunks)

🔇 Additional comments (1)

src/app/search/[id]/_components/transaction-form/history.tsx (1)

20-20: 쿼리키 수정이 적절하게 구현되었습니다.

stockName을 쿼리키에 추가함으로써 각 종목별로 독립적인 캐싱이 가능해졌습니다. 이는 체결내역 캐싱 문제를 효과적으로 해결할 것으로 보입니다.

github-actions · 2024-12-10T11:44:58Z

💄 Storybook: https://66e95dd74f88edf048011168-wxvlwubdum.chromatic.com/

fix: 쿼리키 추가

568e017

cindycho0423 requested a review from Han-wo December 10, 2024 11:40

cindycho0423 self-assigned this Dec 10, 2024

cindycho0423 linked an issue Dec 10, 2024 that may be closed by this pull request

🚑️ Fix: 체결내역 캐싱 수정 #77

Closed

1 task

coderabbitai bot reviewed Dec 10, 2024

View reviewed changes

cindycho0423 added the 🛠️ FIX Something isn't working label Dec 10, 2024

Merge branch 'develop' into fix/77

4725b06

cindycho0423 merged commit 5ffefb4 into develop Dec 10, 2024
4 of 5 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fix/77: 쿼리키 추가 #78

Fix/77: 쿼리키 추가 #78

Uh oh!

cindycho0423 commented Dec 10, 2024 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Dec 10, 2024 •

edited

Loading

Chat

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (`.coderabbit.yaml`)

Documentation and Community

Uh oh!

coderabbitai bot left a comment

Uh oh!

github-actions bot commented Dec 10, 2024 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Fix/77: 쿼리키 추가 #78

Fix/77: 쿼리키 추가 #78

Uh oh!

Conversation

cindycho0423 commented Dec 10, 2024 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

#️⃣ 이슈

📝 작업 내용

📸 스크린샷

✅ 체크 리스트

👩‍💻 공유 포인트 및 논의 사항

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Dec 10, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Assessment against linked issues

Possibly related PRs

Suggested labels

Suggested reviewers

Chat

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Dec 10, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

cindycho0423 commented Dec 10, 2024 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Dec 10, 2024 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)

github-actions bot commented Dec 10, 2024 •

edited

Loading