Add current workout progress to title of set editing

Related to #48

Should be thoroughly tested before closing.

EditPlan.tsx

@@ -11,8 +11,8 @@ import {Button, IconButton} from 'react-native-paper';
 import {MARGIN, PADDING} from './constants';
 import {DrawerParamList} from './drawer-param-list';
 import MassiveSwitch from './MassiveSwitch';
+import {PlanPageParams} from './plan-page-params';
 import {addPlan, updatePlan} from './plan.service';
-import {PlanPageParams} from './PlanPage';
 import {getNames} from './set.service';
 import {DAYS} from './time';
 

EditSet.tsx

@@ -17,26 +17,30 @@ import {settings} from './settings.service';
 
 export default function EditSet() {
   const {params} = useRoute<RouteProp<HomePageParams, 'EditSet'>>();
+  const {set, count, workouts} = params;
   const navigation = useNavigation();
   const {toast} = useContext(SnackbarContext);
 
   useFocusEffect(
     useCallback(() => {
-      console.log(`${EditSet.name}.focus:`, params);
+      console.log(`${EditSet.name}.focus:`, set);
+      let title = 'Create set';
+      if (typeof set.id === 'number') title = 'Edit set';
+      else if (count > 0) title = `${set.name} (${count + 1} / ${set.sets})`;
       navigation.getParent()?.setOptions({
         headerLeft: () => (
           <IconButton icon="arrow-back" onPress={() => navigation.goBack()} />
         ),
         headerRight: null,
-        title: typeof params.set.id === 'number' ? 'Edit set' : 'Create set',
+        title,
       });
-    }, [navigation, params]),
+    }, [navigation, set, count]),
   );
 
-  const startTimer = useCallback(async (set: Set) => {
+  const startTimer = useCallback(async (_set: Set) => {
     if (!settings.alarm) return;
     const milliseconds =
-      Number(set.minutes) * 60 * 1000 + Number(set.seconds) * 1000;
+      Number(_set.minutes) * 60 * 1000 + Number(_set.seconds) * 1000;
     NativeModules.AlarmModule.timer(
       milliseconds,
       !!settings.vibrate,
@@ -45,41 +49,41 @@ export default function EditSet() {
   }, []);
 
   const update = useCallback(
-    async (set: Set) => {
-      console.log(`${EditSet.name}.update`, set);
-      await updateSet(set);
+    async (_set: Set) => {
+      console.log(`${EditSet.name}.update`, _set);
+      await updateSet(_set);
       navigation.goBack();
     },
     [navigation],
   );
 
   const add = useCallback(
-    async (set: Set) => {
-      console.log(`${EditSet.name}.add`, {set});
-      startTimer(set);
-      await addSet(set);
+    async (_set: Set) => {
+      console.log(`${EditSet.name}.add`, {set: _set});
+      startTimer(_set);
+      await addSet(_set);
       if (!settings.notify) return navigation.goBack();
       if (
-        set.weight > params.set.weight ||
-        (set.reps > params.set.reps && set.weight === params.set.weight)
+        _set.weight > set.weight ||
+        (_set.reps > set.reps && _set.weight === set.weight)
       )
         toast("Great work King, that's a new record!", 3000);
       navigation.goBack();
     },
-    [navigation, startTimer, params.set, toast],
+    [navigation, startTimer, set, toast],
   );
 
   const save = useCallback(
-    async (set: Set) => {
-      if (typeof params.set.id === 'number') return update(set);
-      return add(set);
+    async (_set: Set) => {
+      if (typeof set.id === 'number') return update(_set);
+      return add(_set);
     },
-    [update, add, params.set.id],
+    [update, add, set.id],
   );
 
   return (
     <View style={{padding: PADDING}}>
-      <SetForm save={save} set={params.set} workouts={params.workouts} />
+      <SetForm save={save} set={set} workouts={workouts} />
     </View>
   );
 }

PlanItem.tsx

@@ -3,8 +3,8 @@ import React, {useCallback, useState} from 'react';
 import {GestureResponderEvent} from 'react-native';
 import {List, Menu} from 'react-native-paper';
 import {Plan} from './plan';
+import {PlanPageParams} from './plan-page-params';
 import {deletePlan} from './plan.service';
-import {PlanPageParams} from './PlanPage';
 
 export default function PlanItem({
   item,

PlanList.tsx

@@ -9,9 +9,9 @@ import {List} from 'react-native-paper';
 import DrawerMenu from './DrawerMenu';
 import Page from './Page';
 import {Plan} from './plan';
+import {PlanPageParams} from './plan-page-params';
 import {getPlans} from './plan.service';
 import PlanItem from './PlanItem';
-import {PlanPageParams} from './PlanPage';
 
 export default function PlanList() {
   const [search, setSearch] = useState('');

SetItem.tsx

@@ -35,7 +35,7 @@ export default function SetItem({
     const set: Set = {...item};
     delete set.id;
     setShowMenu(false);
-    navigation.navigate('EditSet', {set, workouts: []});
+    navigation.navigate('EditSet', {set, workouts: [], count: 0});
   }, [navigation, item]);
 
   const longPress = useCallback(

SetList.tsx

@@ -21,6 +21,7 @@ const limit = 15;
 export default function SetList() {
   const [sets, setSets] = useState<Set[]>();
   const [set, setSet] = useState<Set>();
+  const [count, setCount] = useState(0);
   const [workouts, setWorkouts] = useState<string[]>([]);
   const [offset, setOffset] = useState(0);
   const [search, setSearch] = useState('');
@@ -29,20 +30,8 @@ export default function SetList() {
   const [images, setImages] = useState(true);
   const navigation = useNavigation<NavigationProp<HomePageParams>>();
 
-  const refresh = useCallback(async () => {
-    const newSets = await getSets({search: `%${search}%`, limit, offset: 0});
-    console.log(`${SetList.name}.refresh:`, {newSets});
-    if (newSets.length === 0) return setSets([]);
-    setSets(newSets);
-    setOffset(0);
-    setEnd(false);
-  }, [search]);
-
-  useEffect(() => {
-    refresh();
-  }, [search, refresh]);
-
   const predict = useCallback(async () => {
+    setCount(0);
     console.log(`${SetList.name}.predict:`, {settings});
     if (!settings.predict) return setSet({...defaultSet});
     const todaysPlan = await getTodaysPlan();
@@ -55,15 +44,17 @@ export default function SetList() {
     console.log(`${SetList.name}.predict:`, {todaysWorkouts});
     let best = await getBestSet(workout);
     if (todaysWorkouts.includes(todaysSets[0]?.name) && todaysSets.length > 0) {
-      const count = todaysSets.filter(
+      const _count = todaysSets.filter(
         s => s.name === todaysSets[0].name,
       ).length;
       workout = todaysSets[0].name;
       best = await getBestSet(workout);
-      if (count >= Number(best.sets))
+      if (_count >= Number(best.sets))
         best = await getBestSet(
           todaysWorkouts[todaysWorkouts.indexOf(todaysSets[0].name!) + 1],
         );
+      if (best.name === '') setCount(0);
+      else setCount(_count);
     }
     console.log(`${SetList.name}.predict:`, {workout});
     console.log(`${SetList.name}.predict:`, {best});
@@ -71,17 +62,30 @@ export default function SetList() {
     setWorkouts(todaysWorkouts);
   }, []);
 
+  const refresh = useCallback(async () => {
+    predict();
+    const newSets = await getSets({search: `%${search}%`, limit, offset: 0});
+    console.log(`${SetList.name}.refresh:`, {newSets});
+    if (newSets.length === 0) return setSets([]);
+    setSets(newSets);
+    setOffset(0);
+    setEnd(false);
+  }, [search, predict]);
+
   useFocusEffect(
     useCallback(() => {
       refresh();
-      predict();
       navigation.getParent()?.setOptions({
         headerRight: () => <DrawerMenu name="Home" />,
       });
       setImages(!!settings.images);
-    }, [refresh, predict, navigation]),
+    }, [refresh, navigation]),
   );
 
+  useEffect(() => {
+    refresh();
+  }, [search, refresh]);
+
   const renderItem = useCallback(
     ({item}: {item: Set}) => (
       <SetItem
@@ -118,8 +122,9 @@ export default function SetList() {
     navigation.navigate('EditSet', {
       set: set || {...defaultSet},
       workouts,
+      count,
     });
-  }, [navigation, set, workouts]);
+  }, [navigation, set, workouts, count]);
 
   return (
     <Page onAdd={onAdd} search={search} setSearch={setSearch}>

home-page-params.ts

@@ -5,5 +5,6 @@ export type HomePageParams = {
   EditSet: {
     set: Set;
     workouts: string[];
+    count: number;
   };
 };