From ed404c74cfca9a1b09e4c3762942c7d175939b77 Mon Sep 17 00:00:00 2001 From: Enes Kutay SEZEN Date: Mon, 12 Jan 2026 15:02:09 +0300 Subject: [PATCH 1/3] Pass callbacks to product card --- spec/components/Carousel/Carousel.test.tsx | 39 ++++++++++++++++++++++ src/components/carousel.tsx | 13 ++++++-- src/types/carouselTypes.ts | 7 ++++ 3 files changed, 57 insertions(+), 2 deletions(-) diff --git a/spec/components/Carousel/Carousel.test.tsx b/spec/components/Carousel/Carousel.test.tsx index 9adcff8..fd0282a 100644 --- a/spec/components/Carousel/Carousel.test.tsx +++ b/spec/components/Carousel/Carousel.test.tsx @@ -536,4 +536,43 @@ describe('Carousel component', () => { expect(carousel).toBeInTheDocument(); }); }); + + describe('itemCallbacks', () => { + test('calls onProductClick when product card is clicked', () => { + const onProductClick = vi.fn(); + render(); + + const productCard = screen.getByText('Product 1').closest('.cio-product-card')!; + fireEvent.click(productCard); + expect(onProductClick).toHaveBeenCalledWith(mockProducts[0], 0); + }); + + test('calls onAddToCart when add to cart button is clicked', () => { + const onAddToCart = vi.fn(); + render(); + + const buttons = screen.getAllByText('Add to Cart'); + fireEvent.click(buttons[0]); + expect(onAddToCart).toHaveBeenCalledWith(expect.any(Object), mockProducts[0], 0); + }); + + test('calls onAddToWishlist when wishlist button is clicked', () => { + const onAddToWishlist = vi.fn(); + render(); + + const wishlistButtons = screen.getAllByLabelText(/add to wishlist/i); + fireEvent.click(wishlistButtons[0]); + expect(onAddToWishlist).toHaveBeenCalledWith(expect.any(Object), mockProducts[0], 0); + }); + + test('does not throw when itemCallbacks is not provided', () => { + expect(() => { + render(); + + // Without callbacks, clicking should not throw (buttons won't exist) + const productCard = screen.getByText('Product 1').closest('.cio-product-card')!; + fireEvent.click(productCard); + }).not.toThrow(); + }); + }); }); diff --git a/src/components/carousel.tsx b/src/components/carousel.tsx index 4dc3592..d3af83f 100644 --- a/src/components/carousel.tsx +++ b/src/components/carousel.tsx @@ -181,7 +181,8 @@ function CarouselBase({ } function Carousel(props: CarouselOpts) { - const { children, items, componentOverrides, ...rest } = props; + const { children, items, componentOverrides, itemCallbacks, ...rest } = props; + const { onProductClick, onAddToCart, onAddToWishlist } = itemCallbacks || {}; const { autoPlay, slidesToScroll, orientation, loop, responsive } = rest; const renderProps: CarouselRenderProps = { @@ -222,7 +223,15 @@ function Carousel(props: CarouselOpts) { return ( - + onProductClick(item, index) : undefined} + onAddToCart={onAddToCart ? (e) => onAddToCart(e, item, index) : undefined} + onAddToWishlist={ + onAddToWishlist ? (e) => onAddToWishlist(e, item, index) : undefined + } + /> ); })} diff --git a/src/types/carouselTypes.ts b/src/types/carouselTypes.ts index 8aa5570..05bf53d 100644 --- a/src/types/carouselTypes.ts +++ b/src/types/carouselTypes.ts @@ -71,8 +71,15 @@ export type CarouselOverrides = ComponentOverrideProps>; }; +export type CarouselItemCallbacks = { + onProductClick?: (item: T, index: number) => void; + onAddToCart?: (e: React.MouseEvent, item: T, index: number) => void; + onAddToWishlist?: (e: React.MouseEvent, item: T, index: number) => void; +}; + export type CarouselOpts = CarouselRenderProps & IncludeComponentOverrides> & Omit, 'children'> & { children?: RenderPropsChildren>; + itemCallbacks?: CarouselItemCallbacks; }; From a1a634ecc01cae36bf08e983f16a90c9a47ee418 Mon Sep 17 00:00:00 2001 From: Enes Kutay SEZEN Date: Mon, 12 Jan 2026 15:22:43 +0300 Subject: [PATCH 2/3] Update src/components/carousel.tsx Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- src/components/carousel.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/carousel.tsx b/src/components/carousel.tsx index d3af83f..1d82235 100644 --- a/src/components/carousel.tsx +++ b/src/components/carousel.tsx @@ -226,10 +226,10 @@ function Carousel(props: CarouselOpts) { onProductClick(item, index) : undefined} - onAddToCart={onAddToCart ? (e) => onAddToCart(e, item, index) : undefined} + onProductClick={onProductClick ? () => onProductClick(product, index) : undefined} + onAddToCart={onAddToCart ? (e) => onAddToCart(e, product, index) : undefined} onAddToWishlist={ - onAddToWishlist ? (e) => onAddToWishlist(e, item, index) : undefined + onAddToWishlist ? (e) => onAddToWishlist(e, product, index) : undefined } /> From ca50b020cfe4159f0375ce06f67e0271f3c34567 Mon Sep 17 00:00:00 2001 From: Enes Kutay SEZEN Date: Tue, 20 Jan 2026 16:15:50 +0300 Subject: [PATCH 3/3] Revert copilot change --- src/components/carousel.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/carousel.tsx b/src/components/carousel.tsx index 1d82235..d3af83f 100644 --- a/src/components/carousel.tsx +++ b/src/components/carousel.tsx @@ -226,10 +226,10 @@ function Carousel(props: CarouselOpts) { onProductClick(product, index) : undefined} - onAddToCart={onAddToCart ? (e) => onAddToCart(e, product, index) : undefined} + onProductClick={onProductClick ? () => onProductClick(item, index) : undefined} + onAddToCart={onAddToCart ? (e) => onAddToCart(e, item, index) : undefined} onAddToWishlist={ - onAddToWishlist ? (e) => onAddToWishlist(e, product, index) : undefined + onAddToWishlist ? (e) => onAddToWishlist(e, item, index) : undefined } />