From 9e6295eb0d56788c08eedf216961560e53b2b6a7 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Sun, 22 Sep 2024 00:34:36 +0900 Subject: [PATCH 01/16] =?UTF-8?q?feat:=20=EC=98=A4=EB=8A=98=EC=9D=98=20?= =?UTF-8?q?=EC=9A=A9=EC=96=B4=20=EC=A1=B0=ED=9A=8C=20api=20=EC=97=B0?= =?UTF-8?q?=EB=8F=99=20=EB=B0=8F=20server=20component=20prefetch=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/words/index.ts | 6 ++++++ src/app/home/learning/page.tsx | 25 +++++++++++++++++++++---- 2 files changed, 27 insertions(+), 4 deletions(-) diff --git a/src/api/words/index.ts b/src/api/words/index.ts index b7cf9b3e..2d510aee 100644 --- a/src/api/words/index.ts +++ b/src/api/words/index.ts @@ -24,3 +24,9 @@ export async function getRecentWords() { const res = await get>('/words/recent') return res.words } + +// 오늘의 용어 3개 조회 +export async function getTodayWords() { + const res = await get>('/words/todays') + return res.words +} diff --git a/src/app/home/learning/page.tsx b/src/app/home/learning/page.tsx index 41670d17..1ed972d4 100644 --- a/src/app/home/learning/page.tsx +++ b/src/app/home/learning/page.tsx @@ -1,14 +1,31 @@ +import { getTodayWords } from '@/api/words' import { WordsList } from '@/components/domain/home/dictionary/RecentlyAddedWords/data' import CommunicationStats from '@/components/domain/home/learning/CommunicationStats' import TodayQuiz from '@/components/domain/home/learning/TodayQuiz' import TodayWords from '@/components/domain/home/learning/TodayWords' +import { + HydrationBoundary, + QueryClient, + dehydrate, +} from '@tanstack/react-query' + +export default async function LearningTab() { + const queryClient = new QueryClient() + + await Promise.all([ + queryClient.prefetchQuery({ + queryKey: ['words', 'today'], + queryFn: getTodayWords, + }), + ]) -export default function LearningTab() { return (
- - - + + + + +
) } From f4d383a7edc63f0876da272d8f9e99558d48588f Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Sun, 22 Sep 2024 00:35:23 +0900 Subject: [PATCH 02/16] =?UTF-8?q?feat:=20useGetTodayWords=20custom=20hook?= =?UTF-8?q?=20=EC=83=9D=EC=84=B1=20=EB=B0=8F=20client=20component=EC=97=90?= =?UTF-8?q?=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../domain/home/learning/TodayWords/index.tsx | 14 +++++++------- src/hooks/word/useGetTodayWords.ts | 10 ++++++++++ 2 files changed, 17 insertions(+), 7 deletions(-) create mode 100644 src/hooks/word/useGetTodayWords.ts diff --git a/src/components/domain/home/learning/TodayWords/index.tsx b/src/components/domain/home/learning/TodayWords/index.tsx index 708d9fbb..048b4108 100644 --- a/src/components/domain/home/learning/TodayWords/index.tsx +++ b/src/components/domain/home/learning/TodayWords/index.tsx @@ -1,15 +1,15 @@ +'use client' import HorizontalScrollArea from '@/components/common/HorizontalScrollArea' -import WordCard, { WordCardProps } from '@/components/shared/WordCard' +import WordCard from '@/components/shared/WordCard' +import { useGetTodayWords } from '@/hooks/word/useGetTodayWords' -export default function TodayWords({ - wordsList, -}: { - wordsList: WordCardProps[] -}) { +export default function TodayWords() { + const { words } = useGetTodayWords() + if (typeof words === 'string' || !words) return return ( <> - {wordsList.map(({ id, name, meaning, category }, idx) => ( + {words.map(({ id, name, meaning, category }, idx) => ( { + const { data: words, isLoading } = useQuery({ + queryKey: ['words', 'today'], + queryFn: getTodayWords, + }) + return { words, isLoading } +} From 14dbc3afa94f429cae1c55fc3f884d722182b365 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Thu, 26 Sep 2024 01:40:58 +0900 Subject: [PATCH 03/16] =?UTF-8?q?feat:=20=ED=95=99=EC=8A=B5=20=ED=83=AD=20?= =?UTF-8?q?=ED=80=B4=EC=A6=88=20=EC=B0=B8=EC=97=AC=20=EC=9D=B8=EC=9B=90=20?= =?UTF-8?q?=EC=A1=B0=ED=9A=8C=20api=20=EC=97=B0=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/quiz/index.ts | 6 ++++++ src/app/home/learning/page.tsx | 2 +- .../domain/home/learning/TodayQuiz/index.tsx | 10 ++++------ 3 files changed, 11 insertions(+), 7 deletions(-) create mode 100644 src/api/quiz/index.ts diff --git a/src/api/quiz/index.ts b/src/api/quiz/index.ts new file mode 100644 index 00000000..3df5a634 --- /dev/null +++ b/src/api/quiz/index.ts @@ -0,0 +1,6 @@ +import { get } from '@/lib/axios' + +export async function getTodayParticipants() { + const res = await get('/learnings/today/participants') + return res +} diff --git a/src/app/home/learning/page.tsx b/src/app/home/learning/page.tsx index 1ed972d4..7ec445eb 100644 --- a/src/app/home/learning/page.tsx +++ b/src/app/home/learning/page.tsx @@ -22,7 +22,7 @@ export default async function LearningTab() { return (
- + diff --git a/src/components/domain/home/learning/TodayQuiz/index.tsx b/src/components/domain/home/learning/TodayQuiz/index.tsx index 70972977..8ca76bf3 100644 --- a/src/components/domain/home/learning/TodayQuiz/index.tsx +++ b/src/components/domain/home/learning/TodayQuiz/index.tsx @@ -1,13 +1,11 @@ +import { getTodayParticipants } from '@/api/quiz' import Button from '@/components/common/Button' import { getTodayDate } from '@/utils/date' import Image from 'next/image' import Link from 'next/link' -type TodayQuizProps = { - todaySolvedCnt: number -} - -export default function TodayQuiz({ todaySolvedCnt }: TodayQuizProps) { +export default async function TodayQuiz() { + const res = await getTodayParticipants() return (

@@ -25,7 +23,7 @@ export default function TodayQuiz({ todaySolvedCnt }: TodayQuizProps) {

용어 퀴즈

오늘  - {todaySolvedCnt} + {res} 명이 퀴즈에
참여했어요. From 6979ed7ec36d20eadd08a758ad7c103d5ff90751 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Thu, 26 Sep 2024 23:22:51 +0900 Subject: [PATCH 04/16] =?UTF-8?q?feat:=20=ED=95=99=EC=8A=B5=20=ED=83=AD=20?= =?UTF-8?q?=EC=83=81=EC=9C=84=20=ED=8D=BC=EC=84=BC=ED=8A=B8=20=EC=A1=B0?= =?UTF-8?q?=ED=9A=8C=20api=20=EC=97=B0=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/auth/skill/index.ts | 7 +++++++ src/app/home/learning/page.tsx | 5 +++++ .../domain/home/learning/CommunicationStats/index.tsx | 5 ++++- src/hooks/auth/useGetSkill.tsx | 11 +++++++++++ 4 files changed, 27 insertions(+), 1 deletion(-) create mode 100644 src/api/auth/skill/index.ts create mode 100644 src/hooks/auth/useGetSkill.tsx diff --git a/src/api/auth/skill/index.ts b/src/api/auth/skill/index.ts new file mode 100644 index 00000000..1d03b730 --- /dev/null +++ b/src/api/auth/skill/index.ts @@ -0,0 +1,7 @@ +import { get } from '@/lib/axios' + +// 유저 상위 퍼센트 조회 +export async function getUserPrecedence() { + const res = await get('/skill/precedence') + return res +} diff --git a/src/app/home/learning/page.tsx b/src/app/home/learning/page.tsx index 7ec445eb..4a7e1b3e 100644 --- a/src/app/home/learning/page.tsx +++ b/src/app/home/learning/page.tsx @@ -1,3 +1,4 @@ +import { getUserPrecedence } from '@/api/auth/skill' import { getTodayWords } from '@/api/words' import { WordsList } from '@/components/domain/home/dictionary/RecentlyAddedWords/data' import CommunicationStats from '@/components/domain/home/learning/CommunicationStats' @@ -17,6 +18,10 @@ export default async function LearningTab() { queryKey: ['words', 'today'], queryFn: getTodayWords, }), + queryClient.prefetchQuery({ + queryKey: ['skill', 'precedence'], + queryFn: getUserPrecedence, + }), ]) return ( diff --git a/src/components/domain/home/learning/CommunicationStats/index.tsx b/src/components/domain/home/learning/CommunicationStats/index.tsx index 7cea1590..d6d8f712 100644 --- a/src/components/domain/home/learning/CommunicationStats/index.tsx +++ b/src/components/domain/home/learning/CommunicationStats/index.tsx @@ -1,3 +1,5 @@ +'use client' +import useGetPrecedence from '@/hooks/auth/useGetSkill' import CategoryChartItem from './CategoryChartItem' import TotalChart from './TotalChart' import { StatsInfo } from './data' @@ -6,6 +8,7 @@ export type Category = 'develop' | 'design' | 'business' const categories: Category[] = ['develop', 'design', 'business'] export default function CommunicationStats() { + const { precedence } = useGetPrecedence() return ( <>

@@ -18,7 +21,7 @@ export default function CommunicationStats() {

diff --git a/src/hooks/auth/useGetSkill.tsx b/src/hooks/auth/useGetSkill.tsx new file mode 100644 index 00000000..df892c8b --- /dev/null +++ b/src/hooks/auth/useGetSkill.tsx @@ -0,0 +1,11 @@ +import { getUserPrecedence } from '@/api/auth/skill' +import { useQuery } from '@tanstack/react-query' + +export default function useGetPrecedence() { + const { data: precedence, isFetched } = useQuery({ + queryKey: ['skill', 'precedence'], + queryFn: getUserPrecedence, + }) + + return { precedence, isFetched } +} From 3aceecf3d18f0b42ba709738fb2eda8e94cb2b86 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Thu, 26 Sep 2024 23:26:16 +0900 Subject: [PATCH 05/16] =?UTF-8?q?remove:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=ED=8C=8C=EC=9D=BC=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/home/learning/page.tsx | 1 - .../dictionary/RecentlyAddedWords/data.ts | 24 ------------------- 2 files changed, 25 deletions(-) delete mode 100644 src/components/domain/home/dictionary/RecentlyAddedWords/data.ts diff --git a/src/app/home/learning/page.tsx b/src/app/home/learning/page.tsx index 4a7e1b3e..4ffeca4e 100644 --- a/src/app/home/learning/page.tsx +++ b/src/app/home/learning/page.tsx @@ -1,6 +1,5 @@ import { getUserPrecedence } from '@/api/auth/skill' import { getTodayWords } from '@/api/words' -import { WordsList } from '@/components/domain/home/dictionary/RecentlyAddedWords/data' import CommunicationStats from '@/components/domain/home/learning/CommunicationStats' import TodayQuiz from '@/components/domain/home/learning/TodayQuiz' import TodayWords from '@/components/domain/home/learning/TodayWords' diff --git a/src/components/domain/home/dictionary/RecentlyAddedWords/data.ts b/src/components/domain/home/dictionary/RecentlyAddedWords/data.ts deleted file mode 100644 index dc723c22..00000000 --- a/src/components/domain/home/dictionary/RecentlyAddedWords/data.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { WordCardProps } from '@/components/shared/WordCard' - -export const WordsList: WordCardProps[] = [ - { - id: 0, - name: 'Agenda', - meaning: '완수해야하는 업무 내용을 사전에 정리해 둔 항목들', - category: '비즈니스', - }, - { - id: 1, - name: 'KPI (Key Performance Indicator)', - meaning: - '성과를 측정하는 데 사용되는 주요 지표. 조직이나 개인의 목표 달성 정도를 평가하는 기준으로 사용됩니다.', - category: '비즈니스', - }, - { - id: 2, - name: 'Containerization', - meaning: - '소프트웨어를 독립적인 실행 환경에서 실행할 수 있도록 패키징하는 기술', - category: '개발', - }, -] From 4180e0431bc49221171c2c4f9df1c20631f3b9b4 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Wed, 2 Oct 2024 00:57:05 +0900 Subject: [PATCH 06/16] =?UTF-8?q?feat:=20=EC=9C=A0=EC=A0=80=20=EB=8A=A5?= =?UTF-8?q?=EB=A0=A5=EC=B9=98=20=EC=A1=B0=ED=9A=8C=20api=20=ED=95=A8?= =?UTF-8?q?=EC=88=98=20=EC=83=9D=EC=84=B1=20=EB=B0=8F=20=EC=97=B0=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/auth/skill/index.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/api/auth/skill/index.ts b/src/api/auth/skill/index.ts index 1d03b730..d0968074 100644 --- a/src/api/auth/skill/index.ts +++ b/src/api/auth/skill/index.ts @@ -5,3 +5,8 @@ export async function getUserPrecedence() { const res = await get('/skill/precedence') return res } + +export async function getUserAbility() { + const res = await get('/skill/ability') + return res +} From b2dd6af3ef9028e130bb09bab9882d58ce239b4c Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Wed, 2 Oct 2024 01:00:43 +0900 Subject: [PATCH 07/16] =?UTF-8?q?feat:=20SkillAbilityType=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EB=B0=8F=20useGetAbility=20custom=20hook=20?= =?UTF-8?q?=EC=83=9D=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/auth/useGetSkill.tsx | 13 +++++++++++-- src/types/skillAbility.ts | 20 ++++++++++++++++++++ 2 files changed, 31 insertions(+), 2 deletions(-) create mode 100644 src/types/skillAbility.ts diff --git a/src/hooks/auth/useGetSkill.tsx b/src/hooks/auth/useGetSkill.tsx index df892c8b..b8d52511 100644 --- a/src/hooks/auth/useGetSkill.tsx +++ b/src/hooks/auth/useGetSkill.tsx @@ -1,7 +1,7 @@ -import { getUserPrecedence } from '@/api/auth/skill' +import { getUserAbility, getUserPrecedence } from '@/api/auth/skill' import { useQuery } from '@tanstack/react-query' -export default function useGetPrecedence() { +export function useGetPrecedence() { const { data: precedence, isFetched } = useQuery({ queryKey: ['skill', 'precedence'], queryFn: getUserPrecedence, @@ -9,3 +9,12 @@ export default function useGetPrecedence() { return { precedence, isFetched } } + +export function useGetAbility() { + const { data: ability, isFetched } = useQuery({ + queryKey: ['skill', 'ability'], + queryFn: getUserAbility, + }) + + return { ability, isFetched } +} diff --git a/src/types/skillAbility.ts b/src/types/skillAbility.ts new file mode 100644 index 00000000..5fce94fa --- /dev/null +++ b/src/types/skillAbility.ts @@ -0,0 +1,20 @@ +export type SkillAbilityType = { + totalAvgResponse: number + skillTotalScoreResponse: { + additionalProp1: { + totalScore: number + currentCount: number + totalCount: number + } + additionalProp2: { + totalScore: number + currentCount: number + totalCount: number + } + additionalProp3: { + totalScore: number + currentCount: number + totalCount: number + } + } +} From 51c91e34f123997762640e1370238fb0ed0f0ec0 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Tue, 8 Oct 2024 15:06:47 +0900 Subject: [PATCH 08/16] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=EC=8B=9C=20=EC=9C=A0=EC=A0=80=20id=20=EC=A0=84=EC=97=AD=20?= =?UTF-8?q?=EC=83=81=ED=83=9C=EB=A1=9C=20=EC=A0=80=EC=9E=A5=20=EB=B0=8F=20?= =?UTF-8?q?=EA=B4=80=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/google/callback/loading/page.tsx | 17 +++++++++++++++-- src/store/useAuthStore.ts | 4 ++++ 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/src/app/google/callback/loading/page.tsx b/src/app/google/callback/loading/page.tsx index 96ca5348..24969553 100644 --- a/src/app/google/callback/loading/page.tsx +++ b/src/app/google/callback/loading/page.tsx @@ -9,13 +9,17 @@ const LoginCallback = () => { const searchParams = useSearchParams() const setAccessToken = useAuthStore((state) => state.setAccessToken) const [role, setRole] = useState(searchParams.get('role')) + const { setUserId } = useAuthStore() const accessToken = searchParams.get('accessToken') const isSignUp = searchParams.get('isSignUp') + const userId = searchParams.get('id') + useEffect(() => { - if (role && accessToken) { + if (role && accessToken && userId) { setAccessToken(accessToken) setRole(role) + setUserId(Number(userId)) } if (accessToken) { @@ -29,7 +33,16 @@ const LoginCallback = () => { router.push('/home/dictionary') } } - }, [role, accessToken, isSignUp, router, setAccessToken, setRole]) + }, [ + role, + accessToken, + isSignUp, + router, + setAccessToken, + setRole, + userId, + setUserId, + ]) return <> } diff --git a/src/store/useAuthStore.ts b/src/store/useAuthStore.ts index 35b5a01b..38e6cb73 100644 --- a/src/store/useAuthStore.ts +++ b/src/store/useAuthStore.ts @@ -4,10 +4,14 @@ interface AuthState { accessToken: string | null setAccessToken: (token: string | null) => void clearAccessToken: () => void + userId: number | null + setUserId: (userId: number) => void } export const useAuthStore = create((set) => ({ accessToken: null, setAccessToken: (token) => set({ accessToken: token }), clearAccessToken: () => set({ accessToken: null }), + userId: null, + setUserId: (id) => set({ userId: id }), })) From e394b9108a9f5ee84deff7013fb221fc4c4ad1cc Mon Sep 17 00:00:00 2001 From: Se Youn Lee Date: Tue, 8 Oct 2024 15:47:27 +0900 Subject: [PATCH 09/16] =?UTF-8?q?Revert=20"feat:=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8=20=EC=8B=9C=20=EC=9C=A0=EC=A0=80=20id=20=EC=A0=84?= =?UTF-8?q?=EC=97=AD=20=EC=83=81=ED=83=9C=EB=A1=9C=20=EC=A0=80=EC=9E=A5=20?= =?UTF-8?q?=EB=B0=8F=20=EA=B4=80=EB=A6=AC"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This reverts commit 51c91e34f123997762640e1370238fb0ed0f0ec0. --- src/app/google/callback/loading/page.tsx | 17 ++--------------- src/store/useAuthStore.ts | 4 ---- 2 files changed, 2 insertions(+), 19 deletions(-) diff --git a/src/app/google/callback/loading/page.tsx b/src/app/google/callback/loading/page.tsx index 24969553..96ca5348 100644 --- a/src/app/google/callback/loading/page.tsx +++ b/src/app/google/callback/loading/page.tsx @@ -9,17 +9,13 @@ const LoginCallback = () => { const searchParams = useSearchParams() const setAccessToken = useAuthStore((state) => state.setAccessToken) const [role, setRole] = useState(searchParams.get('role')) - const { setUserId } = useAuthStore() const accessToken = searchParams.get('accessToken') const isSignUp = searchParams.get('isSignUp') - const userId = searchParams.get('id') - useEffect(() => { - if (role && accessToken && userId) { + if (role && accessToken) { setAccessToken(accessToken) setRole(role) - setUserId(Number(userId)) } if (accessToken) { @@ -33,16 +29,7 @@ const LoginCallback = () => { router.push('/home/dictionary') } } - }, [ - role, - accessToken, - isSignUp, - router, - setAccessToken, - setRole, - userId, - setUserId, - ]) + }, [role, accessToken, isSignUp, router, setAccessToken, setRole]) return <> } diff --git a/src/store/useAuthStore.ts b/src/store/useAuthStore.ts index 38e6cb73..35b5a01b 100644 --- a/src/store/useAuthStore.ts +++ b/src/store/useAuthStore.ts @@ -4,14 +4,10 @@ interface AuthState { accessToken: string | null setAccessToken: (token: string | null) => void clearAccessToken: () => void - userId: number | null - setUserId: (userId: number) => void } export const useAuthStore = create((set) => ({ accessToken: null, setAccessToken: (token) => set({ accessToken: token }), clearAccessToken: () => set({ accessToken: null }), - userId: null, - setUserId: (id) => set({ userId: id }), })) From 4c873a5c749f0ce92eba11240c884552aab181cc Mon Sep 17 00:00:00 2001 From: Mijin Sim <80371353+azure-553@users.noreply.github.com> Date: Wed, 2 Oct 2024 15:25:14 +0900 Subject: [PATCH 10/16] =?UTF-8?q?feat:=20userId=20=EA=B0=80=EC=A0=B8?= =?UTF-8?q?=EC=98=A4=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/google/callback/loading/page.tsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/app/google/callback/loading/page.tsx b/src/app/google/callback/loading/page.tsx index 96ca5348..27730520 100644 --- a/src/app/google/callback/loading/page.tsx +++ b/src/app/google/callback/loading/page.tsx @@ -8,14 +8,18 @@ const LoginCallback = () => { const router = useRouter() const searchParams = useSearchParams() const setAccessToken = useAuthStore((state) => state.setAccessToken) + const setUserId = useAuthStore((state) => state.setUserId) const [role, setRole] = useState(searchParams.get('role')) const accessToken = searchParams.get('accessToken') const isSignUp = searchParams.get('isSignUp') + const userId = searchParams.get('id') + useEffect(() => { if (role && accessToken) { setAccessToken(accessToken) setRole(role) + setUserId(Number(userId)) } if (accessToken) { @@ -29,7 +33,16 @@ const LoginCallback = () => { router.push('/home/dictionary') } } - }, [role, accessToken, isSignUp, router, setAccessToken, setRole]) + }, [ + role, + accessToken, + isSignUp, + router, + setAccessToken, + setRole, + setUserId, + userId, + ]) return <> } From 65f167a304d20e9f9ff224ed41028091a249a628 Mon Sep 17 00:00:00 2001 From: Mijin Sim <80371353+azure-553@users.noreply.github.com> Date: Wed, 2 Oct 2024 15:09:20 +0900 Subject: [PATCH 11/16] =?UTF-8?q?feat:=20userId=20=EC=A0=84=EC=97=AD=20?= =?UTF-8?q?=EC=83=81=ED=83=9C=20=EA=B4=80=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/store/useAuthStore.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/store/useAuthStore.ts b/src/store/useAuthStore.ts index 35b5a01b..fcbddb95 100644 --- a/src/store/useAuthStore.ts +++ b/src/store/useAuthStore.ts @@ -2,12 +2,16 @@ import { create } from 'zustand' interface AuthState { accessToken: string | null + userId: number | null + setUserId: (id: number | null) => void setAccessToken: (token: string | null) => void clearAccessToken: () => void } export const useAuthStore = create((set) => ({ accessToken: null, + userId: null, + setUserId: (id) => set({ userId: id }), setAccessToken: (token) => set({ accessToken: token }), clearAccessToken: () => set({ accessToken: null }), })) From d1ec114bc5dbe397d78d2d4122245ee144f17cd2 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Tue, 8 Oct 2024 16:07:04 +0900 Subject: [PATCH 12/16] =?UTF-8?q?feat:=20=EB=B9=84=ED=9A=8C=EC=9B=90=20?= =?UTF-8?q?=ED=95=99=EC=8A=B5=20=ED=83=AD=20=EC=A0=91=EC=86=8D=20=EC=8B=9C?= =?UTF-8?q?=20LoginBottomSheet=20variant=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/images/ability_chart.svg | 9 +++++ .../shared/LoginBottomSheet/index.tsx | 33 ++++++++++++++----- src/constants/bottomSheet.ts | 15 +++++++-- 3 files changed, 47 insertions(+), 10 deletions(-) create mode 100644 public/images/ability_chart.svg diff --git a/public/images/ability_chart.svg b/public/images/ability_chart.svg new file mode 100644 index 00000000..81743120 --- /dev/null +++ b/public/images/ability_chart.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/components/shared/LoginBottomSheet/index.tsx b/src/components/shared/LoginBottomSheet/index.tsx index bfb834d2..6870482b 100644 --- a/src/components/shared/LoginBottomSheet/index.tsx +++ b/src/components/shared/LoginBottomSheet/index.tsx @@ -1,24 +1,41 @@ +'use client' import BottomSheet from '@/components/common/BottomSheet' import { LOGIN_BOTTOMSHEET } from '@/constants/bottomSheet' import GoogleLoginButton from '../GoogleLoginButton' +import Image from 'next/image' +import useUIStore from '@/store/useUIStore' export type BottomSheetProps = { isOpen: boolean - type: 'quizExit' | 'bookmark' | 'loginBtn' + type: 'quizExit' | 'bookmark' | 'loginBtn' | 'learningTab' } export default function LoginBottomSheet({ isOpen, type }: BottomSheetProps) { + const { closeBottomSheet } = useUIStore() + if (!isOpen) return null + const { title, description, imgSrc } = LOGIN_BOTTOMSHEET[type] + return ( -

- {LOGIN_BOTTOMSHEET[type].title} -

-

- {LOGIN_BOTTOMSHEET[type].description} -

+

{title}

+

{description}

+ {imgSrc && ( + {imgSrc!} + )} - + ) } diff --git a/src/constants/bottomSheet.ts b/src/constants/bottomSheet.ts index b266a044..ca81eafd 100644 --- a/src/constants/bottomSheet.ts +++ b/src/constants/bottomSheet.ts @@ -3,9 +3,14 @@ import { BottomSheetProps } from '@/components/shared/LoginBottomSheet' // 로그인 유도 BottomSheet 내에 필요한 상수 데이터 // quizExit- 퀴즈 종류 후 x 버튼 클릭 시 // bookmark- 로그인하지 않은 상태에서 북마크 버튼 클릭 시 -// loginBtn- 헤더 또는 마이페이지의 '로그인' 버튼 클릭 시 +// loginBtn- 헤더 또는 마이페이지의 '로그인' 버튼 클릭 시, 용어 퀴즈 풀러가기 버튼 클릭 시 +// learningTab - 비회원 학습 탭(홈) 접속 시 export const LOGIN_BOTTOMSHEET: { - [key in BottomSheetProps['type']]: { title: string; description: string } + [key in BottomSheetProps['type']]: { + title: string + description: string + imgSrc?: string + } } = { quizExit: { title: '나의 업무 소통 능력치를 알 수 있어요!', @@ -22,6 +27,12 @@ export const LOGIN_BOTTOMSHEET: { description: '별별 저장소, 업무 소통 능력치, 댓글 쓰기등\n다양한 기능을 이용하려면 로그인이 필요해요.', }, + learningTab: { + title: '나의 업무 소통 능력은 상위 몇 퍼센트일까요?', + description: + '회원가입을 하고 퀴즈를 풀면 나의 업무 소통 능력치가\n상위 몇 퍼센트인지 알 수 있어요.', + imgSrc: '/images/ability_chart.svg', + }, } // FilterBottomSheet에 표기할 페이지별 메뉴 목록 From 8c88f5dd5a045b55d48875b19f8606d9811c00e4 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Tue, 8 Oct 2024 17:28:58 +0900 Subject: [PATCH 13/16] =?UTF-8?q?refactor:=20today=20participants=20?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20prefetch=20=EB=B0=A9=EC=8B=9D?= =?UTF-8?q?=EC=9C=BC=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/home/learning/page.tsx | 5 +++++ src/hooks/quiz/useGetTodayParticipants.tsx | 10 ++++++++++ 2 files changed, 15 insertions(+) create mode 100644 src/hooks/quiz/useGetTodayParticipants.tsx diff --git a/src/app/home/learning/page.tsx b/src/app/home/learning/page.tsx index 4ffeca4e..b385a59e 100644 --- a/src/app/home/learning/page.tsx +++ b/src/app/home/learning/page.tsx @@ -1,4 +1,5 @@ import { getUserPrecedence } from '@/api/auth/skill' +import { getTodayParticipants } from '@/api/quiz' import { getTodayWords } from '@/api/words' import CommunicationStats from '@/components/domain/home/learning/CommunicationStats' import TodayQuiz from '@/components/domain/home/learning/TodayQuiz' @@ -13,6 +14,10 @@ export default async function LearningTab() { const queryClient = new QueryClient() await Promise.all([ + queryClient.prefetchQuery({ + queryKey: ['today', 'participants'], + queryFn: getTodayParticipants, + }), queryClient.prefetchQuery({ queryKey: ['words', 'today'], queryFn: getTodayWords, diff --git a/src/hooks/quiz/useGetTodayParticipants.tsx b/src/hooks/quiz/useGetTodayParticipants.tsx new file mode 100644 index 00000000..5980539a --- /dev/null +++ b/src/hooks/quiz/useGetTodayParticipants.tsx @@ -0,0 +1,10 @@ +import { getTodayParticipants } from '@/api/quiz' +import { useQuery } from '@tanstack/react-query' + +export const useGetTodayParticipants = () => { + const { data: participants } = useQuery({ + queryKey: ['today', 'participants'], + queryFn: getTodayParticipants, + }) + return { participants } +} From 861bc04947b640d399321f726d57eb8d3cddf13b Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Tue, 8 Oct 2024 17:31:35 +0900 Subject: [PATCH 14/16] =?UTF-8?q?feat:=20skipLogin=20=EC=97=AC=EB=B6=80=20?= =?UTF-8?q?localStorage=EB=A1=9C=20=EA=B4=80=EB=A6=AC=20=EB=B0=8F=20?= =?UTF-8?q?=EC=A0=84=EC=97=AD=20=EC=83=81=ED=83=9C=20userId=20=EA=B0=92?= =?UTF-8?q?=EC=97=90=20=EB=94=B0=EB=A5=B8=20UI=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/BottomSheet/index.tsx | 4 +- .../CommunicationStats/TotalChart.tsx | 2 +- .../learning/CommunicationStats/index.tsx | 20 ++-- .../domain/home/learning/TodayQuiz/index.tsx | 96 ++++++++++++------- .../shared/LoginBottomSheet/index.tsx | 8 +- 5 files changed, 83 insertions(+), 47 deletions(-) diff --git a/src/components/common/BottomSheet/index.tsx b/src/components/common/BottomSheet/index.tsx index 531c8b32..5761ada6 100644 --- a/src/components/common/BottomSheet/index.tsx +++ b/src/components/common/BottomSheet/index.tsx @@ -8,10 +8,10 @@ export default function BottomSheet({ children }: BottomSheetType) { return ( <>
-
+
{children}
diff --git a/src/components/domain/home/learning/CommunicationStats/TotalChart.tsx b/src/components/domain/home/learning/CommunicationStats/TotalChart.tsx index 99cb335c..4c8fd3fe 100644 --- a/src/components/domain/home/learning/CommunicationStats/TotalChart.tsx +++ b/src/components/domain/home/learning/CommunicationStats/TotalChart.tsx @@ -1,7 +1,7 @@ import ChartProgressBar from './ChartProgressBar' type TotalChartProps = { - topPercent: number + topPercent: number | '??' percent: number } diff --git a/src/components/domain/home/learning/CommunicationStats/index.tsx b/src/components/domain/home/learning/CommunicationStats/index.tsx index d6d8f712..bb9f1228 100644 --- a/src/components/domain/home/learning/CommunicationStats/index.tsx +++ b/src/components/domain/home/learning/CommunicationStats/index.tsx @@ -1,14 +1,17 @@ 'use client' -import useGetPrecedence from '@/hooks/auth/useGetSkill' +import { useGetPrecedence } from '@/hooks/auth/useGetSkill' import CategoryChartItem from './CategoryChartItem' import TotalChart from './TotalChart' import { StatsInfo } from './data' +import { useAuthStore } from '@/store/useAuthStore' export type Category = 'develop' | 'design' | 'business' const categories: Category[] = ['develop', 'design', 'business'] export default function CommunicationStats() { + const { userId } = useAuthStore() const { precedence } = useGetPrecedence() + return ( <>
@@ -16,13 +19,14 @@ export default function CommunicationStats() {

나의 업무 소통 능력치 📊

- 용어 퀴즈로 단어를 학습하고
- 소통 능력치를 높일 수 있어요. + {userId + ? '용어 퀴즈로 단어를 학습하고 소통 능력치를 높일 수 있어요.' + : '로그인을 하고 나의 업무 소통\n능력치를 확인해보세요!'}

@@ -30,9 +34,9 @@ export default function CommunicationStats() { ))}
diff --git a/src/components/domain/home/learning/TodayQuiz/index.tsx b/src/components/domain/home/learning/TodayQuiz/index.tsx index 8ca76bf3..9308bc49 100644 --- a/src/components/domain/home/learning/TodayQuiz/index.tsx +++ b/src/components/domain/home/learning/TodayQuiz/index.tsx @@ -1,46 +1,72 @@ -import { getTodayParticipants } from '@/api/quiz' +'use client' import Button from '@/components/common/Button' +import LoginBottomSheet from '@/components/shared/LoginBottomSheet' +import { useGetTodayParticipants } from '@/hooks/quiz/useGetTodayParticipants' +import { useAuthStore } from '@/store/useAuthStore' +import useUIStore from '@/store/useUIStore' import { getTodayDate } from '@/utils/date' import Image from 'next/image' -import Link from 'next/link' +import { useRouter } from 'next/navigation' +import { useEffect, useState } from 'react' -export default async function TodayQuiz() { - const res = await getTodayParticipants() +export default function TodayQuiz() { + const { participants } = useGetTodayParticipants() + const { userId } = useAuthStore() + const { bottomSheetType, openBottomSheet } = useUIStore() + const router = useRouter() + const [skipLogin, setSkipLogin] = useState(null) + + useEffect(() => { + if (typeof window === undefined) return + setSkipLogin(localStorage.getItem('skipLogin')) + if (!userId && skipLogin === 'false') { + openBottomSheet('login') + } + }, [userId, openBottomSheet, skipLogin]) + + const handleClick = () => { + if (!userId) { + openBottomSheet('login') + return + } + router.push('/') // quiz url로 변경 + } return ( -
-

- {getTodayDate() + ' '} - 용어 퀴즈💫 -

-
-
-

용어 퀴즈

-

- 오늘  - {res} - 명이 퀴즈에 -
- 참여했어요. -

- - - +
+ quiz_img
- quiz_img
-
+ + ) } diff --git a/src/components/shared/LoginBottomSheet/index.tsx b/src/components/shared/LoginBottomSheet/index.tsx index 6870482b..62d46481 100644 --- a/src/components/shared/LoginBottomSheet/index.tsx +++ b/src/components/shared/LoginBottomSheet/index.tsx @@ -12,6 +12,12 @@ export type BottomSheetProps = { export default function LoginBottomSheet({ isOpen, type }: BottomSheetProps) { const { closeBottomSheet } = useUIStore() + const handleSkipLogin = () => { + if (typeof window !== undefined) { + localStorage.setItem('skipLogin', 'true') + closeBottomSheet() + } + } if (!isOpen) return null const { title, description, imgSrc } = LOGIN_BOTTOMSHEET[type] @@ -31,7 +37,7 @@ export default function LoginBottomSheet({ isOpen, type }: BottomSheetProps) { )}
+ ) } diff --git a/src/components/domain/home/Header/index.tsx b/src/components/domain/home/Header/index.tsx index 36c03f61..a3cb097d 100644 --- a/src/components/domain/home/Header/index.tsx +++ b/src/components/domain/home/Header/index.tsx @@ -1,9 +1,11 @@ +'use client' import Image from 'next/image' import Link from 'next/link' import LoginButton from './LoginButton' +import { useAuthStore } from '@/store/useAuthStore' export default function Header() { - const isLoginUser = true + const { userId } = useAuthStore() return (
@@ -12,18 +14,17 @@ export default function Header() { 검색 - {isLoginUser ? ( + {userId ? ( - {/* 마이페이지 */} -
+ /> ) : ( From c4993b3eff80c097cd89302c5fd894d95bc3eb99 Mon Sep 17 00:00:00 2001 From: lsy20140 Date: Tue, 8 Oct 2024 18:00:58 +0900 Subject: [PATCH 16/16] =?UTF-8?q?fix:=20LoginBottomSheet=20type=20?= =?UTF-8?q?=EC=B6=A9=EB=8F=8C=20=EB=AC=B8=EC=A0=9C=20type=20state=EB=A1=9C?= =?UTF-8?q?=20=EA=B4=80=EB=A6=AC=ED=95=98=EC=97=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../domain/home/learning/TodayQuiz/index.tsx | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/domain/home/learning/TodayQuiz/index.tsx b/src/components/domain/home/learning/TodayQuiz/index.tsx index 9308bc49..28a1afba 100644 --- a/src/components/domain/home/learning/TodayQuiz/index.tsx +++ b/src/components/domain/home/learning/TodayQuiz/index.tsx @@ -15,18 +15,23 @@ export default function TodayQuiz() { const { bottomSheetType, openBottomSheet } = useUIStore() const router = useRouter() const [skipLogin, setSkipLogin] = useState(null) + const [loginSheetType, setLoginSheetType] = useState< + 'loginBtn' | 'learningTab' + >('loginBtn') useEffect(() => { if (typeof window === undefined) return setSkipLogin(localStorage.getItem('skipLogin')) if (!userId && skipLogin === 'false') { openBottomSheet('login') + setLoginSheetType('learningTab') } - }, [userId, openBottomSheet, skipLogin]) + }, [skipLogin, openBottomSheet, userId]) const handleClick = () => { if (!userId) { openBottomSheet('login') + setLoginSheetType('loginBtn') return } router.push('/') // quiz url로 변경 @@ -66,7 +71,10 @@ export default function TodayQuiz() { />
- + ) }