전남대 FE_임지환 2주차 과제 #51
Open
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
- Header 컴포넌트에서 로그인 페이지로 이동하기 전에 현재 경로 저장 - LoginPage 컴포넌트에서 로그인 성공 후 저장된 경로로 리디렉션 - ProtectedRoute에서 사용자가 인증되지 않았을 때 현재 경로 저장
tlsehdfl
reviewed
Jul 8, 2024
src/App-core/AuthContext.tsx
Outdated
| logout: () => {}, | ||
| }); | ||
|
|
||
| export const useAuth = () => useContext(AuthContext); |
There was a problem hiding this comment.
Suggested change
| export const useAuth = () => useContext(AuthContext); | |
| export const useAuth = () => useContext<AuthContextType>(AuthContext); |
src/App-core/Routes.tsx
Outdated
| path: RouterPath.root, | ||
| element: ( | ||
| <> | ||
| <Header /> |
There was a problem hiding this comment.
Header, Footer 등 반복되는 컴포넌트는 Layout 으로 구성할 수 있을거 같습니다.
아래 참고 하셔서 Layout 컴포넌트로 구성해보실 수 있을거 같아요.
ref. https://reactrouter.com/en/main/components/outlet
src/App-core/Routes.tsx
Outdated
| element: ( | ||
| <> | ||
| <Header /> | ||
| <ProtectedRoute> |
There was a problem hiding this comment.
ProtectedRoute 도 Outlet 사용해서 공통으로 적용할 수 있을거 같습니다.
ref. https://reactrouter.com/en/main/components/outlet
src/Home/Category.tsx
Outdated
| import { Container } from '@/components/common/layouts/Container'; | ||
| import { Grid } from '@/components/common/layouts/Grid'; | ||
|
|
||
| type Props = { |
There was a problem hiding this comment.
Suggested change
| type Props = { | |
| interface Props extends ComponentProps<'div'> { |
src/Home/RankingItem/ProductList.tsx
Outdated
| activeType: string; | ||
| }) => { | ||
| const [visibleProducts, setVisibleProducts] = useState<number>(6); | ||
| const [filteredProducts, setFilteredProducts] = useState<Product[]>([]); |
There was a problem hiding this comment.
useEffect 내부에서 처리하는 것이 아니라 필터 함수를 작성해서 filteredProducts 초기값을 아래와 같이 지정해 줄 수 있습니다.
Suggested change
| const [filteredProducts, setFilteredProducts] = useState<Product[]>([]); | |
| const [filteredProducts, setFilteredProducts] = useState<Product[]>(() => products.filter( | |
| (product) => | |
| (activeCategory === 'all' || product.category === activeCategory) && | |
| product.type === activeType, | |
| )); |
src/Home/RankingItem/index.tsx
Outdated
|
|
||
| const GiftRankingPage = () => { | ||
| const [activeCategory, setActiveCategory] = useState<string>('all'); | ||
| const [activeType, setActiveType] = useState<string>('wanted'); |
There was a problem hiding this comment.
여기도 마찬가지입니다.
Suggested change
| const [activeType, setActiveType] = useState<string>('wanted'); | |
| const [activeType, setActiveType] = useState<Type>('wanted'); |
src/components/common/Header.tsx
Outdated
| const location = useLocation(); | ||
|
|
||
| const handleLoginClick = () => { | ||
| sessionStorage.setItem('redirectPath', location.pathname + location.search); |
src/pages/LoginPage.tsx
Outdated
| const handleLogin = () => { | ||
| if (username && password) { | ||
| login(username); // 로그인 상태 변경 | ||
| const redirectPath = sessionStorage.getItem('redirectPath') || '/'; |
There was a problem hiding this comment.
Suggested change
| const redirectPath = sessionStorage.getItem('redirectPath') || '/'; |
src/pages/LoginPage.tsx
Outdated
| login(username); // 로그인 상태 변경 | ||
| const redirectPath = sessionStorage.getItem('redirectPath') || '/'; | ||
| sessionStorage.removeItem('redirectPath'); // 리디렉션 후 경로 삭제 | ||
| console.log('Login successful. Redirecting to:', redirectPath); |
There was a problem hiding this comment.
Suggested change
| console.log('Login successful. Redirecting to:', redirectPath); |
src/pages/LoginPage.tsx
Outdated
| const redirectPath = sessionStorage.getItem('redirectPath') || '/'; | ||
| sessionStorage.removeItem('redirectPath'); // 리디렉션 후 경로 삭제 | ||
| console.log('Login successful. Redirecting to:', redirectPath); | ||
| navigate(redirectPath, { replace: true }); |
There was a problem hiding this comment.
Suggested change
| navigate(redirectPath, { replace: true }); | |
| navigate('/login', { replace: true }); |
|
멘토님 수정해보았습니다!! |
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.
안녕하세요, 멘토님.
전남대 FE_임지환 입니다!
2주차 과제를 해보았는데 어려움을 많이 느꼈습니다..
혹시 코드에서 부족한 부분이나 잘못된 점이 있으면 바로 고쳐보겠습니다!!
그리고 폴더 구조를 나름대로 해보았는데 괜찮은지 봐주시면 감사하겠습니다.
항상 감사합니다!