diff --git a/EditSet.tsx b/EditSet.tsx index 22aab02..143fb4c 100644 --- a/EditSet.tsx +++ b/EditSet.tsx @@ -4,13 +4,17 @@ import { useNavigation, useRoute, } from '@react-navigation/native' -import {useCallback, useState} from 'react' -import {NativeModules, View} from 'react-native' -import {PADDING} from './constants' -import {setRepo, settingsRepo} from './db' +import {format} from 'date-fns' +import {useCallback, useRef, useState} from 'react' +import {NativeModules, TextInput, View} from 'react-native' +import DocumentPicker from 'react-native-document-picker' +import {Button, Card, TouchableRipple} from 'react-native-paper' +import ConfirmDialog from './ConfirmDialog' +import {MARGIN, PADDING} from './constants' +import {getNow, setRepo, settingsRepo} from './db' import GymSet from './gym-set' import {HomePageParams} from './home-page-params' -import SetForm from './SetForm' +import MassiveInput from './MassiveInput' import Settings from './settings' import StackHeader from './StackHeader' import {toast} from './toast' @@ -19,7 +23,22 @@ export default function EditSet() { const {params} = useRoute>() const {set} = params const navigation = useNavigation() - const [settings, setSettings] = useState() + const [settings, setSettings] = useState({} as Settings) + const [name, setName] = useState(set.name) + const [reps, setReps] = useState(set.reps?.toString()) + const [weight, setWeight] = useState(set.weight?.toString()) + const [newImage, setNewImage] = useState(set.image) + const [unit, setUnit] = useState(set.unit) + const [showRemove, setShowRemove] = useState(false) + const [removeImage, setRemoveImage] = useState(false) + const weightRef = useRef(null) + const repsRef = useRef(null) + const unitRef = useRef(null) + + const [selection, setSelection] = useState({ + start: 0, + end: set.reps?.toString().length, + }) useFocusEffect( useCallback(() => { @@ -28,17 +47,14 @@ export default function EditSet() { ) const startTimer = useCallback( - async (name: string) => { + async (value: string) => { if (!settings.alarm) return - const first = await setRepo.findOne({where: {name}}) + const first = await setRepo.findOne({where: {name: value}}) const milliseconds = (first?.minutes ?? 3) * 60 * 1000 + (first?.seconds ?? 0) * 1000 - NativeModules.AlarmModule.timer( - milliseconds, - settings.vibrate, - settings.sound, - settings.noSound, - ) + const {vibrate, sound, noSound} = settings + const args = [milliseconds, vibrate, sound, noSound] + NativeModules.AlarmModule.timer(...args) }, [settings], ) @@ -57,20 +73,146 @@ export default function EditSet() { [startTimer, set, settings], ) - const saved = useCallback( - async (value: GymSet) => { - if (typeof set.id !== 'number') added(value) - navigation.goBack() - }, - [added, set.id, navigation], - ) + const handleSubmit = async () => { + console.log(`${EditSet.name}.handleSubmit:`, {set, uri: newImage, name}) + if (!name) return + let image = newImage + if (!newImage && !removeImage) + image = await setRepo.findOne({where: {name}}).then(s => s?.image) + + console.log(`${EditSet.name}.handleSubmit:`, {image}) + const [{now}] = await getNow() + const saved = await setRepo.save({ + id: set.id, + name, + created: set.created || now, + reps: Number(reps), + weight: Number(weight), + unit, + image, + minutes: Number(set.minutes ?? 3), + seconds: Number(set.seconds ?? 30), + sets: set.sets ?? 3, + hidden: false, + }) + if (typeof set.id !== 'number') added(saved) + navigation.goBack() + } + + const handleName = useCallback((value: string) => { + setName(value.replace(/,|'/g, '')) + if (value.match(/,|'/)) + toast('Commas and single quotes would break CSV exports') + }, []) + + const handleUnit = useCallback((value: string) => { + setUnit(value.replace(/,|'/g, '')) + if (value.match(/,|'/)) + toast('Commas and single quotes would break CSV exports') + }, []) + + const changeImage = useCallback(async () => { + const {fileCopyUri} = await DocumentPicker.pickSingle({ + type: DocumentPicker.types.images, + copyTo: 'documentDirectory', + }) + if (fileCopyUri) setNewImage(fileCopyUri) + }, []) + + const handleRemove = useCallback(async () => { + setNewImage('') + setRemoveImage(true) + setShowRemove(false) + }, []) return ( <> + - {settings && } + repsRef.current?.focus()} + /> + + weightRef.current?.focus()} + selection={selection} + onSelectionChange={e => setSelection(e.nativeEvent.selection)} + autoFocus={!!name} + innerRef={repsRef} + /> + + + + {settings.showUnit && ( + + )} + + {typeof set.id === 'number' && settings.showDate && ( + + )} + + {settings.images && newImage && ( + setShowRemove(true)}> + + + )} + + {settings.images && !newImage && ( + + )} + + + + + Are you sure you want to remove the image? + ) } diff --git a/SetForm.tsx b/SetForm.tsx deleted file mode 100644 index 81135eb..0000000 --- a/SetForm.tsx +++ /dev/null @@ -1,171 +0,0 @@ -import {format} from 'date-fns' -import {useCallback, useRef, useState} from 'react' -import {TextInput, View} from 'react-native' -import DocumentPicker from 'react-native-document-picker' -import {Button, Card, TouchableRipple} from 'react-native-paper' -import ConfirmDialog from './ConfirmDialog' -import {MARGIN} from './constants' -import {getNow, setRepo} from './db' -import GymSet from './gym-set' -import MassiveInput from './MassiveInput' -import Settings from './settings' -import {toast} from './toast' - -export default function SetForm({ - onSaved, - set, - settings, -}: { - set: GymSet - onSaved: (set: GymSet) => void - settings: Settings -}) { - const [name, setName] = useState(set.name) - const [reps, setReps] = useState(set.reps?.toString()) - const [weight, setWeight] = useState(set.weight?.toString()) - const [newImage, setNewImage] = useState(set.image) - const [unit, setUnit] = useState(set.unit) - const [showRemove, setShowRemove] = useState(false) - const [selection, setSelection] = useState({ - start: 0, - end: set.reps?.toString().length, - }) - const [removeImage, setRemoveImage] = useState(false) - const weightRef = useRef(null) - const repsRef = useRef(null) - const unitRef = useRef(null) - - const handleSubmit = async () => { - console.log(`${SetForm.name}.handleSubmit:`, {set, uri: newImage, name}) - if (!name) return - let image = newImage - if (!newImage && !removeImage) - image = await setRepo.findOne({where: {name}}).then(s => s?.image) - - console.log(`${SetForm.name}.handleSubmit:`, {image}) - const [{now}] = await getNow() - const saved = await setRepo.save({ - id: set.id, - name, - created: set.created || now, - reps: Number(reps), - weight: Number(weight), - unit, - image, - minutes: Number(set.minutes ?? 3), - seconds: Number(set.seconds ?? 30), - sets: set.sets ?? 3, - hidden: false, - }) - onSaved(saved) - } - - const handleName = useCallback((value: string) => { - setName(value.replace(/,|'/g, '')) - if (value.match(/,|'/)) - toast('Commas and single quotes would break CSV exports') - }, []) - - const handleUnit = useCallback((value: string) => { - setUnit(value.replace(/,|'/g, '')) - if (value.match(/,|'/)) - toast('Commas and single quotes would break CSV exports') - }, []) - - const changeImage = useCallback(async () => { - const {fileCopyUri} = await DocumentPicker.pickSingle({ - type: DocumentPicker.types.images, - copyTo: 'documentDirectory', - }) - if (fileCopyUri) setNewImage(fileCopyUri) - }, []) - - const handleRemove = useCallback(async () => { - setNewImage('') - setRemoveImage(true) - setShowRemove(false) - }, []) - - return ( - <> - - repsRef.current?.focus()} - /> - weightRef.current?.focus()} - selection={selection} - onSelectionChange={e => setSelection(e.nativeEvent.selection)} - autoFocus={!!name} - innerRef={repsRef} - /> - - {settings.showUnit && ( - - )} - {typeof set.id === 'number' && settings.showDate && ( - - )} - {settings.images && newImage && ( - setShowRemove(true)}> - - - )} - {settings.images && !newImage && ( - - )} - - - - - - Are you sure you want to remove the image? - - - ) -} diff --git a/StartPlan.tsx b/StartPlan.tsx index 165ee8e..98a9f8d 100644 --- a/StartPlan.tsx +++ b/StartPlan.tsx @@ -11,7 +11,6 @@ import {getNow, setRepo, settingsRepo} from './db' import GymSet from './gym-set' import MassiveInput from './MassiveInput' import {PlanPageParams} from './plan-page-params' -import SetForm from './SetForm' import Settings from './settings' import StackHeader from './StackHeader' import StartPlanItem from './StartPlanItem' @@ -88,7 +87,7 @@ export default function StartPlan() { }, [refresh]) const handleSubmit = async () => { - console.log(`${SetForm.name}.handleSubmit:`, {reps, weight, unit, best}) + console.log(`${StartPlan.name}.handleSubmit:`, {reps, weight, unit, best}) const [{now}] = await getNow() await setRepo.save({ ...best,