Basic refactoring for Users from old modules section

src/components/screens/UserAddScreen.js

@@ -0,0 +1,24 @@
+import {StyleSheet, Text, TextInput, View} from "react-native";
+import Screen from "../layout/Screen";
+import ModuleForm from "../entity/modules/moduleForm";
+
+
+export const UserAddScreen = ({navigation, route}) => {
+//   Initialisation -------------
+    const {onAdd} = route.params;
+//   State ----------------------
+//   Handlers -------------------
+
+    const handleCancel = navigation.goBack;
+
+//   View -----------------------
+    return (
+        <Screen style={styles.container}>
+            <ModuleForm onSubmit={onAdd} onCancel={handleCancel}/>
+        </Screen>
+    );
+};
+
+const styles = StyleSheet.create({});
+
+export default UserAddScreen;

src/components/screens/UserListScreen.js

@@ -0,0 +1,76 @@
+// import {useState, useEffect} from "react";
+import {LogBox, Text} from "react-native";
+import Screen from "../layout/Screen";
+import ModuleList from "../entity/modules/ModuleList";
+import {Button, ButtonTray} from "../UI/Button";
+import Icons from "../UI/Icons";
+import useLoad from "../API/useLoad";
+
+
+const UserListScreen = ({navigation}) => {
+//   Initialisation -------------
+//    let modules = initialModules;
+    LogBox.ignoreLogs(['Non-serializable values were found in the navigation state']);
+
+
+    const usersEndpoint = 'https://softwarehub.uk/unibase/api/users';
+
+//   State ----------------------
+
+    const [users, setUsers, isLoading, loadUsers] = useLoad(usersEndpoint);
+
+//   Handlers -------------------
+
+    const handleDelete = (user) =>
+        setUsers(users.filter((item) => item.UserID !== module.UserID));
+
+
+    const onDelete = (user) => {
+        handleDelete(user);
+        navigation.goBack();
+    }
+
+    const handleAdd = (user) => setUsers([...users, user]);
+
+    const handleModify = (updatedUser) => setUsers(
+        users.map((user) => (module.UserID === updatedUser.UserID) ? updatedUser : user),
+    );
+
+    const onAdd = (user) => {
+        handleAdd(user);
+        navigation.goBack();
+    };
+
+    const onModify = (user) => {
+        handleModify(user);
+        navigation.replace('UserViewScreen', {user, onDelete, onModify});
+    };
+
+    const goToViewScreen = (module) =>
+        navigation.navigate('UserViewScreen', {user, onDelete, onModify});
+
+    const goToAddScreen = () =>
+        navigation.navigate('UserAddScreen', {onAdd});
+
+
+//   View -----------------------
+
+    return (
+        <Screen>
+            {/*<RenderCount/>*/}
+            <ButtonTray>
+                <Button label='Add' icon={<Icons.Add/>} onClick={goToAddScreen}/>
+            </ButtonTray>
+
+            {isLoading && <Text>Loading Records...</Text>}
+
+            <ModuleList users={users} onSelect={goToViewScreen}/>
+        </Screen>
+    );
+};
+
+// const styles = StyleSheet.create({});
+
+export default UserListScreen;
+
+

src/components/screens/UserModifyScreen.js

@@ -0,0 +1,28 @@
+import {StyleSheet, Text} from "react-native";
+import Screen from "../layout/Screen";
+import ModuleForm from "../entity/modules/moduleForm";
+
+export const UserModifyScreen = ({navigation, route}) => {
+//   Initialisation -------------
+    const {user, onModify} = route.params;
+
+//   State ----------------------
+//   Handlers -------------------
+
+    const handleCancel = () => navigation.navigate.goBack();
+
+//   View -----------------------
+    return (
+        <Screen style={styles.container}>
+            <ModuleForm
+                originalModule={user}
+                onSubmit={onModify}
+                onCancel={handleCancel}
+            />
+        </Screen>
+    );
+};
+
+const styles = StyleSheet.create({});
+
+export default UserModifyScreen;