Web fixes (#517)

* Fix scroll behaviors on web

* Remove headers on web to avoid scroll overflow

* Fix follow button press in cards

1 files changed, 17 insertions, 4 deletions

diff --git a/src/view/com/util/forms/Button.tsx b/src/view/com/util/forms/Button.tsx
index a634b47a9..8548860d0 100644
--- a/src/view/com/util/forms/Button.tsx
+++ b/src/view/com/util/forms/Button.tsx
@@ -1,15 +1,20 @@
 import React from 'react'
 import {
+  GestureResponderEvent,
   StyleProp,
   StyleSheet,
   TextStyle,
-  TouchableOpacity,
+  Pressable,
   ViewStyle,
 } from 'react-native'
 import {Text} from '../text/Text'
 import {useTheme} from 'lib/ThemeContext'
 import {choose} from 'lib/functions'
 
+type Event =
+  | React.MouseEvent<HTMLAnchorElement, MouseEvent>
+  | GestureResponderEvent
+
 export type ButtonType =
   | 'primary'
   | 'secondary'
@@ -114,10 +119,18 @@ export function Button({
       },
     },
   )
+  const onPressWrapped = React.useCallback(
+    (event: Event) => {
+      event.stopPropagation()
+      event.preventDefault()
+      onPress?.()
+    },
+    [onPress],
+  )
   return (
-    <TouchableOpacity
+    <Pressable
       style={[typeOuterStyle, styles.outer, style]}
-      onPress={onPress}
+      onPress={onPressWrapped}
       testID={testID}>
       {label ? (
         <Text type="button" style={[typeLabelStyle, labelStyle]}>
@@ -126,7 +139,7 @@ export function Button({
       ) : (
         children
       )}
-    </TouchableOpacity>
+    </Pressable>
   )
 }