diff --git a/BestList.tsx b/BestList.tsx
index 4e515ee..6e982f3 100644
--- a/BestList.tsx
+++ b/BestList.tsx
@@ -8,7 +8,7 @@ import {FlatList, Image} from 'react-native';
import {List} from 'react-native-paper';
import {getBestReps, getBestWeights} from './best.service';
import {BestPageParams} from './BestPage';
-import Header from './Header';
+import DrawerHeader from './DrawerHeader';
import Page from './Page';
import Set from './set';
import {useSettings} from './use-settings';
@@ -33,10 +33,7 @@ export default function BestList() {
useFocusEffect(
useCallback(() => {
refresh();
- navigation.getParent()?.setOptions({
- headerRight: () => null,
- });
- }, [refresh, navigation]),
+ }, [refresh]),
);
useEffect(() => {
@@ -60,7 +57,7 @@ export default function BestList() {
return (
<>
-
+
{bests?.length === 0 ? (
>();
-
return (
- {
- navigation.setOptions({
- headerLeft: () => (
-
- ),
- title: 'Best',
- });
- },
- }}
- />
+
);
}
diff --git a/Header.tsx b/DrawerHeader.tsx
similarity index 56%
rename from Header.tsx
rename to DrawerHeader.tsx
index 66ca0b1..34c90d3 100644
--- a/Header.tsx
+++ b/DrawerHeader.tsx
@@ -1,15 +1,16 @@
+import {DrawerNavigationProp} from '@react-navigation/drawer';
import {useNavigation} from '@react-navigation/native';
import React from 'react';
import {Appbar, IconButton} from 'react-native-paper';
import {DrawerParamList} from './drawer-param-list';
import DrawerMenu from './DrawerMenu';
-export default function Header({name}: {name: keyof DrawerParamList}) {
- const navigation = useNavigation();
+export default function DrawerHeader({name}: {name: keyof DrawerParamList}) {
+ const navigation = useNavigation>();
return (
-
+
diff --git a/EditPlan.tsx b/EditPlan.tsx
index c7c364b..0e65214 100644
--- a/EditPlan.tsx
+++ b/EditPlan.tsx
@@ -1,18 +1,18 @@
import {
NavigationProp,
RouteProp,
- useFocusEffect,
useNavigation,
useRoute,
} from '@react-navigation/native';
import React, {useCallback, useEffect, useState} from 'react';
import {ScrollView, StyleSheet, View} from 'react-native';
-import {Button, IconButton, Text} from 'react-native-paper';
+import {Button, Text} from 'react-native-paper';
import {MARGIN, PADDING} from './constants';
import {DrawerParamList} from './drawer-param-list';
import {PlanPageParams} from './plan-page-params';
import {addPlan, updatePlan} from './plan.service';
import {getNames} from './set.service';
+import StackHeader from './StackHeader';
import Switch from './Switch';
import {DAYS} from './time';
@@ -28,19 +28,6 @@ export default function EditPlan() {
const [names, setNames] = useState([]);
const navigation = useNavigation>();
- useFocusEffect(
- useCallback(() => {
- console.log(`${EditPlan.name}.focus:`, {plan});
- navigation.getParent()?.setOptions({
- headerLeft: () => (
- navigation.goBack()} />
- ),
- headerRight: () => null,
- title: plan.id ? 'Edit plan' : 'Create plan',
- });
- }, [navigation, plan]),
- );
-
useEffect(() => {
getNames().then(n => {
console.log(EditPlan.name, {n});
@@ -87,59 +74,62 @@ export default function EditPlan() {
);
return (
-
-
- Days
- {DAYS.map(day => (
- toggleDay(value, day)}
- onPress={() => toggleDay(!days.includes(day), day)}
- value={days.includes(day)}>
- {day}
-
- ))}
- Workouts
- {names.length === 0 ? (
-
- No workouts found.
-
- ) : (
- names.map(name => (
+ <>
+
+
+
+ Days
+ {DAYS.map(day => (
toggleWorkout(value, name)}
- value={workouts.includes(name)}
- onPress={() => toggleWorkout(!workouts.includes(name), name)}>
- {name}
+ key={day}
+ onValueChange={value => toggleDay(value, day)}
+ onPress={() => toggleDay(!days.includes(day), day)}
+ value={days.includes(day)}>
+ {day}
- ))
+ ))}
+ Workouts
+ {names.length === 0 ? (
+
+ No workouts found.
+
+ ) : (
+ names.map(name => (
+ toggleWorkout(value, name)}
+ value={workouts.includes(name)}
+ onPress={() => toggleWorkout(!workouts.includes(name), name)}>
+ {name}
+
+ ))
+ )}
+
+ {names.length === 0 ? (
+
+ ) : (
+
)}
-
- {names.length === 0 ? (
-
- ) : (
-
- )}
-
+
+ >
);
}
diff --git a/EditSet.tsx b/EditSet.tsx
index ce31341..7c1046f 100644
--- a/EditSet.tsx
+++ b/EditSet.tsx
@@ -1,18 +1,13 @@
-import {
- RouteProp,
- useFocusEffect,
- useNavigation,
- useRoute,
-} from '@react-navigation/native';
+import {RouteProp, useNavigation, useRoute} from '@react-navigation/native';
import React, {useCallback} from 'react';
import {NativeModules, View} from 'react-native';
-import {IconButton} from 'react-native-paper';
import {PADDING} from './constants';
import {HomePageParams} from './home-page-params';
import {useSnackbar} from './MassiveSnack';
import Set from './set';
import {addSet, getSet, updateSet} from './set.service';
import SetForm from './SetForm';
+import StackHeader from './StackHeader';
import {useSettings} from './use-settings';
export default function EditSet() {
@@ -22,21 +17,6 @@ export default function EditSet() {
const {toast} = useSnackbar();
const {settings} = useSettings();
- useFocusEffect(
- useCallback(() => {
- console.log(`${EditSet.name}.focus:`, set);
- let title = 'Create set';
- if (typeof set.id === 'number') title = 'Edit set';
- navigation.getParent()?.setOptions({
- headerLeft: () => (
- navigation.goBack()} />
- ),
- headerRight: null,
- title,
- });
- }, [navigation, set]),
- );
-
const startTimer = useCallback(
async (name: string) => {
if (!settings.alarm) return;
@@ -85,8 +65,11 @@ export default function EditSet() {
);
return (
-
-
-
+ <>
+
+
+
+
+ >
);
}
diff --git a/EditWorkout.tsx b/EditWorkout.tsx
index c1bd5f1..e6a90c6 100644
--- a/EditWorkout.tsx
+++ b/EditWorkout.tsx
@@ -1,19 +1,15 @@
-import {
- RouteProp,
- useFocusEffect,
- useNavigation,
- useRoute,
-} from '@react-navigation/native';
+import {RouteProp, useNavigation, useRoute} from '@react-navigation/native';
import React, {useCallback, useRef, useState} from 'react';
import {ScrollView, TextInput, View} from 'react-native';
import DocumentPicker from 'react-native-document-picker';
-import {Button, Card, IconButton, TouchableRipple} from 'react-native-paper';
+import {Button, Card, TouchableRipple} from 'react-native-paper';
import ConfirmDialog from './ConfirmDialog';
import {MARGIN, PADDING} from './constants';
import MassiveInput from './MassiveInput';
import {useSnackbar} from './MassiveSnack';
import {updatePlanWorkouts} from './plan.service';
import {addSet, updateManySet, updateSetImage} from './set.service';
+import StackHeader from './StackHeader';
import {useSettings} from './use-settings';
import {WorkoutsPageParams} from './WorkoutsPage';
@@ -39,19 +35,6 @@ export default function EditWorkout() {
const secondsRef = useRef(null);
const {settings} = useSettings();
- useFocusEffect(
- useCallback(() => {
- navigation.getParent()?.setOptions({
- headerLeft: () => (
- navigation.goBack()} />
- ),
- headerRight: null,
- title: params.value.name || 'New workout',
- });
- if (!name) return;
- }, [navigation, name, params.value.name]),
- );
-
const update = async () => {
await updateManySet({
oldName: params.value.name,
@@ -118,83 +101,86 @@ export default function EditWorkout() {
};
return (
-
-
-
- {!!settings.steps && (
+ <>
+
+
+
setsRef.current?.focus()}
+ autoFocus
+ label="Name"
+ value={name}
+ onChangeText={handleName}
+ onSubmitEditing={submitName}
/>
- )}
- {!!settings.showSets && (
- minutesRef.current?.focus()}
- />
- )}
- {!!settings.alarm && (
- <>
+ {!!settings.steps && (
secondsRef.current?.focus()}
- value={minutes}
- onChangeText={setMinutes}
- label="Rest minutes"
- keyboardType="numeric"
+ innerRef={stepsRef}
+ selectTextOnFocus={false}
+ value={steps}
+ onChangeText={handleSteps}
+ label="Steps"
+ multiline
+ onSubmitEditing={() => setsRef.current?.focus()}
/>
+ )}
+ {!!settings.showSets && (
minutesRef.current?.focus()}
/>
- >
- )}
- {!!settings.images && uri && (
- setShowRemove(true)}>
-
-
- )}
- {!!settings.images && !uri && (
-
- )}
-
-
-
- Are you sure you want to remove the image?
-
-
+ )}
+ {!!settings.alarm && (
+ <>
+ secondsRef.current?.focus()}
+ value={minutes}
+ onChangeText={setMinutes}
+ label="Rest minutes"
+ keyboardType="numeric"
+ />
+
+ >
+ )}
+ {!!settings.images && uri && (
+ setShowRemove(true)}>
+
+
+ )}
+ {!!settings.images && !uri && (
+
+ )}
+
+
+
+ Are you sure you want to remove the image?
+
+
+ >
);
}
diff --git a/HomePage.tsx b/HomePage.tsx
index fc0350e..61cc472 100644
--- a/HomePage.tsx
+++ b/HomePage.tsx
@@ -1,9 +1,5 @@
-import {DrawerNavigationProp} from '@react-navigation/drawer';
-import {useNavigation} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import React from 'react';
-import {IconButton} from 'react-native-paper';
-import {DrawerParamList} from './drawer-param-list';
import EditSet from './EditSet';
import {HomePageParams} from './home-page-params';
import SetList from './SetList';
@@ -11,26 +7,11 @@ import SetList from './SetList';
const Stack = createStackNavigator();
export default function HomePage() {
- const navigation = useNavigation>();
-
return (
- {
- navigation.setOptions({
- headerLeft: () => (
-
- ),
- title: 'Home',
- });
- },
- }}
- />
+
);
}
diff --git a/PlanList.tsx b/PlanList.tsx
index 1f06b76..af2dd85 100644
--- a/PlanList.tsx
+++ b/PlanList.tsx
@@ -6,8 +6,7 @@ import {
import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native';
import {List} from 'react-native-paper';
-import DrawerMenu from './DrawerMenu';
-import Header from './Header';
+import DrawerHeader from './DrawerHeader';
import Page from './Page';
import {Plan} from './plan';
import {PlanPageParams} from './plan-page-params';
@@ -26,10 +25,7 @@ export default function PlanList() {
useFocusEffect(
useCallback(() => {
refresh();
- navigation.getParent()?.setOptions({
- headerRight: () => ,
- });
- }, [refresh, navigation]),
+ }, [refresh]),
);
useEffect(() => {
@@ -48,7 +44,7 @@ export default function PlanList() {
return (
<>
-
+
{plans?.length === 0 ? (
();
export default function PlanPage() {
- const navigation = useNavigation>();
-
return (
- {
- navigation.setOptions({
- headerLeft: () => (
-
- ),
- title: 'Plans',
- });
- },
- }}
- />
- {
- navigation.setOptions({
- headerLeft: () => (
-
- ),
- title: 'Plans',
- });
- },
- }}
- />
+
+
);
}
diff --git a/SetList.tsx b/SetList.tsx
index 43bbed1..dfde9a0 100644
--- a/SetList.tsx
+++ b/SetList.tsx
@@ -6,7 +6,7 @@ import {
import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native';
import {List} from 'react-native-paper';
-import Header from './Header';
+import DrawerHeader from './DrawerHeader';
import {HomePageParams} from './home-page-params';
import Page from './Page';
import Set from './set';
@@ -84,7 +84,7 @@ export default function SetList() {
return (
<>
-
+
{sets?.length === 0 ? (
-
+
{switches
diff --git a/StackHeader.tsx b/StackHeader.tsx
new file mode 100644
index 0000000..aa45a5d
--- /dev/null
+++ b/StackHeader.tsx
@@ -0,0 +1,30 @@
+import {useNavigation} from '@react-navigation/native';
+import React from 'react';
+import Share from 'react-native-share';
+import {FileSystem} from 'react-native-file-access';
+import {Appbar, IconButton} from 'react-native-paper';
+import {captureScreen} from 'react-native-view-shot';
+
+export default function StackHeader({title}: {title: string}) {
+ const navigation = useNavigation();
+
+ return (
+
+
+
+
+ captureScreen().then(async uri => {
+ const base64 = await FileSystem.readFile(uri, 'base64');
+ const url = `data:image/jpeg;base64,${base64}`;
+ Share.open({
+ type: 'image/jpeg',
+ url,
+ });
+ })
+ }
+ icon="share"
+ />
+
+ );
+}
diff --git a/StartPlan.tsx b/StartPlan.tsx
index bd416fd..06d9ca3 100644
--- a/StartPlan.tsx
+++ b/StartPlan.tsx
@@ -1,13 +1,8 @@
-import {
- RouteProp,
- useFocusEffect,
- useNavigation,
- useRoute,
-} from '@react-navigation/native';
+import {RouteProp, useFocusEffect, useRoute} from '@react-navigation/native';
import React, {useCallback, useMemo, useRef, useState} from 'react';
import {NativeModules, TextInput, View} from 'react-native';
import {FlatList} from 'react-native-gesture-handler';
-import {Button, IconButton, List, RadioButton} from 'react-native-paper';
+import {Button, List, RadioButton} from 'react-native-paper';
import {getBestSet} from './best.service';
import {useColor} from './color';
import {PADDING} from './constants';
@@ -18,6 +13,7 @@ import {PlanPageParams} from './plan-page-params';
import Set from './set';
import {addSet, countManyToday, getDistinctSets} from './set.service';
import SetForm from './SetForm';
+import StackHeader from './StackHeader';
import {useSettings} from './use-settings';
export default function StartPlan() {
@@ -38,7 +34,6 @@ export default function StartPlan() {
const weightRef = useRef(null);
const repsRef = useRef(null);
const unitRef = useRef(null);
- const navigation = useNavigation();
const workouts = useMemo(() => params.plan.workouts.split(','), [params]);
const {color} = useColor();
@@ -49,13 +44,6 @@ export default function StartPlan() {
useFocusEffect(
useCallback(() => {
- navigation.getParent()?.setOptions({
- headerLeft: () => (
- navigation.goBack()} />
- ),
- headerRight: null,
- title: params.plan.days.replace(/,/g, ', '),
- });
countManyToday().then(newCounts => {
setCounts(newCounts);
console.log(`${StartPlan.name}.focus:`, {newCounts});
@@ -66,7 +54,7 @@ export default function StartPlan() {
console.log(`${StartPlan.name}.focus:`, {newDistinct});
},
);
- }, [navigation, params]),
+ }, [params]),
);
const handleSubmit = async () => {
@@ -129,70 +117,74 @@ export default function StartPlan() {
if (!distinctSets) return;
const distinct = distinctSets.find(d => d.name === countName);
console.log(`${StartPlan.name}:`, {distinct});
- if (settings.showSets) return `${count?.total || 0} / ${distinct?.sets}`;
+ if (settings.showSets)
+ return `${count?.total || 0} / ${distinct?.sets || 3}`;
return count?.total || '0';
},
[counts, distinctSets, settings.showSets],
);
return (
-
-
- weightRef.current?.focus()}
- selection={selection}
- onSelectionChange={e => setSelection(e.nativeEvent.selection)}
- innerRef={repsRef}
- />
-
- {!!settings.showUnit && (
+ <>
+
+
+
weightRef.current?.focus()}
+ selection={selection}
+ onSelectionChange={e => setSelection(e.nativeEvent.selection)}
+ innerRef={repsRef}
/>
- )}
- {counts && distinctSets && (
- (
- select(index)}
- left={() => (
-
- select(index)}
- value={index.toString()}
- status={selected === index ? 'checked' : 'unchecked'}
- color={color}
- />
-
- )}
- />
- )}
+
- )}
+ {!!settings.showUnit && (
+
+ )}
+ {counts && distinctSets && (
+ (
+ select(index)}
+ left={() => (
+
+ select(index)}
+ value={index.toString()}
+ status={selected === index ? 'checked' : 'unchecked'}
+ color={color}
+ />
+
+ )}
+ />
+ )}
+ />
+ )}
+
+
-
-
+ >
);
}
diff --git a/ViewBest.tsx b/ViewBest.tsx
index b76b59b..4a614cf 100644
--- a/ViewBest.tsx
+++ b/ViewBest.tsx
@@ -1,16 +1,7 @@
import {Picker} from '@react-native-picker/picker';
-import {
- RouteProp,
- useFocusEffect,
- useNavigation,
- useRoute,
-} from '@react-navigation/native';
-import React, {useCallback, useEffect, useState} from 'react';
+import {RouteProp, useRoute} from '@react-navigation/native';
+import React, {useEffect, useState} from 'react';
import {View} from 'react-native';
-import {FileSystem} from 'react-native-file-access';
-import {IconButton} from 'react-native-paper';
-import Share from 'react-native-share';
-import {captureScreen} from 'react-native-view-shot';
import {getOneRepMax, getVolumes, getWeightsBy} from './best.service';
import {BestPageParams} from './BestPage';
import Chart from './Chart';
@@ -18,6 +9,7 @@ import {PADDING} from './constants';
import {Metrics} from './metrics';
import {Periods} from './periods';
import Set from './set';
+import StackHeader from './StackHeader';
import {formatMonth} from './time';
import useDark from './use-dark';
import Volume from './volume';
@@ -29,34 +21,6 @@ export default function ViewBest() {
const [volumes, setVolumes] = useState([]);
const [metric, setMetric] = useState(Metrics.Weight);
const [period, setPeriod] = useState(Periods.Monthly);
- const navigation = useNavigation();
-
- useFocusEffect(
- useCallback(() => {
- console.log(`${ViewBest.name}.useFocusEffect`);
- navigation.getParent()?.setOptions({
- headerLeft: () => (
- navigation.goBack()} />
- ),
- headerRight: () => (
-
- captureScreen().then(async uri => {
- const base64 = await FileSystem.readFile(uri, 'base64');
- const url = `data:image/jpeg;base64,${base64}`;
- Share.open({
- type: 'image/jpeg',
- url,
- });
- })
- }
- icon="share"
- />
- ),
- title: params.best.name,
- });
- }, [navigation, params.best]),
- );
useEffect(() => {
console.log(`${ViewBest.name}.useEffect`, {metric});
@@ -74,44 +38,47 @@ export default function ViewBest() {
}, [params.best.name, metric, period]);
return (
-
- setMetric(value)}>
-
-
-
-
- setPeriod(value)}>
-
-
-
-
- {metric === Metrics.Volume ? (
- v.value)}
- yFormat={(value: number) =>
- `${value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')}${
- volumes[0].unit
- }`
- }
- xData={weights}
- xFormat={(_value, index) => formatMonth(weights[index].created!)}
- />
- ) : (
- set.weight)}
- yFormat={value => `${value}${weights[0].unit}`}
- xData={weights}
- xFormat={(_value, index) => formatMonth(weights[index].created!)}
- />
- )}
-
+ <>
+
+
+ setMetric(value)}>
+
+
+
+
+ setPeriod(value)}>
+
+
+
+
+ {metric === Metrics.Volume ? (
+ v.value)}
+ yFormat={(value: number) =>
+ `${value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')}${
+ volumes[0].unit
+ }`
+ }
+ xData={weights}
+ xFormat={(_value, index) => formatMonth(weights[index].created!)}
+ />
+ ) : (
+ set.weight)}
+ yFormat={value => `${value}${weights[0].unit}`}
+ xData={weights}
+ xFormat={(_value, index) => formatMonth(weights[index].created!)}
+ />
+ )}
+
+ >
);
}
diff --git a/WorkoutList.tsx b/WorkoutList.tsx
index 38fbe5c..493439c 100644
--- a/WorkoutList.tsx
+++ b/WorkoutList.tsx
@@ -6,7 +6,7 @@ import {
import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native';
import {List} from 'react-native-paper';
-import Header from './Header';
+import DrawerHeader from './DrawerHeader';
import Page from './Page';
import Set from './set';
import {getDistinctSets} from './set.service';
@@ -81,7 +81,7 @@ export default function WorkoutList() {
return (
<>
-
+
{workouts?.length === 0 ? (
();
export default function WorkoutsPage() {
- const navigation = useNavigation>();
-
return (
- {
- navigation.setOptions({
- headerLeft: () => (
-
- ),
- title: 'Workouts',
- });
- },
- }}
- />
+
);
}