diff --git a/components/Timetable.js b/components/Timetable.js index c424042..59c864b 100644 --- a/components/Timetable.js +++ b/components/Timetable.js @@ -37,19 +37,16 @@ export default function Timetable({ addTimetableEntry, removeTimetableEntry, tim /> )} - {days.map((day, idx) => ( - - {(props) => ( - - )} - - ))} + + {(props) => ( + + )} + ); } diff --git a/components/timetable/AddEntry.js b/components/timetable/AddEntry.js index 86d1871..ec73bd3 100644 --- a/components/timetable/AddEntry.js +++ b/components/timetable/AddEntry.js @@ -1,20 +1,24 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; import { - IconButton, Card, FAB, + IconButton, List, Menu, Portal, Snackbar, TextInput, + ToggleButton, } from "react-native-paper"; -import {StyleSheet} from "react-native"; +import { + StyleSheet, + View +} from "react-native"; import DateTimePicker from "@react-native-community/datetimepicker"; import { format } from "date-fns"; -function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { +function AddEntry({addTimetableEntry, days, subjects, navigation }) { const [ subject, setSubject ] = useState({ id: null, name: null }); const [ showSubjectMenu, setShowSubjectMenu ] = useState(false); const [ showTimePicker, setShowTimePicker ] = useState(false); @@ -24,6 +28,7 @@ function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { const [ end, setEnd ] = useState(null); const [ count, setCount ] = useState(0); const [ snackbar, setSnackbar ] = useState({ visible: false, message: "" }); + const [ dayStates, setDayStates ] = useState([ true, false, false, false, false, false, false ]); function parseCount(text) { const num = parseInt(text); if (isNaN(num)) @@ -56,6 +61,8 @@ function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { message = "Missing end time."; else if (count === 0) message = "Missing count."; + if (! dayStates.filter(i => i).length) + message = "No day selected."; if (message !== "") { setSnackbar({visible: true, message: message}); @@ -63,11 +70,16 @@ function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { return; } - addTimetableEntry(day, { - sub_id: subject.id, - count, - start, - end + + dayStates.forEach((i, idx) => { + if (i) { + addTimetableEntry(idx, { + sub_id: subject.id, + count, + start, + end + }); + } }); navigation.pop(); } @@ -76,7 +88,7 @@ function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { return (<> navigation.pop()}/> - + + + {dayStates.map( (i, idx) => ( + + setDayStates([ + ...dayStates.slice(0, idx), + !i, + ...dayStates.slice(idx + 1) + ]) + } + /> + ) + )} + @@ -171,9 +203,8 @@ function AddEntry({addTimetableEntry, days, day, subjects, navigation }) { AddEntry.propTypes = { addTimetableEntry: PropTypes.func, subjects: PropTypes.array, - navigation: PropTypes.object, days: PropTypes.array, - day: PropTypes.number, + navigation: PropTypes.object, }; const style = StyleSheet.create({ @@ -190,6 +221,11 @@ const style = StyleSheet.create({ flexDirection: "row", justifyContent: "space-between" }, + daysContainer: { + flexDirection: "row", + justifyContent: "space-evenly", + marginTop: 10 + }, }); export default AddEntry; diff --git a/components/timetable/HomeScreen.js b/components/timetable/HomeScreen.js index 4cb0b76..23a435a 100644 --- a/components/timetable/HomeScreen.js +++ b/components/timetable/HomeScreen.js @@ -3,12 +3,11 @@ import PropTypes from "prop-types"; import { Button, - IconButton, Card, DataTable, Dialog, + FAB, Portal, - withTheme, } from "react-native-paper"; import { @@ -22,14 +21,14 @@ function sortTimes(t1, t2) { return 1; if (t1.getHours() < t2.getHours()) return -1; - if (t1.getMinute() > t2.getMinute()) + if (t1.getMinutes() > t2.getMinutes()) return 1; - if (t1.getMinute() < t2.getMinute()) + if (t1.getMinutes() < t2.getMinutes()) return -1; return 0; } -function HomeScreen({ days, navigation, removeTimetableEntry, subjects, theme, timetable }) { +function HomeScreen({ days, navigation, removeTimetableEntry, subjects, timetable }) { const [ dialog, setDialog ] = useState({ show: false, id: null }); return ( {timetable.map((day, dayIdx) => ( @@ -99,13 +98,6 @@ function HomeScreen({ days, navigation, removeTimetableEntry, subjects, theme, t })} - - navigation.navigate(`New Entry ${days[dayIdx]}`)} - icon="plus" - color={theme.colors.primary} - /> - ))} @@ -125,6 +117,17 @@ function HomeScreen({ days, navigation, removeTimetableEntry, subjects, theme, t + navigation.navigate("New Entry")} + style={{ + position: "absolute", + margin: 16, + right: 0, + bottom: 0, + }} + /> ); } @@ -134,7 +137,6 @@ HomeScreen.propTypes = { subjects: PropTypes.array, navigation: PropTypes.object, days: PropTypes.array, - theme: PropTypes.object, removeTimetableEntry: PropTypes.func, }; @@ -154,4 +156,4 @@ const style = StyleSheet.create({ }, }); -export default withTheme(HomeScreen); +export default HomeScreen;