add a coming soon screen for study tools that don't exist yet (#43)

sidewalklabs · Sep 6, 2018 · fb32a7d · fb32a7d
1 parent fd14cbe
commit fb32a7d
Show file tree

Hide file tree

Showing 4 changed files with 69 additions and 22 deletions.
diff --git a/expo_project/config/studies.js b/expo_project/config/studies.js
@@ -6,9 +6,21 @@ export default [
     studyName: "Thorncliffe Park",
     studyAuthor: "Park People",
     surveys: [
-      { type: "activity", title: "Stationary Mapping" },
-      { type: "lineOfSight", title: "Line of Sight (coming soon!)" },
-      { type: "intercept", title: "Intercepts (coming soon!)" }
+      {
+        type: "activity",
+        title: "Stationary Mapping tool",
+        routeName: "SurveyScreen"
+      },
+      {
+        type: "lineOfSight",
+        title: "Line of Sight tool",
+        routeName: "ComingSoonScreen"
+      },
+      {
+        type: "intercept",
+        title: "Intercept study tool",
+        routeName: "ComingSoonScreen"
+      }
     ]
   }
 ];
diff --git a/expo_project/navigation/AppNavigator.js b/expo_project/navigation/AppNavigator.js
@@ -3,6 +3,7 @@ import colors from "../constants/Colors";
 import Theme from "../constants/Theme";
 import AuthScreen from "../screens/AuthScreen";
 import AuthLoadingScreen from "../screens/AuthLoadingScreen";
+import ComingSoonScreen from "../screens/ComingSoonScreen";
 import SurveyScreen from "../screens/SurveyScreen";
 import StudyIndexScreen from "../screens/StudyIndexScreen";
 import PrivacyScreen from "../screens/PrivacyScreen";
@@ -21,7 +22,8 @@ const navigationOptions = {
 const AppStack = createStackNavigator(
   {
     StudyIndexScreen,
-    SurveyScreen
+    SurveyScreen,
+    ComingSoonScreen
   },
   {
     initialRouteName: "StudyIndexScreen",

diff --git a/expo_project/screens/ComingSoonScreen.js b/expo_project/screens/ComingSoonScreen.js
@@ -0,0 +1,23 @@
+import React, { Component } from "react";
+import { StyleSheet, View } from "react-native";
+import { Title } from "react-native-paper";
+
+class ComingSoonScreen extends Component {
+  render() {
+    return (
+      <View style={styles.container}>
+        <Title>Coming Soon!</Title>
+      </View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "#fff",
+    padding: 20
+  }
+});
+
+export default ComingSoonScreen;
diff --git a/expo_project/screens/StudyIndexScreen.js b/expo_project/screens/StudyIndexScreen.js
@@ -39,24 +39,28 @@ class SurveyIndexScreen extends React.Component {
                   <View>
                     <Divider />
                     <CardContent style={styles.surveyRow}>
-                      <Text style={styles.surveyTitle}>{survey.title}</Text>
-                      <Button
-                        dark
-                        raised
-                        primary
-                        onPress={() =>
-                          this.props.navigation.navigate("SurveyScreen", {
-                            studyId: study.studyId,
-                            surveyId: study.surveyId,
-                            studyName: study.studyName,
-                            studyAuthor: study.studyAuthor,
-                            surveyType: survey.type,
-                            surveyTitle: survey.title
-                          })
-                        }
-                      >
-                        Start
-                      </Button>
+                      <View style={styles.contentWrapper}>
+                        <Text style={styles.surveyTitle}>{survey.title}</Text>
+                      </View>
+                      <View style={styles.buttonWrapper}>
+                        <Button
+                          dark
+                          raised
+                          primary
+                          onPress={() =>
+                            this.props.navigation.navigate(survey.routeName, {
+                              studyId: study.studyId,
+                              surveyId: study.surveyId,
+                              studyName: study.studyName,
+                              studyAuthor: study.studyAuthor,
+                              surveyType: survey.type,
+                              surveyTitle: survey.title
+                            })
+                          }
+                        >
+                          Start
+                        </Button>
+                      </View>
                     </CardContent>
                   </View>
                 );
@@ -100,6 +104,12 @@ const styles = StyleSheet.create({
   },
   surveyTitle: {
     fontWeight: "bold"
+  },
+  contentWrapper: {
+    flex: 1
+  },
+  buttonWrapper: {
+    marginLeft: 10
   }
 });