fix: Bug with scrollbars on iOS 13+

Apply [suggested bug fix](facebook/react-native#26610 (comment)) for scrollbars sometime rendering off-centered
Instawork · Apr 17, 2022 · 1a1ec3d · 1a1ec3d
1 parent 3b816f8
commit 1a1ec3d
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/src/components/hv-view/index.js b/src/components/hv-view/index.js
@@ -114,6 +114,12 @@ export default class HvView extends PureComponent<HvComponentProps> {
       props.showsHorizontalScrollIndicator = horizontal && showScrollIndicator;
       props.showsVerticalScrollIndicator = !horizontal && showScrollIndicator;
 
+      // Fix scrollbar rendering issue in iOS 13+
+      // https://github.com/facebook/react-native/issues/26610#issuecomment-539843444
+      if (Platform.OS === 'ios' && parseInt(Platform.Version, 10) >= 13) {
+        props.scrollIndicatorInsets = { right: 1 };
+      }
+
       if (horizontal) {
         props.horizontal = true;
       }

diff --git a/src/components/hv-view/types.js b/src/components/hv-view/types.js
@@ -26,5 +26,11 @@ export type InternalProps = {|
   style?: ?Array<StyleSheet>,
   testID?: ?string,
   children?: ?any,
+  scrollIndicatorInsets?: {
+    bottom?: number,
+    left?: number,
+    right?: number,
+    top?: number,
+  },
   stickyHeaderIndices?: ?(number[]),
 |};