From 8af3ea34668ab83e71de28855dec52fd9d65504c Mon Sep 17 00:00:00 2001 From: six-standard Date: Sun, 9 Feb 2025 12:15:01 +0900 Subject: [PATCH 1/7] =?UTF-8?q?hotfix:=20=EC=9D=BC=EB=B6=80=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95=20username=20=EA=B4=80=EB=A0=A8?= =?UTF-8?q?=20=EC=98=A4=EB=A5=98=20=EB=B0=8F=20SSR=20=EB=A0=8C=EB=8D=94?= =?UTF-8?q?=EB=A6=B0=20=EA=B4=80=EB=A0=A8=20=EC=98=A4=EB=A5=98=EB=A1=9C=20?= =?UTF-8?q?=EC=B6=94=EC=A0=95=EB=90=98=EB=8A=94=20=EC=98=A4=EB=A5=98=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../(with-tracker)/(auth-required)/layout.tsx | 3 +-- .../(with-tracker)/(auth-required)/main/page.tsx | 7 ++----- .../auth-required/main/Section/Graph.tsx | 16 +++------------- .../auth-required/main/Section/index.tsx | 8 +++----- 4 files changed, 9 insertions(+), 25 deletions(-) diff --git a/src/app/(with-tracker)/(auth-required)/layout.tsx b/src/app/(with-tracker)/(auth-required)/layout.tsx index 1067058..bef154c 100644 --- a/src/app/(with-tracker)/(auth-required)/layout.tsx +++ b/src/app/(with-tracker)/(auth-required)/layout.tsx @@ -3,7 +3,6 @@ import { dehydrate, HydrationBoundary } from '@tanstack/react-query'; import { cookies } from 'next/headers'; import { Header } from '@/components'; import { PATHS } from '@/constants'; -import { getCookieForAuth } from '@/utils/cookieUtil'; import { me } from '@/apis'; import { getQueryClient } from '@/utils/queryUtil'; @@ -17,7 +16,7 @@ export default async function Layout({ children }: IProp) { await client.prefetchQuery({ queryKey: [PATHS.ME], queryFn: async () => - await me(getCookieForAuth(cookies, ['access_token', 'refresh_token'])), + await me({ headers: { Cookie: cookies().toString() } }), }); return ( diff --git a/src/app/(with-tracker)/(auth-required)/main/page.tsx b/src/app/(with-tracker)/(auth-required)/main/page.tsx index ab424b2..602d6f8 100644 --- a/src/app/(with-tracker)/(auth-required)/main/page.tsx +++ b/src/app/(with-tracker)/(auth-required)/main/page.tsx @@ -3,7 +3,6 @@ import { Metadata } from 'next'; import { cookies } from 'next/headers'; import { PATHS } from '@/constants'; import { postList, postSummary } from '@/apis'; -import { getCookieForAuth } from '@/utils/cookieUtil'; import { getQueryClient } from '@/utils/queryUtil'; import { Content } from './Content'; @@ -26,7 +25,7 @@ export default async function Page({ searchParams }: IProp) { queryKey: [PATHS.POSTS, [searchParams.asc, searchParams.sort]], queryFn: async () => await postList( - getCookieForAuth(cookies, ['access_token', 'refresh_token']), + { headers: { Cookie: cookies().toString() } }, { asc: searchParams.asc === 'true', sort: searchParams.sort || '', @@ -38,9 +37,7 @@ export default async function Page({ searchParams }: IProp) { await client.prefetchQuery({ queryKey: [PATHS.SUMMARY], queryFn: async () => - await postSummary( - getCookieForAuth(cookies, ['access_token', 'refresh_token']), - ), + await postSummary({ headers: { Cookie: cookies().toString() } }), }); return ( diff --git a/src/components/auth-required/main/Section/Graph.tsx b/src/components/auth-required/main/Section/Graph.tsx index 0348d63..ffbba70 100644 --- a/src/components/auth-required/main/Section/Graph.tsx +++ b/src/components/auth-required/main/Section/Graph.tsx @@ -12,13 +12,13 @@ import { Tooltip, Legend, } from 'chart.js'; -import { useQuery, useQueryClient } from '@tanstack/react-query'; -import { useMemo, useState } from 'react'; +import { useQuery } from '@tanstack/react-query'; +import { useState } from 'react'; import { COLORS, PATHS, SCREENS } from '@/constants'; import { Dropdown, Input } from '@/components'; import { useResponsive } from '@/hooks'; import { postDetail } from '@/apis'; -import { PostDetailValue, PostSummaryDto } from '@/types'; +import { PostDetailValue } from '@/types'; ChartJS.register( CategoryScale, @@ -47,14 +47,6 @@ interface IProp { export const Graph = ({ id, releasedAt }: IProp) => { const width = useResponsive(); - const client = useQueryClient(); - const maxDate = useMemo( - () => - ( - client.getQueryData([PATHS.SUMMARY]) as PostSummaryDto - )?.stats.lastUpdatedDate.split('T')[0], - [], - ); const isMBI = width < SCREENS.MBI; @@ -90,7 +82,6 @@ export const Graph = ({ id, releasedAt }: IProp) => { form="SMALL" value={type.start} min={releasedAt.split('T')[0]} - max={maxDate} onChange={(e) => setType({ ...type, start: e.target.value })} placeholder="시작 날짜" type="date" @@ -101,7 +92,6 @@ export const Graph = ({ id, releasedAt }: IProp) => { form="SMALL" value={type.end} min={type.start ? type.start : releasedAt.split('T')[0]} - max={maxDate} onChange={(e) => setType({ ...type, end: e.target.value })} placeholder="종료 날짜" type="date" diff --git a/src/components/auth-required/main/Section/index.tsx b/src/components/auth-required/main/Section/index.tsx index 6292e82..9e678e2 100644 --- a/src/components/auth-required/main/Section/index.tsx +++ b/src/components/auth-required/main/Section/index.tsx @@ -11,10 +11,10 @@ import { Graph } from './Graph'; export const Section = (p: PostType) => { const [open, setOpen] = useState(false); - const client = useQueryClient(); - const { username } = client.getQueryData([PATHS.ME]) as UserDto; + const username = (client.getQueryData([PATHS.ME]) as UserDto)?.username; + const url = `${process.env.NEXT_PUBLIC_VELOG_URL}/@${username || ''}/${p.slug}`; return (
@@ -31,9 +31,7 @@ export const Section = (p: PostType) => { title="해당 글로 바로가기" onClick={(e) => { e.stopPropagation(); - window.open( - `${process.env.NEXT_PUBLIC_VELOG_URL}/@${username}/${p.slug}`, - ); + window.open(url); }} > From 8e8cea94d00346248cbf42bbe8b8fb7a537035eb Mon Sep 17 00:00:00 2001 From: six-standard Date: Sun, 16 Feb 2025 17:16:51 +0900 Subject: [PATCH 2/7] =?UTF-8?q?feat:=20=EC=B1=84=EB=84=90=ED=86=A1=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=ED=97=A4=EB=8D=94=20=EB=A1=9C?= =?UTF-8?q?=EA=B3=A0=20=EB=8F=99=EC=9E=91=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + pnpm-lock.yaml | 8 +++++++ src/app/layout.tsx | 8 ++++--- .../auth-required/header/Section.tsx | 4 ++-- src/components/auth-required/header/index.tsx | 5 +++- src/components/common/ChannelTalkProvider.tsx | 24 +++++++++++++++++++ src/components/common/index.ts | 1 + 7 files changed, 45 insertions(+), 6 deletions(-) create mode 100644 src/components/common/ChannelTalkProvider.tsx diff --git a/package.json b/package.json index 1511097..2cab35a 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "test": "jest" }, "dependencies": { + "@channel.io/channel-web-sdk-loader": "^2.0.0", "@sentry/nextjs": "^8.47.0", "@tanstack/react-query": "^5.61.3", "@tanstack/react-query-devtools": "^5.62.11", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d0df869..1d23805 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,9 @@ importers: .: dependencies: + '@channel.io/channel-web-sdk-loader': + specifier: ^2.0.0 + version: 2.0.0 '@sentry/nextjs': specifier: ^8.47.0 version: 8.47.0(@opentelemetry/core@1.30.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.56.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.30.0(@opentelemetry/api@1.9.0))(next@14.2.18(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)(webpack@5.97.1) @@ -794,6 +797,9 @@ packages: '@bundled-es-modules/tough-cookie@0.1.6': resolution: {integrity: sha512-dvMHbL464C0zI+Yqxbz6kZ5TOEp7GLW+pry/RWndAR8MJQAXZ2rPmIs8tziTZjeIyhSNZgZbCePtfSbdWqStJw==} + '@channel.io/channel-web-sdk-loader@2.0.0': + resolution: {integrity: sha512-Z8DDpf2lAaYr/3aAnwQtxg0L8MYWgi/hhGV8c5/SLCV6Fx5Gssj7mfyHHrCVC315B0icmLYqZsXBlmbf6cN8Jg==} + '@cspotcode/source-map-support@0.8.1': resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==} engines: {node: '>=12'} @@ -5524,6 +5530,8 @@ snapshots: '@types/tough-cookie': 4.0.5 tough-cookie: 4.1.4 + '@channel.io/channel-web-sdk-loader@2.0.0': {} + '@cspotcode/source-map-support@0.8.1': dependencies: '@jridgewell/trace-mapping': 0.3.9 diff --git a/src/app/layout.tsx b/src/app/layout.tsx index e748e00..0c9c449 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -5,7 +5,7 @@ import * as sentry from '@sentry/nextjs'; import type { Metadata } from 'next'; import { ReactNode } from 'react'; import './globals.css'; -import { QueryProvider } from '@/components'; +import { ChannelTalkProvider, QueryProvider } from '@/components'; export const metadata: Metadata = { title: 'Velog Dashboard', @@ -23,8 +23,10 @@ export default function RootLayout({ - - {children} + + + {children} + diff --git a/src/components/auth-required/header/Section.tsx b/src/components/auth-required/header/Section.tsx index 9a46851..b61ad7f 100644 --- a/src/components/auth-required/header/Section.tsx +++ b/src/components/auth-required/header/Section.tsx @@ -24,13 +24,13 @@ type PropType = T extends 'link' ? Partial & { clickType: 'function'; action: () => void; - children: React.ReactNode | React.ReactNode[]; + children: React.ReactNode; } : T extends 'none' ? Partial & { clickType: 'none'; action?: undefined; - children: React.ReactNode | React.ReactNode[]; + children: React.ReactNode; } : never; diff --git a/src/components/auth-required/header/index.tsx b/src/components/auth-required/header/index.tsx index 3e63fa9..983f563 100644 --- a/src/components/auth-required/header/index.tsx +++ b/src/components/auth-required/header/index.tsx @@ -62,7 +62,10 @@ export const Header = () => { return (