From 9dfc53872b05ee84b659c0a2207c7782447d2bc4 Mon Sep 17 00:00:00 2001
From: Shravya Ramesh <shravs1208@gmail.com>
Date: Thu, 11 Feb 2021 06:58:31 -0800
Subject: Added new screen to navigator

---
 src/routes/main/MainStackNavigator.tsx |  3 +++
 src/routes/main/MainStackScreen.tsx    | 24 +++++++++++++++++++++++-
 2 files changed, 26 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx
index f3aa7fc6..9771c1e6 100644
--- a/src/routes/main/MainStackNavigator.tsx
+++ b/src/routes/main/MainStackNavigator.tsx
@@ -66,6 +66,9 @@ export type MainStackParams = {
     screenType: ScreenType;
     momentCategory: string;
   };
+  AnimatedTutorial: {
+    screenType: ScreenType;
+  };
 };
 
 export const MainStack = createStackNavigator<MainStackParams>();
diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index 37f9bef8..2531eec7 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -3,6 +3,7 @@ import {RouteProp} from '@react-navigation/native';
 import {StackNavigationOptions} from '@react-navigation/stack';
 import React, {useState} from 'react';
 import {
+  AnimatedTutorial,
   CaptionScreen,
   CategorySelection,
   CreateCustomCategory,
@@ -81,7 +82,20 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
     }),
   };
 
-  console.log('screenType: ', screenType);
+  const tutorialModalStyle: StackNavigationOptions = {
+    cardStyle: {backgroundColor: 'rgba(0, 0, 0, 0.5)'},
+    gestureDirection: 'vertical',
+    cardOverlayEnabled: true,
+    cardStyleInterpolator: ({current: {progress}}) => ({
+      cardStyle: {
+        opacity: progress.interpolate({
+          inputRange: [0, 0.5, 0.9, 1],
+          outputRange: [0, 0.25, 0.7, 1],
+        }),
+      },
+    }),
+  };
+
   return (
     <MainStack.Navigator
       screenOptions={{
@@ -133,6 +147,14 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
           initialParams={{screenType}}
         />
       )}
+      <MainStack.Screen
+        name="AnimatedTutorial"
+        component={AnimatedTutorial}
+        options={{
+          ...tutorialModalStyle,
+        }}
+        initialParams={{screenType}}
+      />
       <MainStack.Screen
         name="CaptionScreen"
         component={CaptionScreen}
-- 
cgit v1.2.3-70-g09d2