AttachmentCarousel: fix mouse/trackpad issues on web/desktop

Expensify · Apr 12, 2023 · b7907cf · b7907cf
1 parent 3b81830
commit b7907cf
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/src/components/AttachmentCarousel/index.js b/src/components/AttachmentCarousel/index.js
@@ -163,7 +163,7 @@ class AttachmentCarousel extends React.Component {
     /**
      * Increments or decrements the index to get another selected item
      * @param {Number} deltaSlide
-    */
+     */
     cycleThroughAttachments(deltaSlide) {
         const nextIndex = this.state.page - deltaSlide;
         const nextItem = this.state.attachments[nextIndex];
@@ -275,7 +275,13 @@ class AttachmentCarousel extends React.Component {
                 <FlatList
                     listKey="AttachmentCarousel"
                     horizontal
-                    inverted
+
+                    // Inverting the list for touchscreen devices that can swipe or have an animation when scrolling
+                    // promotes the natural feeling of swiping left/right to go to the next/previous image
+                    // We don't want to invert the list for desktop/web because this interferes with mouse
+                    // wheel or trackpad scrolling (in cases like document preview where you can scroll vertically)
+                    inverted={this.canUseTouchScreen}
+
                     decelerationRate="fast"
                     showsHorizontalScrollIndicator={false}
                     bounces={false}