Browse Source

Moved collapsible stack creating in own file

Arnaud Vergnet 1 year ago
parent
commit
033bb388fd
3 changed files with 40 additions and 67 deletions
  1. 1
    34
      src/navigation/MainNavigator.js
  2. 1
    33
      src/navigation/TabNavigator.js
  3. 38
    0
      src/utils/CollapsibleUtils.js

+ 1
- 34
src/navigation/MainNavigator.js View File

@@ -11,8 +11,6 @@ import TabNavigator from "./TabNavigator";
11 11
 import TetrisScreen from "../screens/Tetris/TetrisScreen";
12 12
 import VoteScreen from "../screens/Amicale/VoteScreen";
13 13
 import LoginScreen from "../screens/Amicale/LoginScreen";
14
-import {useTheme} from "react-native-paper";
15
-import {createCollapsibleStack} from "react-navigation-collapsible";
16 14
 import {Platform} from "react-native";
17 15
 import AvailableRoomScreen from "../screens/Websites/AvailableRoomScreen";
18 16
 import BibScreen from "../screens/Websites/BibScreen";
@@ -30,6 +28,7 @@ import ProfileScreen from "../screens/Amicale/ProfileScreen";
30 28
 import ClubListScreen from "../screens/Amicale/Clubs/ClubListScreen";
31 29
 import ClubAboutScreen from "../screens/Amicale/Clubs/ClubAboutScreen";
32 30
 import ClubDisplayScreen from "../screens/Amicale/Clubs/ClubDisplayScreen";
31
+import {createScreenCollapsibleStack, getWebsiteStack} from "../utils/CollapsibleUtils";
33 32
 
34 33
 const defaultScreenOptions = {
35 34
     gestureEnabled: true,
@@ -41,38 +40,6 @@ const modalTransition = Platform.OS === 'ios' ? TransitionPresets.ModalPresentat
41 40
 
42 41
 const screenTransition = Platform.OS === 'ios' ? TransitionPresets.SlideFromRightIOS : TransitionPresets.ScaleFromCenterAndroid;
43 42
 
44
-function createScreenCollapsibleStack(
45
-    name: string,
46
-    Stack: any,
47
-    component: any,
48
-    title: string,
49
-    useNativeDriver?: boolean,
50
-    options?: { [key: string]: any }) {
51
-    const {colors} = useTheme();
52
-    const screenOptions = options != null ? options : {};
53
-    return createCollapsibleStack(
54
-        <Stack.Screen
55
-            name={name}
56
-            component={component}
57
-            options={{
58
-                title: title,
59
-                headerStyle: {
60
-                    backgroundColor: colors.surface,
61
-                },
62
-                ...screenOptions,
63
-            }}
64
-        />,
65
-        {
66
-            collapsedColor: 'transparent',
67
-            useNativeDriver: useNativeDriver != null ? useNativeDriver : true, // native driver does not work with webview
68
-        }
69
-    )
70
-}
71
-
72
-function getWebsiteStack(name: string, Stack: any, component: any, title: string) {
73
-    return createScreenCollapsibleStack(name, Stack, component, title, false);
74
-}
75
-
76 43
 const MainStack = createStackNavigator();
77 44
 
78 45
 function MainStackComponent(props: { createTabNavigator: () => React.Node }) {

+ 1
- 33
src/navigation/TabNavigator.js View File

@@ -21,6 +21,7 @@ import CustomTabBar from "../components/Tabbar/CustomTabBar";
21 21
 import WebsitesHomeScreen from "../screens/Services/ServicesScreen";
22 22
 import ServicesSectionScreen from "../screens/Services/ServicesSectionScreen";
23 23
 import AmicaleContactScreen from "../screens/Amicale/AmicaleContactScreen";
24
+import {createScreenCollapsibleStack, getWebsiteStack} from "../utils/CollapsibleUtils";
24 25
 
25 26
 const defaultScreenOptions = {
26 27
     gestureEnabled: true,
@@ -30,39 +31,6 @@ const defaultScreenOptions = {
30 31
 
31 32
 const modalTransition = Platform.OS === 'ios' ? TransitionPresets.ModalPresentationIOS : TransitionPresets.ModalSlideFromBottomIOS;
32 33
 
33
-function createScreenCollapsibleStack(
34
-    name: string,
35
-    Stack: any,
36
-    component: any,
37
-    title: string,
38
-    useNativeDriver?: boolean,
39
-    options?: { [key: string]: any }) {
40
-    const {colors} = useTheme();
41
-    const screenOptions = options != null ? options : {};
42
-    return createCollapsibleStack(
43
-        <Stack.Screen
44
-            name={name}
45
-            component={component}
46
-            options={{
47
-                title: title,
48
-                headerStyle: {
49
-                    backgroundColor: colors.surface,
50
-                },
51
-                ...screenOptions,
52
-            }}
53
-        />,
54
-        {
55
-            collapsedColor: 'transparent',
56
-            useNativeDriver: useNativeDriver != null ? useNativeDriver : true, // native driver does not work with webview
57
-        }
58
-    )
59
-}
60
-
61
-function getWebsiteStack(name: string, Stack: any, component: any, title: string) {
62
-    return createScreenCollapsibleStack(name, Stack, component, title, false);
63
-}
64
-
65
-
66 34
 const ServicesStack = createStackNavigator();
67 35
 
68 36
 function ServicesStackComponent() {

+ 38
- 0
src/utils/CollapsibleUtils.js View File

@@ -0,0 +1,38 @@
1
+// @flow
2
+
3
+import * as React from 'react';
4
+import {useTheme} from "react-native-paper";
5
+import {createCollapsibleStack} from "react-navigation-collapsible";
6
+import StackNavigator, {StackNavigationOptions} from "@react-navigation/stack";
7
+
8
+export function createScreenCollapsibleStack(
9
+    name: string,
10
+    Stack: StackNavigator,
11
+    component: React.Node,
12
+    title: string,
13
+    useNativeDriver?: boolean,
14
+    options?: StackNavigationOptions) {
15
+    const {colors} = useTheme();
16
+    const screenOptions = options != null ? options : {};
17
+    return createCollapsibleStack(
18
+        <Stack.Screen
19
+            name={name}
20
+            component={component}
21
+            options={{
22
+                title: title,
23
+                headerStyle: {
24
+                    backgroundColor: colors.surface,
25
+                },
26
+                ...screenOptions,
27
+            }}
28
+        />,
29
+        {
30
+            collapsedColor: colors.surface,
31
+            useNativeDriver: useNativeDriver != null ? useNativeDriver : true, // native driver does not work with webview
32
+        }
33
+    )
34
+}
35
+
36
+export function getWebsiteStack(name: string, Stack: any, component: any, title: string) {
37
+    return createScreenCollapsibleStack(name, Stack, component, title, false);
38
+}

Loading…
Cancel
Save