From 1e73fed6def8aee98b5259810432ceb87f5af2aa Mon Sep 17 00:00:00 2001
From: Evan Bacon <baconbrix@gmail.com>
Date: Thu, 30 Apr 2020 04:06:11 -0700
Subject: [PATCH] chore: fix scrolling in web examples (#8020)

---
 example/src/Screens/CompatAPI.tsx                | 10 ++++++----
 example/src/Screens/LinkComponent.tsx            |  9 +++++++--
 example/src/Screens/ModalPresentationStack.tsx   | 11 ++++++++---
 example/src/Screens/SimpleStack.tsx              | 13 +++++++++----
 example/src/Screens/StackHeaderCustomization.tsx |  9 +++++++--
 example/src/Screens/StackTransparent.tsx         |  9 +++++++--
 6 files changed, 44 insertions(+), 17 deletions(-)

diff --git a/example/src/Screens/CompatAPI.tsx b/example/src/Screens/CompatAPI.tsx
index 1ac05688..bb074542 100644
--- a/example/src/Screens/CompatAPI.tsx
+++ b/example/src/Screens/CompatAPI.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View, ScrollView, StyleSheet } from 'react-native';
+import { View, ScrollView, StyleSheet, Platform } from 'react-native';
 import { Button } from 'react-native-paper';
 import {
   createCompatNavigatorFactory,
@@ -23,6 +23,8 @@ type NestedStackParams = {
   Article: { author: string };
 };
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const AlbumsScreen: CompatScreenType<StackNavigationProp<
   CompatStackParams
 >> = ({ navigation }) => {
@@ -44,7 +46,7 @@ const AlbumsScreen: CompatScreenType<StackNavigationProp<
           Go back
         </Button>
       </View>
-      <Albums scrollEnabled={false} />
+      <Albums scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
@@ -70,7 +72,7 @@ const FeedScreen: CompatScreenType<StackNavigationProp<NestedStackParams>> = ({
           Go back
         </Button>
       </View>
-      <NewsFeed scrollEnabled={false} />
+      <NewsFeed scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
@@ -100,7 +102,7 @@ const ArticleScreen: CompatScreenType<StackNavigationProp<
       </View>
       <Article
         author={{ name: navigation.getParam('author') }}
-        scrollEnabled={false}
+        scrollEnabled={scrollEnabled}
       />
     </ScrollView>
   );
diff --git a/example/src/Screens/LinkComponent.tsx b/example/src/Screens/LinkComponent.tsx
index 108ebf27..9ef94ac4 100644
--- a/example/src/Screens/LinkComponent.tsx
+++ b/example/src/Screens/LinkComponent.tsx
@@ -22,6 +22,8 @@ type SimpleStackParams = {
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const LinkButton = ({
   to,
   ...rest
@@ -78,7 +80,10 @@ const ArticleScreen = ({
           Go back
         </Button>
       </View>
-      <Article author={{ name: route.params.author }} scrollEnabled={false} />
+      <Article
+        author={{ name: route.params.author }}
+        scrollEnabled={scrollEnabled}
+      />
     </ScrollView>
   );
 };
@@ -112,7 +117,7 @@ const AlbumsScreen = ({
           Go back
         </Button>
       </View>
-      <Albums scrollEnabled={false} />
+      <Albums scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
diff --git a/example/src/Screens/ModalPresentationStack.tsx b/example/src/Screens/ModalPresentationStack.tsx
index b07b29ee..9c8a62d2 100644
--- a/example/src/Screens/ModalPresentationStack.tsx
+++ b/example/src/Screens/ModalPresentationStack.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View, StyleSheet, ScrollView } from 'react-native';
+import { View, StyleSheet, ScrollView, Platform } from 'react-native';
 import { Button } from 'react-native-paper';
 import { RouteProp, ParamListBase } from '@react-navigation/native';
 import {
@@ -17,6 +17,8 @@ type ModalStackParams = {
 
 type ModalStackNavigation = StackNavigationProp<ModalStackParams>;
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const ArticleScreen = ({
   navigation,
   route,
@@ -42,7 +44,10 @@ const ArticleScreen = ({
           Go back
         </Button>
       </View>
-      <Article author={{ name: route.params.author }} scrollEnabled={false} />
+      <Article
+        author={{ name: route.params.author }}
+        scrollEnabled={scrollEnabled}
+      />
     </ScrollView>
   );
 };
@@ -66,7 +71,7 @@ const AlbumsScreen = ({ navigation }: { navigation: ModalStackNavigation }) => {
           Go back
         </Button>
       </View>
-      <Albums scrollEnabled={false} />
+      <Albums scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
diff --git a/example/src/Screens/SimpleStack.tsx b/example/src/Screens/SimpleStack.tsx
index 351c8b3e..2c415bae 100644
--- a/example/src/Screens/SimpleStack.tsx
+++ b/example/src/Screens/SimpleStack.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View, StyleSheet, ScrollView } from 'react-native';
+import { View, Platform, StyleSheet, ScrollView } from 'react-native';
 import { Button } from 'react-native-paper';
 import { RouteProp, ParamListBase } from '@react-navigation/native';
 import {
@@ -18,6 +18,8 @@ type SimpleStackParams = {
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const ArticleScreen = ({
   navigation,
   route,
@@ -43,7 +45,10 @@ const ArticleScreen = ({
           Pop screen
         </Button>
       </View>
-      <Article author={{ name: route.params.author }} scrollEnabled={false} />
+      <Article
+        author={{ name: route.params.author }}
+        scrollEnabled={scrollEnabled}
+      />
     </ScrollView>
   );
 };
@@ -71,7 +76,7 @@ const NewsFeedScreen = ({
           Go back
         </Button>
       </View>
-      <NewsFeed scrollEnabled={false} />
+      <NewsFeed scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
@@ -99,7 +104,7 @@ const AlbumsScreen = ({
           Pop by 2
         </Button>
       </View>
-      <Albums scrollEnabled={false} />
+      <Albums scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
diff --git a/example/src/Screens/StackHeaderCustomization.tsx b/example/src/Screens/StackHeaderCustomization.tsx
index 6c578c76..89f370e1 100644
--- a/example/src/Screens/StackHeaderCustomization.tsx
+++ b/example/src/Screens/StackHeaderCustomization.tsx
@@ -20,6 +20,8 @@ type SimpleStackParams = {
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const ArticleScreen = ({
   navigation,
   route,
@@ -45,7 +47,10 @@ const ArticleScreen = ({
           Go back
         </Button>
       </View>
-      <Article author={{ name: route.params.author }} scrollEnabled={false} />
+      <Article
+        author={{ name: route.params.author }}
+        scrollEnabled={scrollEnabled}
+      />
     </ScrollView>
   );
 };
@@ -75,7 +80,7 @@ const AlbumsScreen = ({
           Go back
         </Button>
       </View>
-      <Albums scrollEnabled={false} />
+      <Albums scrollEnabled={scrollEnabled} />
     </ScrollView>
   );
 };
diff --git a/example/src/Screens/StackTransparent.tsx b/example/src/Screens/StackTransparent.tsx
index 09a45dce..ba1c94d0 100644
--- a/example/src/Screens/StackTransparent.tsx
+++ b/example/src/Screens/StackTransparent.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View, StyleSheet, ScrollView } from 'react-native';
+import { View, StyleSheet, ScrollView, Platform } from 'react-native';
 import { Button, Paragraph } from 'react-native-paper';
 import { RouteProp, ParamListBase, useTheme } from '@react-navigation/native';
 import {
@@ -15,6 +15,8 @@ type SimpleStackParams = {
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
 const ArticleScreen = ({
   navigation,
   route,
@@ -40,7 +42,10 @@ const ArticleScreen = ({
           Go back
         </Button>
       </View>
-      <Article author={{ name: route.params.author }} scrollEnabled={false} />
+      <Article
+        author={{ name: route.params.author }}
+        scrollEnabled={scrollEnabled}
+      />
     </ScrollView>
   );
 };