Fix/160/reissue-err #163
Fix/160/reissue-err #163
Conversation
Walkthroughμ΄ λ³κ²½ μ¬νμ μΈμ¦ ν ν° μ¬λ°κΈμ κ΄λ¦¬νλ Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Warning There were issues while running some tools. Please review the errors and either fix the toolβs configuration or disable the tool if itβs a critical failure. π§ eslint (1.23.1)
.storybook/preview.tsxOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't determine the plugin "react-hooks" uniquely.
Please remove the "plugins" setting from either config or remove either plugin installation. If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team. π Recent review detailsConfiguration used: CodeRabbit UI π Files selected for processing (1)
π Additional comments (1).storybook/preview.tsx (1)
Storybook μ€μ μ Next.js 13+ μ± λλ ν 리 ꡬ쑰λ₯Ό νμ±ννλ κ²μ μ’μ μ κ·Όμ λλ€. μ΄λ μ΅μ Next.js κΈ°λ₯λ€κ³Όμ νΈνμ±μ 보μ₯ν©λλ€. λ€μ μ€ν¬λ¦½νΈλ₯Ό μ€ννμ¬ Next.js μ± λλ ν 리 κ΅¬μ‘°κ° μ€μ λ‘ μ¬μ©λκ³ μλμ§ νμΈνκ² μ΅λλ€: β Verification successfulNext.js μ± λλ ν 리 κ΅¬μ‘°κ° νμΈλμμ΅λλ€ νλ‘μ νΈκ° Next.js 13+ μ± λλ ν 리 ꡬ쑰λ₯Ό μλ²½νκ² κ΅¬ννκ³ μμμ νμΈνμ΅λλ€:
λ°λΌμ Storybookμ π Scripts executedThe following scripts were executed for the analysis: Script: #!/bin/bash
# Description: Next.js μ± λλ ν 리 ꡬ쑰 νμΈ
# app λλ ν 리 μ‘΄μ¬ μ¬λΆ νμΈ
fd -t d "^app$"
# page.tsx νμΌ κ²μ
fd -e tsx "page.tsx$"
# layout.tsx νμΌ κ²μ
fd -e tsx "layout.tsx$"
Length of output: 850 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? πͺ§ TipsChatThere are 3 ways to chat with CodeRabbit:
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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
π§Ή Outside diff range and nitpick comments (1)
src/components/client-provider.tsx (1)
Line range hint
1-58: μΈμ¦ κ΄λ ¨ λ‘μ§μ λΆλ¦¬λ₯Ό κ³ λ €ν΄μ£ΌμΈμνμ¬ ν ν° κ΄λ¦¬μ μ¬λ°κΈ λ‘μ§μ΄ QueryClient μ€μ μ μ§μ ꡬνλμ΄ μμ΅λλ€. μ΄λ κ΄μ¬μ¬ λΆλ¦¬ μμΉμ μλ°°λλ©°, μ½λμ μ¬μ¬μ©μ±κ³Ό ν μ€νΈ μ©μ΄μ±μ μ ν΄ν μ μμ΅λλ€.
λ€μκ³Ό κ°μ ꡬ쑰μ κ°μ μ μ μλ립λλ€:
- μΈμ¦ κ΄λ ¨ λ‘μ§μ λ³λμ μλΉμ€λ‘ λΆλ¦¬
- ν ν° κ΄λ¦¬λ₯Ό μν μ μ© ν ꡬν
- QueryClient μ€μ κ³Ό μΈμ¦ λ‘μ§μ λΆλ¦¬
μμ ꡬ쑰:
// src/services/auth.service.ts export class AuthService { async handleTokenError() { // ν ν° μ¬λ°κΈ λ‘μ§ } } // src/hooks/use-auth-error-handler.ts export function useAuthErrorHandler() { // μλ¬ μ²λ¦¬ ν }
π Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
π Files selected for processing (3)
src/_queries/auth/reissue-queries.ts(0 hunks)src/_queries/auth/user-queries.ts(1 hunks)src/components/client-provider.tsx(2 hunks)
π€ Files with no reviewable changes (1)
- src/_queries/auth/reissue-queries.ts
π Additional comments (4)
src/_queries/auth/user-queries.ts (2)
3-3: ν
κΈ°λ° μ κ·Ό λ°©μμΌλ‘μ μ νμ΄ μ μ ν©λλ€.
useAuthStore ν
μ μ¬μ©νλ κ²μ΄ Reactμ μν κ΄λ¦¬ ν¨ν΄μ λ μ λΆν©ν©λλ€.
6-6: μν μ νμ ν¨ν΄μ΄ μ¬λ°λ₯΄κ² ꡬνλμμ΅λλ€.
useAuthStoreμ μ νμ ν¨ν΄μ μ¬μ©νμ¬ ν ν° μνλ₯Ό ꡬλ
νλ λ°©μμ΄ ν¨μ¨μ μ
λλ€. λ€λ§, ν ν° μν λ³κ²½ μ μ μ ν 리λ λλ§μ΄ λ°μνλμ§ νμΈμ΄ νμν©λλ€.
ν ν° μν λ³κ²½ μμ λμμ νμΈνκΈ° μν΄ λ€μ μ€ν¬λ¦½νΈλ₯Ό μ€ννμΈμ:
β Verification successful
Let me analyze the token state management implementation further to verify the rerendering behavior.
ν ν° μν κ΄λ¦¬κ° μ μ νκ² κ΅¬νλμ΄ μμ΅λλ€
useAuthStoreλ Zustandμ persist λ―Έλ€μ¨μ΄λ₯Ό μ¬μ©νμ¬ ν ν° μνλ₯Ό μΈμ
μ€ν 리μ§μ μμ νκ² μ μ₯νκ³ μμΌλ©°, μν λ³κ²½ μ μλμΌλ‘ 리λ λλ§μ΄ λ°μνλλ‘ κ΅¬νλμ΄ μμ΅λλ€. νΉν:
setν¨μλ₯Ό ν΅ν μν μ λ°μ΄νΈλ‘ 리λ λλ§μ΄ 보μ₯λ©λλ€- μ νμ ν¨ν΄μ ν΅ν΄ νμν μ»΄ν¬λνΈμμλ§ ν ν° μνλ₯Ό ꡬλ ν©λλ€
queryClient.refetchQueriesλ₯Ό ν΅ν΄ ν ν° λ³κ²½ μ κ΄λ ¨ 쿼리λ€μ΄ μ μ ν κ°±μ λ©λλ€
π Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: ν ν° μν λ³κ²½κ³Ό κ΄λ ¨λ λ‘μ§ νμΈ
# ν ν° μν μ
λ°μ΄νΈ μ²λ¦¬ κ²μ
rg -A 5 "setToken|updateToken"
# ν ν° μν μ¬μ© κ²μ
rg -A 5 "useAuthStore.*token"
Length of output: 2706
Script:
#!/bin/bash
# Check store implementation and persistence configuration
ast-grep --pattern 'createStore<$_>()($$$)'
# Check token usage in components and hooks
rg -A 5 "useAuthStore.*token.*\{"
Length of output: 962
src/components/client-provider.tsx (2)
14-15: μΈμ¦ μ€ν¨ μ 리λ€μ΄λ μ
μ²λ¦¬κ° μ μ νμ§ νμΈ νμ
νμ¬ κ²½λ‘λ₯Ό μ μ₯νκ³ λΌμ°ν°λ₯Ό μ΄κΈ°ννλ λ‘μ§μ΄ μΆκ°λμμ΅λλ€. μ΄λ μΈμ¦ μ€ν¨ μ μ¬μ©μ κ²½νμ κ°μ νλλ° λμμ΄ λ κ²μΌλ‘ 보μ λλ€.
4-4: μλ‘μ΄ import κ΅¬λ¬Έμ΄ μ μ ν μ¬μ©λλμ§ νμΈ νμ
μλ‘ μΆκ°λ importλ€μ΄ μ½λμμ μ¬λ°λ₯΄κ² νμ©λκ³ μμ΅λλ€. λ€λ§, μ΄λ¬ν λ³κ²½μΌλ‘ μΈν λ²λ€ μ¬μ΄μ¦ μ¦κ°λ₯Ό κ³ λ €ν΄λ³Ό νμκ° μμ΅λλ€.
Also applies to: 10-10
| const apiError = error as ApiError; | ||
| if (apiError.status === 401) { | ||
| try { | ||
| const { token } = await reissue(); | ||
| if (token) { | ||
| setToken(token.replace(/^Bearer\s/, '')); | ||
| await Promise.all([ | ||
| queryClient.refetchQueries({ queryKey: query.queryKey }), | ||
| queryClient.refetchQueries({ queryKey: ['user'] }), | ||
| ]); | ||
| } | ||
| } catch { | ||
| router.push(`/login?redirect=${redirect}`); | ||
| } |
There was a problem hiding this comment.
ν ν° μ¬λ°κΈ λ‘μ§ κ°μ μ΄ νμν©λλ€
νμ¬ κ΅¬νμμ λ€μκ³Ό κ°μ κ°μ μ¬νλ€μ΄ νμν΄ λ³΄μ λλ€:
- ν ν° μ¬λ°κΈ μ€ λ‘λ© μν μ²λ¦¬κ° μμ΅λλ€
- ν ν°μ΄ κ³μ μ ν¨νμ§ μμ κ²½μ° λ¬΄ν 루νκ° λ°μν μ μμ΅λλ€
- API μλ¬ νμ μΊμ€ν μ κ²μ¦μ΄ νμν©λλ€
- μ¬λ¬ 쿼리 λμ 리νμΉλ‘ μΈν λ μ΄μ€ 컨λμ κ°λ₯μ±μ΄ μμ΅λλ€
λ€μκ³Ό κ°μ κ°μ λ ꡬνμ μ μλ립λλ€:
- const apiError = error as ApiError;
- if (apiError.status === 401) {
+ if (error instanceof ApiError && error.status === 401) {
+ const isReissuing = useRef(false);
+ if (isReissuing.current) return;
+ isReissuing.current = true;
try {
const { token } = await reissue();
if (token) {
setToken(token.replace(/^Bearer\s/, ''));
- await Promise.all([
- queryClient.refetchQueries({ queryKey: query.queryKey }),
- queryClient.refetchQueries({ queryKey: ['user'] }),
- ]);
+ // μμ°¨μ μΌλ‘ 쿼리 리νμΉ
+ await queryClient.refetchQueries({ queryKey: ['user'] });
+ await queryClient.refetchQueries({ queryKey: query.queryKey });
}
} catch {
router.push(`/login?redirect=${redirect}`);
+ } finally {
+ isReissuing.current = false;
}
}Committable suggestion skipped: line range outside the PR's diff.
|
πstorybook: https://67206cc6ff9d7a05a3528ff8-mwfomlqiji.chromatic.com/ |
π Issue Ticket
Ticket
βοΈ Description
β Checklist
PR
Test
Summary by CodeRabbit
Summary by CodeRabbit
λ²κ·Έ μμ
μλ‘μ΄ κΈ°λ₯
useAuthStoreλ₯Ό ν΅ν μΈμ¦ ν ν° μ κ·Ό λ°©μ λ³κ²½μΌλ‘ μν κ΄λ¦¬ κ°μ .λ¬Έμν
ClientProviderμ»΄ν¬λνΈμ μ€λ₯ μ²λ¦¬ λ©μ»€λμ¦ κ°ν.