2022-11-01 03:50:03 +00:00
|
|
|
import {
|
|
|
|
RouteProp,
|
|
|
|
useFocusEffect,
|
|
|
|
useNavigation,
|
|
|
|
useRoute,
|
2023-08-12 03:22:50 +00:00
|
|
|
} from "@react-navigation/native";
|
|
|
|
import { useCallback, useRef, useState } from "react";
|
|
|
|
import { ScrollView, TextInput, View } from "react-native";
|
|
|
|
import DocumentPicker from "react-native-document-picker";
|
|
|
|
import { Button, Card, TouchableRipple } from "react-native-paper";
|
|
|
|
import AppInput from "./AppInput";
|
|
|
|
import ConfirmDialog from "./ConfirmDialog";
|
|
|
|
import { MARGIN, PADDING } from "./constants";
|
|
|
|
import { getNow, planRepo, setRepo, settingsRepo } from "./db";
|
2023-08-12 03:36:24 +00:00
|
|
|
import { fixNumeric } from "./fix-numeric";
|
2023-08-12 03:22:50 +00:00
|
|
|
import { defaultSet } from "./gym-set";
|
|
|
|
import Settings from "./settings";
|
|
|
|
import StackHeader from "./StackHeader";
|
2023-08-12 03:36:24 +00:00
|
|
|
import { toast } from "./toast";
|
2023-08-12 03:22:50 +00:00
|
|
|
import { WorkoutsPageParams } from "./WorkoutsPage";
|
2022-08-26 03:10:28 +00:00
|
|
|
|
|
|
|
export default function EditWorkout() {
|
2023-08-12 03:22:50 +00:00
|
|
|
const { params } = useRoute<RouteProp<WorkoutsPageParams, "EditWorkout">>();
|
|
|
|
const [removeImage, setRemoveImage] = useState(false);
|
|
|
|
const [showRemove, setShowRemove] = useState(false);
|
2023-08-14 01:14:34 +00:00
|
|
|
const [name, setName] = useState(params.gymSet.name);
|
|
|
|
const [steps, setSteps] = useState(params.gymSet.steps);
|
|
|
|
const [uri, setUri] = useState(params.gymSet.image);
|
2022-09-27 04:42:41 +00:00
|
|
|
const [minutes, setMinutes] = useState(
|
2023-08-14 01:14:34 +00:00
|
|
|
params.gymSet.minutes?.toString() ?? "3"
|
2023-08-12 03:22:50 +00:00
|
|
|
);
|
2022-09-27 04:42:41 +00:00
|
|
|
const [seconds, setSeconds] = useState(
|
2023-08-14 01:14:34 +00:00
|
|
|
params.gymSet.seconds?.toString() ?? "30"
|
2023-08-12 03:22:50 +00:00
|
|
|
);
|
2023-08-14 01:14:34 +00:00
|
|
|
const [sets, setSets] = useState(params.gymSet.sets?.toString() ?? "3");
|
2023-08-12 03:22:50 +00:00
|
|
|
const navigation = useNavigation();
|
|
|
|
const setsRef = useRef<TextInput>(null);
|
|
|
|
const stepsRef = useRef<TextInput>(null);
|
|
|
|
const minutesRef = useRef<TextInput>(null);
|
|
|
|
const secondsRef = useRef<TextInput>(null);
|
|
|
|
const [settings, setSettings] = useState<Settings>();
|
2022-11-01 03:50:03 +00:00
|
|
|
|
|
|
|
useFocusEffect(
|
|
|
|
useCallback(() => {
|
2023-08-12 03:22:50 +00:00
|
|
|
settingsRepo.findOne({ where: {} }).then(setSettings);
|
|
|
|
}, [])
|
|
|
|
);
|
2022-08-26 03:10:28 +00:00
|
|
|
|
2022-09-20 23:50:20 +00:00
|
|
|
const update = async () => {
|
2022-10-31 00:20:36 +00:00
|
|
|
await setRepo.update(
|
2023-08-14 01:14:34 +00:00
|
|
|
{ name: params.gymSet.name },
|
2022-10-31 00:20:36 +00:00
|
|
|
{
|
2023-08-14 01:14:34 +00:00
|
|
|
name: name || params.gymSet.name,
|
2022-10-31 00:20:36 +00:00
|
|
|
sets: Number(sets),
|
|
|
|
minutes: +minutes,
|
|
|
|
seconds: +seconds,
|
|
|
|
steps,
|
2023-08-12 03:22:50 +00:00
|
|
|
image: removeImage ? "" : uri,
|
|
|
|
}
|
|
|
|
);
|
2022-10-31 00:20:36 +00:00
|
|
|
await planRepo.query(
|
|
|
|
`UPDATE plans
|
|
|
|
SET workouts = REPLACE(workouts, $1, $2)
|
|
|
|
WHERE workouts LIKE $3`,
|
2023-08-14 01:14:34 +00:00
|
|
|
[params.gymSet.name, name, `%${params.gymSet.name}%`]
|
2023-08-12 03:22:50 +00:00
|
|
|
);
|
|
|
|
navigation.goBack();
|
|
|
|
};
|
2022-08-26 03:10:28 +00:00
|
|
|
|
2022-09-20 23:50:20 +00:00
|
|
|
const add = async () => {
|
2023-08-12 03:22:50 +00:00
|
|
|
const now = await getNow();
|
2022-10-31 00:20:36 +00:00
|
|
|
await setRepo.save({
|
2022-11-04 03:02:06 +00:00
|
|
|
...defaultSet,
|
2022-09-20 23:50:20 +00:00
|
|
|
name,
|
|
|
|
hidden: true,
|
|
|
|
image: uri,
|
2022-09-24 02:48:52 +00:00
|
|
|
minutes: minutes ? +minutes : 3,
|
|
|
|
seconds: seconds ? +seconds : 30,
|
|
|
|
sets: sets ? +sets : 3,
|
2022-09-23 01:52:33 +00:00
|
|
|
steps,
|
2022-10-31 00:20:36 +00:00
|
|
|
created: now,
|
2023-08-12 03:22:50 +00:00
|
|
|
});
|
|
|
|
navigation.goBack();
|
|
|
|
};
|
2022-08-26 03:10:28 +00:00
|
|
|
|
2022-09-20 23:50:20 +00:00
|
|
|
const save = async () => {
|
2023-08-14 01:14:34 +00:00
|
|
|
if (params.gymSet.name) return update();
|
2023-08-12 03:22:50 +00:00
|
|
|
return add();
|
|
|
|
};
|
2022-08-26 03:10:28 +00:00
|
|
|
|
2022-08-28 08:55:12 +00:00
|
|
|
const changeImage = useCallback(async () => {
|
2023-06-27 03:16:59 +00:00
|
|
|
const { fileCopyUri } = await DocumentPicker.pickSingle({
|
2022-11-21 05:44:12 +00:00
|
|
|
type: DocumentPicker.types.images,
|
2023-08-12 03:22:50 +00:00
|
|
|
copyTo: "documentDirectory",
|
|
|
|
});
|
|
|
|
if (fileCopyUri) setUri(fileCopyUri);
|
|
|
|
}, []);
|
2022-08-28 08:55:12 +00:00
|
|
|
|
2022-09-19 02:57:42 +00:00
|
|
|
const handleRemove = useCallback(async () => {
|
2023-08-12 03:22:50 +00:00
|
|
|
setUri("");
|
|
|
|
setRemoveImage(true);
|
|
|
|
setShowRemove(false);
|
|
|
|
}, []);
|
2022-09-18 06:15:58 +00:00
|
|
|
|
2022-09-30 02:14:53 +00:00
|
|
|
const submitName = () => {
|
2023-08-12 03:22:50 +00:00
|
|
|
if (settings.steps) stepsRef.current?.focus();
|
|
|
|
else setsRef.current?.focus();
|
|
|
|
};
|
2022-09-30 02:14:53 +00:00
|
|
|
|
2022-08-26 03:10:28 +00:00
|
|
|
return (
|
2022-10-23 06:13:58 +00:00
|
|
|
<>
|
2023-08-14 01:14:34 +00:00
|
|
|
<StackHeader
|
|
|
|
title={params.gymSet.name ? "Edit workout" : "Add workout"}
|
|
|
|
/>
|
2023-06-27 03:16:59 +00:00
|
|
|
<View style={{ padding: PADDING, flex: 1 }}>
|
|
|
|
<ScrollView style={{ flex: 1 }}>
|
2022-12-29 00:57:19 +00:00
|
|
|
<AppInput
|
2022-10-23 06:13:58 +00:00
|
|
|
autoFocus
|
2023-08-12 03:22:50 +00:00
|
|
|
label="Name"
|
2022-10-23 06:13:58 +00:00
|
|
|
value={name}
|
2022-12-08 01:50:10 +00:00
|
|
|
onChangeText={setName}
|
2022-10-23 06:13:58 +00:00
|
|
|
onSubmitEditing={submitName}
|
2022-09-24 05:29:52 +00:00
|
|
|
/>
|
2022-11-01 06:25:05 +00:00
|
|
|
{settings?.steps && (
|
2022-12-29 00:57:19 +00:00
|
|
|
<AppInput
|
2022-10-23 06:13:58 +00:00
|
|
|
innerRef={stepsRef}
|
|
|
|
selectTextOnFocus={false}
|
|
|
|
value={steps}
|
2022-12-08 01:50:10 +00:00
|
|
|
onChangeText={setSteps}
|
2023-08-12 03:22:50 +00:00
|
|
|
label="Steps"
|
2022-10-23 06:13:58 +00:00
|
|
|
multiline
|
|
|
|
onSubmitEditing={() => setsRef.current?.focus()}
|
2022-10-04 01:46:15 +00:00
|
|
|
/>
|
2022-10-23 06:13:58 +00:00
|
|
|
)}
|
2022-12-29 00:57:19 +00:00
|
|
|
<AppInput
|
2022-11-05 04:31:18 +00:00
|
|
|
innerRef={setsRef}
|
|
|
|
value={sets}
|
2023-08-12 03:36:24 +00:00
|
|
|
onChangeText={(newSets) => {
|
|
|
|
const fixed = fixNumeric(newSets);
|
|
|
|
setSets(fixed);
|
|
|
|
if (fixed.length !== newSets.length)
|
|
|
|
toast("Sets must be a number");
|
|
|
|
}}
|
2023-08-12 03:22:50 +00:00
|
|
|
label="Sets per workout"
|
|
|
|
keyboardType="numeric"
|
2022-11-05 04:31:18 +00:00
|
|
|
onSubmitEditing={() => minutesRef.current?.focus()}
|
|
|
|
/>
|
2022-11-01 06:25:05 +00:00
|
|
|
{settings?.alarm && (
|
2022-10-23 06:13:58 +00:00
|
|
|
<>
|
2022-12-29 00:57:19 +00:00
|
|
|
<AppInput
|
2022-10-23 06:13:58 +00:00
|
|
|
innerRef={minutesRef}
|
|
|
|
onSubmitEditing={() => secondsRef.current?.focus()}
|
|
|
|
value={minutes}
|
2023-08-12 03:36:24 +00:00
|
|
|
onChangeText={(newMinutes) => {
|
|
|
|
const fixed = fixNumeric(newMinutes);
|
|
|
|
setMinutes(fixed);
|
|
|
|
if (fixed.length !== newMinutes.length)
|
|
|
|
toast("Reps must be a number");
|
|
|
|
}}
|
2023-08-12 03:22:50 +00:00
|
|
|
label="Rest minutes"
|
|
|
|
keyboardType="numeric"
|
2022-10-23 06:13:58 +00:00
|
|
|
/>
|
2022-12-29 00:57:19 +00:00
|
|
|
<AppInput
|
2022-10-23 06:13:58 +00:00
|
|
|
innerRef={secondsRef}
|
|
|
|
value={seconds}
|
|
|
|
onChangeText={setSeconds}
|
2023-08-12 03:22:50 +00:00
|
|
|
label="Rest seconds"
|
|
|
|
keyboardType="numeric"
|
2022-10-23 06:13:58 +00:00
|
|
|
blurOnSubmit
|
|
|
|
/>
|
|
|
|
</>
|
|
|
|
)}
|
2022-11-01 06:25:05 +00:00
|
|
|
{settings?.images && uri && (
|
2022-10-23 06:13:58 +00:00
|
|
|
<TouchableRipple
|
2023-06-27 03:16:59 +00:00
|
|
|
style={{ marginBottom: MARGIN }}
|
2022-10-23 06:13:58 +00:00
|
|
|
onPress={changeImage}
|
2023-06-27 03:16:59 +00:00
|
|
|
onLongPress={() => setShowRemove(true)}
|
|
|
|
>
|
|
|
|
<Card.Cover source={{ uri }} />
|
2022-10-23 06:13:58 +00:00
|
|
|
</TouchableRipple>
|
|
|
|
)}
|
2022-11-01 06:25:05 +00:00
|
|
|
{settings?.images && !uri && (
|
2022-10-23 06:13:58 +00:00
|
|
|
<Button
|
2023-06-27 03:16:59 +00:00
|
|
|
style={{ marginBottom: MARGIN }}
|
2022-10-23 06:13:58 +00:00
|
|
|
onPress={changeImage}
|
2023-08-12 03:22:50 +00:00
|
|
|
icon="add-photo-alternate"
|
2023-06-27 03:16:59 +00:00
|
|
|
>
|
2022-10-23 06:13:58 +00:00
|
|
|
Image
|
|
|
|
</Button>
|
|
|
|
)}
|
|
|
|
</ScrollView>
|
2023-08-12 03:22:50 +00:00
|
|
|
<Button disabled={!name} mode="outlined" icon="save" onPress={save}>
|
2022-10-23 06:13:58 +00:00
|
|
|
Save
|
|
|
|
</Button>
|
|
|
|
<ConfirmDialog
|
2023-08-12 03:22:50 +00:00
|
|
|
title="Remove image"
|
2022-10-23 06:13:58 +00:00
|
|
|
onOk={handleRemove}
|
|
|
|
show={showRemove}
|
2023-06-27 03:16:59 +00:00
|
|
|
setShow={setShowRemove}
|
|
|
|
>
|
2022-10-23 06:13:58 +00:00
|
|
|
Are you sure you want to remove the image?
|
|
|
|
</ConfirmDialog>
|
|
|
|
</View>
|
|
|
|
</>
|
2023-08-12 03:22:50 +00:00
|
|
|
);
|
2022-08-26 03:10:28 +00:00
|
|
|
}
|