Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Carousel 추가 #82

Merged
merged 4 commits into from
Nov 6, 2023
Merged

Carousel 추가 #82

merged 4 commits into from
Nov 6, 2023

Conversation

hae-on
Copy link
Collaborator

@hae-on hae-on commented Nov 3, 2023

Issue

✨ 구현한 기능

�Carousel을 추가하였습니다.

📢 논의하고 싶은 내용

일단 있는그대로 붙였는데

export interface CarouselProps {
  carouselList: CarouselChildren[];
}

이 부분 import 하지말고

export interface CarouselChildren {
  id: number;
  children: ReactNode;
}

이렇게 바로 써야할까요?
뭐가 좋은지 몰라서 여쭈어봅니다.
일단 그래서 JSDocs랑 README 다 안 적었어요.

디자인 시스템에 너무 뭐가 없어서 �Carousel 끼워넣긴 했는데
또 넣다보니 넣는게 맞나 생각도 드네욤
토스트는 넣는거 어때요?
많은 의견 주세요!

🎸 기타

x

Copy link
Member

@xodms0309 xodms0309 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해옹 리뷰 확인 부탁드립니다~~

Comment on lines 5 to 6
import { RecipeItem } from '@/components/Recipe';
import mockRecipe from '@/mocks/data/recipes.json';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이거 두 개 import 안되지 않나요?!

src/types.ts Outdated
Comment on lines 10 to 13
export interface CarouselChildren {
id: number;
children: ReactNode;
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해온 의견대로 굳이 import 안하고 해당 컴포넌트에서 정의해도 써도 될 것 같아요

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

저도 동의합니다.!

Comment on lines 35 to 51
export const RecipeRanking: Story = {
args: {
carouselList: [
{
id: 0,
children: <RecipeItem recipe={mockRecipe.recipes[0]} />,
},
{
id: 1,
children: <RecipeItem recipe={mockRecipe.recipes[1]} />,
},
{
id: 2,
children: <RecipeItem recipe={mockRecipe.recipes[2]} />,
},
],
},
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

어차피 여기는 공통 컴포넌트를 작성하는 곳이라 얘도 지워도 될 것 같아요! 얘는 우리 도메인 관련이니까!

import mockRecipe from '@/mocks/data/recipes.json';

const meta: Meta<typeof Carousel> = {
title: 'common/Carousel',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

디자인 시스템에서는 title을 그냥 컴포넌트 이름으로 줬었네요!

Copy link
Collaborator

@Leejin-Yang Leejin-Yang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

토스트나 캐러셀 둘 다 공통으로 사용할 수 있으니 옮겨도 좋다고 생각합니다!
타미가 달은 코멘트만 확인해주세요~

src/types.ts Outdated
Comment on lines 10 to 13
export interface CarouselChildren {
id: number;
children: ReactNode;
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

저도 동의합니다.!

@hae-on
Copy link
Collaborator Author

hae-on commented Nov 5, 2023

@xodms0309 @Leejin-Yang

type에서 import 하던거 빼고 바로 Carousel 컴포넌트에서 받도록 했습니다.

리드미도 확인해주세요!
스토리북 문서대로 이렇게 적을까 하다가 우리도 map으로 쓰길래

    carouselList: [
      {
        id: 0,
        children: <div>1</div>,
      },
      {
        id: 1,
        children: <div>2</div>,
      },
      {
        id: 2,
        children: <div>3</div>,
      },
    ],

이렇게 바꿨거든요? 혹시 맘에 안들면 말해주세욤

const carouselList = [0, 1, 2].map((index) => ({
  id: index,
  children: <div>{index}</div>,
}));

Copy link
Member

@xodms0309 xodms0309 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

조하요 고생했어요 해온!!!

@hae-on hae-on merged commit b8abbad into main Nov 6, 2023
2 of 3 checks passed
@hae-on hae-on deleted the feat/issue-79 branch November 6, 2023 14:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Carousel 옮기기
3 participants