Problems on swipe - Crash Carousel

[gmaiaciteve]

Hello, Im having a problem so sometimes when I swipe left or right it crash with two products in the middle... I dont know what to do!

Normal:

When crash happens:

Error I recieve when swipe after the crash:

[BotDanny]

Hi, I am happy to help. Can you post a code sandbox link to reproduce this crash?

[gmaiaciteve]

Hello. Thanks for reply! I will try to send you something in SandBox

https://codesandbox.io/p/sandbox/teste-npllh5?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clr9gim480006356hmk2fz9pt%2522%252C%2522sizes%2522%253A%255B70%252C30%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clr9gim480002356h2tpre4z2%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clr9gim480003356hl2dkkk8q%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clr9gim480005356h6ykj8irf%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clr9gim480002356h2tpre4z2%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clr9gim470001356hl78znzew%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252Findex.js%2522%257D%255D%252C%2522id%2522%253A%2522clr9gim480002356h2tpre4z2%2522%252C%2522activeTabId%2522%253A%2522clr9gim470001356hl78znzew%2522%257D%252C%2522clr9gim480005356h6ykj8irf%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clr9gim480004356hbfckos8x%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522clr9gim480005356h6ykj8irf%2522%252C%2522activeTabId%2522%253A%2522clr9gim480004356hbfckos8x%2522%257D%252C%2522clr9gim480003356hl2dkkk8q%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clr9gim480003356hl2dkkk8q%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

[BotDanny]

Hi, your code sandbox is not loading correctly. First, you didn't install the dependency and second I got this after installing the dependency manually. Please make sure you code sandbox throws out the exact error you want me to take a look at.

[gmaiaciteve]

Try it now please.

https://codesandbox.io/p/devbox/npllh5?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clr9gim480006356hmk2fz9pt%2522%252C%2522sizes%2522%253A%255B70%252C30%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clr9gim480002356h2tpre4z2%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clr9gim480003356hl2dkkk8q%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clr9gim480005356h6ykj8irf%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B52.023104776136556%252C47.976895223863444%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clr9gim480002356h2tpre4z2%2522%253A%257B%2522id%2522%253A%2522clr9gim480002356h2tpre4z2%2522%252C%2522activeTabId%2522%253A%2522clr9ibiq500up356hmwnfjilx%2522%252C%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clr9hwwln0002356hionmti71%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A2%252C%2522startColumn%2522%253A37%252C%2522endLineNumber%2522%253A2%252C%2522endColumn%2522%253A37%257D%255D%252C%2522filepath%2522%253A%2522%252Fsrc%252FApp.js%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252Fcomponents%252FSlideProducts_carousel.jsx%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A27%252C%2522endLineNumber%2522%253A27%252C%2522startColumn%2522%253A7%252C%2522endColumn%2522%253A100000006%257D%255D%252C%2522id%2522%253A%2522clr9ibiq500up356hmwnfjilx%2522%252C%2522mode%2522%253A%2522permanent%2522%257D%255D%257D%252C%2522clr9gim480005356h6ykj8irf%2522%253A%257B%2522id%2522%253A%2522clr9gim480005356h6ykj8irf%2522%252C%2522activeTabId%2522%253A%2522clr9hyvbb00fg356h0t77vf0q%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522TASK_PORT%2522%252C%2522taskId%2522%253A%2522start%2522%252C%2522port%2522%253A3000%252C%2522id%2522%253A%2522clr9hyvbb00fg356h0t77vf0q%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522path%2522%253A%2522%252F%2522%257D%255D%257D%252C%2522clr9gim480003356hl2dkkk8q%2522%253A%257B%2522id%2522%253A%2522clr9gim480003356hl2dkkk8q%2522%252C%2522activeTabId%2522%253A%2522clr9hz3qn00i4356hzf8ddsid%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522TASK_LOG%2522%252C%2522taskId%2522%253A%2522start%2522%252C%2522id%2522%253A%2522clr9hxuhh004h356h1k4sxd6g%2522%252C%2522mode%2522%253A%2522permanent%2522%257D%252C%257B%2522id%2522%253A%2522clr9hz3qn00i4356hzf8ddsid%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522TERMINAL%2522%252C%2522shellId%2522%253A%2522clr9hz3tu000uedhpcpvihkxt%2522%257D%255D%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

[gmaiaciteve]

Also I dont know how to do it but I need the product on the left and on the right of the Centered product to be clickable too. Before we redirect to the product page, we need to center the product when clicked.

[BotDanny]

Thanks, I will take a look soon

[BotDanny]

Hello, thanks for reporting this bug. This has been fixed in the latest version of 1.0.14. If you update the package to this latest version then you should be good to go.

[gmaiaciteve]

Hello! I updated to the last version, but I still can get the bug!

[gmaiaciteve]

this is what happened after a swipe to left

Then, if I continue swipe it will crash like that:

[BotDanny]

Please make sure to update to the latest version and re-start your local. If it still doesn't work, post a code sandbox link to reproduce it.

[gmaiaciteve]

How can I implement something that center the product clicked when we click on the product that is immediately on left or right of the centered one ?

[gmaiaciteve]

No help neede anymore. I got it with the swipeTo()