feat: implement carousel navigation buttons for improved user interaction

2025-03-02 20:08:03 +07:00
parent 82c0894ccd
commit cd3637bf03
3 changed files with 89 additions and 36 deletions
@@ -0,0 +1,24 @@
+import { CarouselNextIcon } from '~/components/icons/carousel-next'
+import { CarouselPreviousIcon } from '~/components/icons/carousel-previous'
+
+type TCarouselButton = {
+  direction: 'prev' | 'next'
+  isEnabled: boolean
+  onClick: () => void
+}
+export const CarouselButton = ({
+  direction,
+  isEnabled,
+  onClick,
+}: TCarouselButton) => {
+  const Icon = direction === 'prev' ? CarouselPreviousIcon : CarouselNextIcon
+  return (
+    <Icon
+      color={isEnabled ? '#2E2F7C' : '#DCDCDC'}
+      className={isEnabled ? 'cursor-pointer' : 'cursor-not-allowed'}
+      width={45}
+      height={45}
+      onClick={onClick}
+    />
+  )
+}