From d32e4524e5e38d6ca5657d96786f67ee611b64d6 Mon Sep 17 00:00:00 2001 From: Kim Min-gyu <99083803+cobocho@users.noreply.github.com> Date: Thu, 13 Jun 2024 01:13:33 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20=EC=8A=A4=ED=86=A0=EB=A6=AC=EB=B6=81=20?= =?UTF-8?q?=EB=8D=B0=EC=BD=94=EB=A0=88=EC=9D=B4=ED=84=B0=EB=A5=BC=20?= =?UTF-8?q?=EC=9B=8C=ED=81=AC=EC=83=B5=EC=97=90=EC=84=9C=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=ED=95=98=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../SearchWindow/SearchWindow.stories.tsx | 5 +--- .../components/TermItem/TermItem.stories.tsx | 25 +++++++++++++------ .../OnboardingHeader/OnboardingHeader.tsx | 2 ++ .../onboarding/funnel/page.stories.tsx | 16 ++++++------ .../onboarding/job/page.stories.tsx | 15 +++-------- .../SignUpForm/SignUpForm.stories.tsx | 16 +++--------- apps/workshop/.storybook/manager.ts | 1 - .../.storybook/{preview.ts => preview.tsx} | 15 +++++++++++ apps/workshop/package.json | 2 ++ pnpm-lock.yaml | 6 +++++ 10 files changed, 56 insertions(+), 47 deletions(-) rename apps/workshop/.storybook/{preview.ts => preview.tsx} (53%) diff --git a/apps/extension/components/SearchWindow/SearchWindow.stories.tsx b/apps/extension/components/SearchWindow/SearchWindow.stories.tsx index a9d7b70..deba47a 100644 --- a/apps/extension/components/SearchWindow/SearchWindow.stories.tsx +++ b/apps/extension/components/SearchWindow/SearchWindow.stories.tsx @@ -1,5 +1,4 @@ import type { Meta, StoryObj } from '@storybook/react' -import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { SearchWindow } from './SearchWindow' @@ -14,9 +13,7 @@ const meta = { height: '600px', }} > - - - + ), ], diff --git a/apps/extension/components/TermItem/TermItem.stories.tsx b/apps/extension/components/TermItem/TermItem.stories.tsx index b24c03f..a6ac146 100644 --- a/apps/extension/components/TermItem/TermItem.stories.tsx +++ b/apps/extension/components/TermItem/TermItem.stories.tsx @@ -13,13 +13,13 @@ const meta = { '서버는 네트워크에 연결된 컴퓨터로 클라이언트의 요청을 받아 처리하고 결과를 응답으로 보냅니다. 웹 서버, 데이터 베이스 서버, 메일 서버 등이 서버에 속합니다.', }, }, - decorators: [ - (Story) => ( -
- -
- ), - ], + argTypes: { + term: { + control: { + type: 'object', + }, + }, + }, tags: ['autodocs'], } satisfies Meta @@ -27,4 +27,13 @@ export default meta type Story = StoryObj -export const Preview: Story = {} +export const Preview: Story = { + args: { + term: { + term: '서버', + synonyms: 'Server', + meaning: + '서버는 네트워크에 연결된 컴퓨터로 클라이언트의 요청을 받아 처리하고 결과를 응답으로 보냅니다. 웹 서버, 데이터 베이스 서버, 메일 서버 등이 서버에 속합니다.', + }, + }, +} diff --git a/apps/web/src/app/(onboarding)/onboarding/_components/OnboardingHeader/OnboardingHeader.tsx b/apps/web/src/app/(onboarding)/onboarding/_components/OnboardingHeader/OnboardingHeader.tsx index 6096bd8..68b7996 100644 --- a/apps/web/src/app/(onboarding)/onboarding/_components/OnboardingHeader/OnboardingHeader.tsx +++ b/apps/web/src/app/(onboarding)/onboarding/_components/OnboardingHeader/OnboardingHeader.tsx @@ -1,3 +1,5 @@ +'use client' + import { Step, Text } from '@vook-client/design-system' import { onboardingHeader, stepArea } from './OnboardingHeader.css' diff --git a/apps/web/src/app/(onboarding)/onboarding/funnel/page.stories.tsx b/apps/web/src/app/(onboarding)/onboarding/funnel/page.stories.tsx index c0ce81b..29e770c 100644 --- a/apps/web/src/app/(onboarding)/onboarding/funnel/page.stories.tsx +++ b/apps/web/src/app/(onboarding)/onboarding/funnel/page.stories.tsx @@ -5,20 +5,12 @@ import { OnBoardingProvider } from '../_context/useOnboarding' import OnboardingFunnel from './page' -const meta = { +const meta: Meta = { title: 'OnboardingFunnel', component: OnboardingFunnel, parameters: { layout: 'centered', - msw: {}, }, -} satisfies Meta - -export default meta - -type Story = StoryObj - -export const Preview: Story = { decorators: [ (Story) => ( @@ -27,3 +19,9 @@ export const Preview: Story = { ), ], } + +export default meta + +type Story = StoryObj + +export const Preview: Story = {} diff --git a/apps/web/src/app/(onboarding)/onboarding/job/page.stories.tsx b/apps/web/src/app/(onboarding)/onboarding/job/page.stories.tsx index d7c6f7f..c9bbd59 100644 --- a/apps/web/src/app/(onboarding)/onboarding/job/page.stories.tsx +++ b/apps/web/src/app/(onboarding)/onboarding/job/page.stories.tsx @@ -1,10 +1,5 @@ -import { - AppRouterContext, - type AppRouterInstance, -} from 'next/dist/shared/lib/app-router-context.shared-runtime' import React from 'react' import type { Meta, StoryObj } from '@storybook/react' -import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { OnBoardingProvider } from '../_context/useOnboarding' @@ -18,13 +13,9 @@ const meta: Meta = { }, decorators: [ (Story) => ( - - - - - - - + + + ), ], } diff --git a/apps/web/src/components/SignUpForm/SignUpForm.stories.tsx b/apps/web/src/components/SignUpForm/SignUpForm.stories.tsx index c3f8ee4..7004f17 100644 --- a/apps/web/src/components/SignUpForm/SignUpForm.stories.tsx +++ b/apps/web/src/components/SignUpForm/SignUpForm.stories.tsx @@ -1,9 +1,4 @@ -import { - AppRouterContext, - type AppRouterInstance, -} from 'next/dist/shared/lib/app-router-context.shared-runtime' import type { Meta, StoryObj } from '@storybook/react' -import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { SignUpForm } from './SignUpForm' @@ -13,16 +8,11 @@ const meta: Meta = { layout: 'centered', }, component: SignUpForm, - tags: ['autodocs'], decorators: [ (Story) => ( - - -
- -
-
-
+
+ +
), ], } diff --git a/apps/workshop/.storybook/manager.ts b/apps/workshop/.storybook/manager.ts index 36cd16b..6e3e837 100644 --- a/apps/workshop/.storybook/manager.ts +++ b/apps/workshop/.storybook/manager.ts @@ -1,5 +1,4 @@ import { addons } from '@storybook/manager-api' -import { themes } from '@storybook/theming' import { create } from '@storybook/theming/create' addons.setConfig({ diff --git a/apps/workshop/.storybook/preview.ts b/apps/workshop/.storybook/preview.tsx similarity index 53% rename from apps/workshop/.storybook/preview.ts rename to apps/workshop/.storybook/preview.tsx index e0afe55..5eda6de 100644 --- a/apps/workshop/.storybook/preview.ts +++ b/apps/workshop/.storybook/preview.tsx @@ -7,6 +7,12 @@ import { initialize, mswLoader } from 'msw-storybook-addon' import { Preview } from '@storybook/react' +import { QueryClient, QueryClientProvider } from '@tanstack/react-query' +import { + AppRouterContext, + type AppRouterInstance, +} from 'next/dist/shared/lib/app-router-context.shared-runtime' + initialize() const preview: Preview = { @@ -24,6 +30,15 @@ const preview: Preview = { }, }, loaders: [mswLoader], + decorators: [ + (Story) => ( + + + + + + ), + ], } export default preview diff --git a/apps/workshop/package.json b/apps/workshop/package.json index a025de2..2951016 100644 --- a/apps/workshop/package.json +++ b/apps/workshop/package.json @@ -9,8 +9,10 @@ "build-storybook": "storybook build" }, "dependencies": { + "@tanstack/react-query": "^5.32.0", "@vook-client/api": "*", "@vook-client/design-system": "*", + "next": "^14.1.1", "react": "^18.3.1", "react-dom": "^18.3.1" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c1cdfe5..9751b6c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -243,12 +243,18 @@ importers: apps/workshop: dependencies: + '@tanstack/react-query': + specifier: ^5.32.0 + version: 5.37.1(react@18.3.1) '@vook-client/api': specifier: '*' version: link:../../packages/api '@vook-client/design-system': specifier: '*' version: link:../../packages/design-system + next: + specifier: ^14.1.1 + version: 14.2.3(@babel/core@7.23.7)(react-dom@18.3.1)(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1