diff --git a/components/Timetable.js b/components/Timetable.js index 9e03865..80e0159 100644 --- a/components/Timetable.js +++ b/components/Timetable.js @@ -1,56 +1,19 @@ import React from "react"; import PropTypes from "prop-types"; import { - Button, - Card, - Text + Portal, } from "react-native-paper"; - -import { - View, - StyleSheet -} from "react-native"; - import { createStackNavigator } from "@react-navigation/stack"; -function HomeScreen({ timetable, subjects, navigation, days }) { - return (<> - {timetable.map((day, dayIdx) => ( - - - - {day.map((cls, idx) => { - const subject = subjects.find(i => i.id === cls.sub_id); - return ( - {subject.name} - {cls.start} to {cls.end} - {cls.count} - ); - })} - - - - - - ))} - ); -} - -HomeScreen.propTypes = { - timetable: PropTypes.array, - subjects: PropTypes.array, - navigation: PropTypes.object, - days: PropTypes.array, -}; +import HomeScreen from "./timetable/HomeScreen"; +import AddEntry from "./timetable/AddEntry"; const Stack = createStackNavigator(); export default function Timetable({ timetable, subjects }) { const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; return ( - + {(props) => ( ( {(props) => ( - {idx} + subjects={subjects} + day={idx} + days={days} + /> )} ))} - + ); } @@ -80,19 +46,3 @@ Timetable.propTypes = { addTimetableEntry: PropTypes.func, removeTimetableEntry: PropTypes.func, }; - -const style = StyleSheet.create({ - card: { - marginTop: 12, - marginLeft: 10, - marginRight: 10, - }, - text: { - marginTop: 12, - textAlign: "center", - }, - class: { - flexDirection: "row", - justifyContent: "space-between" - } -}); diff --git a/components/timetable/AddEntry.js b/components/timetable/AddEntry.js new file mode 100644 index 0000000..cff1421 --- /dev/null +++ b/components/timetable/AddEntry.js @@ -0,0 +1,18 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { + IconButton, +} from "react-native-paper"; + +function AddEntry({navigation}) { + return (<> + navigation.pop()}/> + ); +} + +AddEntry.propTypes = { + subjects: PropTypes.array, + navigation: PropTypes.object, +}; + +export default AddEntry; diff --git a/components/timetable/HomeScreen.js b/components/timetable/HomeScreen.js new file mode 100644 index 0000000..ca4a1ba --- /dev/null +++ b/components/timetable/HomeScreen.js @@ -0,0 +1,67 @@ +import React from "react"; +import PropTypes from "prop-types"; + +import { + IconButton, + Card, + Text, + withTheme, +} from "react-native-paper"; + +import { + View, + StyleSheet +} from "react-native"; + +function HomeScreen({ theme, timetable, subjects, navigation, days }) { + return (<> + {timetable.map((day, dayIdx) => ( + + + + {day.map((cls, idx) => { + const subject = subjects.find(i => i.id === cls.sub_id); + return ( + {subject.name} + {cls.start} to {cls.end} + {cls.count} + ); + })} + + + navigation.navigate(`New Entry ${days[dayIdx]}`)} + icon="plus" + color={theme.colors.primary} + /> + + + ))} + ); +} + +HomeScreen.propTypes = { + timetable: PropTypes.array, + subjects: PropTypes.array, + navigation: PropTypes.object, + days: PropTypes.array, + theme: PropTypes.object, +}; + +const style = StyleSheet.create({ + card: { + marginTop: 12, + marginLeft: 10, + marginRight: 10, + }, + text: { + marginTop: 12, + textAlign: "center", + }, + class: { + flexDirection: "row", + justifyContent: "space-between" + }, +}); + +export default withTheme(HomeScreen);