From 17997a8a5eaa3c1343800646580e6eb5d6d9fe6b Mon Sep 17 00:00:00 2001
From: Tim <tymmesyde@gmail.com>
Date: Fri, 15 Mar 2024 19:43:49 +0100
Subject: [PATCH] fix(Chips): add threshold to scroll position detection

---
 src/common/Chips/Chips.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/common/Chips/Chips.tsx b/src/common/Chips/Chips.tsx
index 765b8fcf6..4e02c620f 100644
--- a/src/common/Chips/Chips.tsx
+++ b/src/common/Chips/Chips.tsx
@@ -16,6 +16,8 @@ type Props = {
     onSelect: (value: string) => {},
 };
 
+const SCROLL_THRESHOLD = 1;
+
 const Chips = memo(({ options, selected, onSelect }: Props) => {
     const ref = useRef<HTMLDivElement>(null);
     const [scrollPosition, setScrollPosition] = useState('left');
@@ -23,7 +25,10 @@ const Chips = memo(({ options, selected, onSelect }: Props) => {
     useEffect(() => {
         const onScroll = ({ target }: Event) => {
             const { scrollLeft, scrollWidth, offsetWidth} = target as HTMLDivElement;
-            const position = scrollLeft === 0 ? 'left' : scrollLeft + offsetWidth >= scrollWidth ? 'right' : 'center';
+            const position =
+                (scrollLeft - SCROLL_THRESHOLD) <= 0 ? 'left' :
+                    (scrollLeft + offsetWidth + SCROLL_THRESHOLD) >= scrollWidth ? 'right' :
+                        'center';
             setScrollPosition(position);
         };