From a1f6ed85197a7c0a0373f307293fc2901b21dbbe Mon Sep 17 00:00:00 2001
From: Dan Abramov <dan.abramov@gmail.com>
Date: Tue, 17 Oct 2023 21:17:13 +0100
Subject: [PATCH] Simplify the state machine to fix web animation

---
 src/view/com/pager/TabBar.tsx | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx
index 74a4712c4e..8a38358da7 100644
--- a/src/view/com/pager/TabBar.tsx
+++ b/src/view/com/pager/TabBar.tsx
@@ -33,7 +33,6 @@ export function TabBar({
   const scrollElRef = useAnimatedRef(null)
   const {isDesktop, isTablet} = useWebMediaQueries()
   const [layouts, setLayouts] = useState([])
-  const shouldSync = useSharedValue(true)
   const scrollX = useSharedValue(0)
   const didScroll = useSharedValue(false)
 
@@ -69,7 +68,7 @@ export function TabBar({
   useAnimatedReaction(() => {
     return (dragProgress.value / (items.length - 1)) * (contentSize.value - windowWidth)
   }, (nextX, prevX) => {
-    if (shouldSync.value && prevX !== nextX) {
+    if (prevX !== nextX && dragState.value !== 'idle' && !didScroll.value) {
       scrollTo(scrollElRef, nextX, 0, false);
     }
   })
@@ -80,7 +79,6 @@ export function TabBar({
     if (nextDragState === 'idle' && nextDragState !== prevDragState) {
       const nextX = (dragProgress.value / (items.length - 1)) * (contentSize.value - windowWidth)
       scrollTo(scrollElRef, nextX, 0, true);
-      shouldSync.value = true
       didScroll.value = false
     }
   })
@@ -109,7 +107,6 @@ export function TabBar({
           contentSize.value = e
         }}
         onScrollBeginDrag={e => {
-          shouldSync.value = false
           didScroll.value = true
         }}
         onScroll={e => {