Added way to access Add page and default module.

src/components/screens/ModuleAddScreen.js

@@ -1,14 +1,36 @@
 import {StyleSheet, Text} from "react-native";
 import Screen from "../layout/Screen";
+import {Button, ButtonTray} from "../UI/Button";
+import Icons from "../UI/Icons";
 
-export const ModuleAddScreen = () => {
+const defaultModule = {
+    ModuleID: Math.floor(100000 + Math.random()*900000),
+    ModuleCode: "CI6330",
+    ModuleName: "Mobile Application Development",
+    ModuleLevel: 6,
+    ModuleLeaderID: 1,
+    ModuleLeaderName: "Graeme Jones",
+    ModuleImage: 'https://images.freeimages.com/images/small-preview/cf5/cellphone-1313194.jpg',
+};
+
+export const ModuleAddScreen = ({navigation, route}) => {
 //   Initialisation -------------
+    const { onAdd } = route.params;
+
 //   State ----------------------
 //   Handlers -------------------
+
+    const handleAdd = () => onAdd(defaultModule);
+    const handleCancel = navigation.goBack;
+
 //   View -----------------------
     return (
         <Screen style={styles.container}>
             <Text>Add</Text>
+            <ButtonTray>
+                <Button label='Cancel' onClick={handleCancel} />
+                <Button label='Add' icon={<Icons.Add/>} onClick={handleAdd} />
+            </ButtonTray>
         </Screen>
     );
 };

src/components/screens/ModuleListScreen.js

@@ -3,7 +3,9 @@ import {LogBox, StyleSheet} from "react-native";
 import Screen from "../layout/Screen";
 import ModuleList from "../entity/modules/ModuleList";
 import initialModules from "../../data/modules.js";
-import RenderCount from "../UI/RenderCount";
+// import RenderCount from "../UI/RenderCount";
+import {Button, ButtonTray} from "../UI/Button";
+import Icons from "../UI/Icons";
 
 const ModuleListScreen = ({navigation}) => {
 //   Initialisation -------------
@@ -25,14 +27,27 @@ const ModuleListScreen = ({navigation}) => {
         navigation.goBack();
     }
 
-    const handleSelect = (module) =>
+    const handleAdd = (module) => setModules([ ...modules, module]);
+
+    const onAdd = (module) => {
+        handleAdd(module);
+        navigation.goBack();
+    };
+
+    const goToViewScreen = (module) =>
         navigation.navigate('ModuleViewScreen', {module, onDelete});
+
+    const goToAddScreen = () => navigation.navigate('ModuleAddScreen', {onAdd});
+
 //   View -----------------------
 
     return (
         <Screen>
             {/*<RenderCount/>*/}
-            <ModuleList modules={modules} onSelect={handleSelect}/>
+            <ButtonTray>
+                <Button label='Add' icon={<Icons.Add/>} onClick={goToAddScreen} />
+            </ButtonTray>
+            <ModuleList modules={modules} onSelect={goToViewScreen} />
         </Screen>
     );
 };