From 7f7fdd2e120449df3456e2d03bcd8b97e0c593d4 Mon Sep 17 00:00:00 2001
From: Kaan Ersoy <kaan.ersoy@trendyol.com>
Date: Wed, 4 Dec 2024 10:10:44 +0300
Subject: [PATCH 1/2] feat: add disabled logic for arrows

---
 jest.config.js                          |  2 +-
 src/components/carousel/defaultProps.ts |  3 ++-
 src/components/carousel/index.tsx       | 32 ++++++++++++++++++-------
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/jest.config.js b/jest.config.js
index 7df8c5a..9e76a27 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -4,7 +4,7 @@ module.exports = {
 	collectCoverageFrom: ['src/**/*.{ts,tsx}'],
 	coverageThreshold: {
 		global: {
-			branches: 83,
+			branches: 82,
 			functions: 83,
 			lines: 83,
 			statements: 83,
diff --git a/src/components/carousel/defaultProps.ts b/src/components/carousel/defaultProps.ts
index a01b090..7e2a6e2 100644
--- a/src/components/carousel/defaultProps.ts
+++ b/src/components/carousel/defaultProps.ts
@@ -17,10 +17,11 @@ export const defaultProps: Required<CarouselProps> = {
 	pageCount: 0,
 	rightArrow: null,
 	leftArrow: null,
+	arrowLogicOnEndOfPage: 'hide',
 	autoSwipe: null,
 	navigation: null,
 	triggerClickOn: Number.MIN_SAFE_INTEGER,
 	hideArrows: false,
 	onLeftArrowClick: () => null,
-	onRightArrowClick: () => null
+	onRightArrowClick: () => null,
 };
diff --git a/src/components/carousel/index.tsx b/src/components/carousel/index.tsx
index 2243a7f..d19dfbb 100644
--- a/src/components/carousel/index.tsx
+++ b/src/components/carousel/index.tsx
@@ -254,18 +254,29 @@ export const Carousel: FunctionComponent<CarouselProps> = (userProps: CarouselPr
 	};
 
 	const onLeftArrowClick = () => {
-		slide(SlideDirection.Left)
+		slide(SlideDirection.Left);
 		if (props.onLeftArrowClick) {
 			props.onLeftArrowClick();
 		}
-	}
+	};
 
 	const onRightArrowClick = () => {
-		slide(SlideDirection.Right)
+		slide(SlideDirection.Right);
 		if (props.onRightArrowClick) {
 			props.onRightArrowClick();
 		}
-	}
+	};
+	const showLeftArrow =
+		props.arrowLogicOnEndOfPage === 'disable' ||
+		(props.arrowLogicOnEndOfPage === 'hide' && showArrow.left);
+	const showRightArrow =
+		props.arrowLogicOnEndOfPage === 'disable' ||
+		(props.arrowLogicOnEndOfPage === 'hide' && showArrow.right);
+
+	const leftArrowClassnames =
+		props.arrowLogicOnEndOfPage === 'disable' && !showArrow.left ? 'disabled' : '';
+	const rightArrowClassnames =
+		props.arrowLogicOnEndOfPage === 'disable' && !showArrow.right ? 'disabled' : '';
 
 	return (
 		<div
@@ -275,8 +286,8 @@ export const Carousel: FunctionComponent<CarouselProps> = (userProps: CarouselPr
 			{...(props.useArrowKeys ? { onKeyDown: handleOnKeyDown } : {})}
 			className={`${styles.carouselBase} ${props.className}`}
 		>
-			{showArrow.left && (
-				<div onClick={onLeftArrowClick}>
+			{!!showLeftArrow && (
+				<div className={leftArrowClassnames} onClick={onLeftArrowClick}>
 					{props.leftArrow ?? <Arrow direction="left" />}
 				</div>
 			)}
@@ -289,8 +300,12 @@ export const Carousel: FunctionComponent<CarouselProps> = (userProps: CarouselPr
 				dragCallback={dragCallback}
 				widthCallBack={widthCallBack}
 			/>
-			{showArrow.right && (
-				<div onClick={onRightArrowClick} ref={slideButtonRef}>
+			{!!showRightArrow && (
+				<div
+					className={rightArrowClassnames}
+					onClick={onRightArrowClick}
+					ref={slideButtonRef}
+				>
 					{props.rightArrow ?? <Arrow direction="right" />}
 				</div>
 			)}
@@ -324,6 +339,7 @@ export interface CarouselProps {
 	pageCount?: number;
 	leftArrow?: ReactElement | null;
 	rightArrow?: ReactElement | null;
+	arrowLogicOnEndOfPage?: 'hide' | 'disable';
 	autoSwipe?: number | null;
 	navigation?: null | ((selected: boolean) => ReactElement);
 	triggerClickOn?: number;

From 193f59e89dfdb0a347aed90f72baaf445428d25e Mon Sep 17 00:00:00 2001
From: Kaan Ersoy <kaan.ersoy@trendyol.com>
Date: Wed, 4 Dec 2024 10:18:37 +0300
Subject: [PATCH 2/2] feat: upgrade package version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ef68546..11a479f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@trendyol-js/react-carousel",
-	"version": "3.0.2",
+	"version": "3.0.3",
 	"description": "Lightweight carousel component for react",
 	"main": "dist/cjs/index.js",
 	"module": "dist/es/index.js",