From 8a74d750c46361f3ac2ce931a35077e1867fbfc1 Mon Sep 17 00:00:00 2001
From: Brandon Presley <brandon@presley.nz>
Date: Thu, 29 Sep 2022 12:50:56 +1300
Subject: [PATCH] Fix back logic

---
 EditPlan.tsx    | 15 ++++++++++++---
 EditSet.tsx     | 18 ++++++++++++++++--
 EditWorkout.tsx | 21 +++++++++++++++------
 Routes.tsx      | 10 ++--------
 4 files changed, 45 insertions(+), 19 deletions(-)

diff --git a/EditPlan.tsx b/EditPlan.tsx
index 4766da4..2e743c0 100644
--- a/EditPlan.tsx
+++ b/EditPlan.tsx
@@ -6,7 +6,7 @@ import {
   useRoute,
 } from '@react-navigation/native';
 import React, {useCallback, useEffect, useState} from 'react';
-import {ScrollView, StyleSheet, View} from 'react-native';
+import {BackHandler, ScrollView, StyleSheet, View} from 'react-native';
 import {Button, IconButton, Text} from 'react-native-paper';
 import {MARGIN, PADDING} from './constants';
 import {DrawerParamList} from './drawer-param-list';
@@ -30,13 +30,22 @@ export default function EditPlan() {
   useFocusEffect(
     useCallback(() => {
       console.log(`${EditPlan.name}.focus:`, {plan});
-      navigation.getParent()?.setOptions({
+      navigation.setOptions({
         headerLeft: () => (
-          <IconButton icon="arrow-back" onPress={() => navigation.goBack()} />
+          <IconButton
+            icon="arrow-back"
+            onPress={() => navigation.navigate('Plans', {})}
+          />
         ),
         headerRight: () => null,
         title: plan.id ? 'Edit plan' : 'Create plan',
       });
+      const onBack = () => {
+        navigation.navigate('Plans', {});
+        return true;
+      };
+      BackHandler.addEventListener('hardwareBackPress', onBack);
+      return () => BackHandler.removeEventListener('hardwareBackPress', onBack);
     }, [navigation, plan]),
   );
 
diff --git a/EditSet.tsx b/EditSet.tsx
index 8f1b7ba..0587aef 100644
--- a/EditSet.tsx
+++ b/EditSet.tsx
@@ -1,11 +1,13 @@
 import {
+  NavigationProp,
   RouteProp,
   useFocusEffect,
   useNavigation,
   useRoute,
 } from '@react-navigation/native';
 import React, {useCallback, useContext} from 'react';
-import {NativeModules, View} from 'react-native';
+import {BackHandler, NativeModules, View} from 'react-native';
+import {IconButton} from 'react-native-paper';
 import {PADDING} from './constants';
 import {DrawerParamList} from './drawer-param-list';
 import {SnackbarContext} from './MassiveSnack';
@@ -17,7 +19,7 @@ import {getSettings, settings, updateSettings} from './settings.service';
 export default function EditSet() {
   const {params} = useRoute<RouteProp<DrawerParamList, 'Edit set'>>();
   const {set, count, workouts} = params;
-  const navigation = useNavigation();
+  const navigation = useNavigation<NavigationProp<DrawerParamList>>();
   const {toast} = useContext(SnackbarContext);
 
   useFocusEffect(
@@ -29,7 +31,19 @@ export default function EditSet() {
         title = `${set.name} (${count + 1} / ${set.sets})`;
       navigation.setOptions({
         title,
+        headerLeft: () => (
+          <IconButton
+            icon="arrow-back"
+            onPress={() => navigation.navigate('Home', {})}
+          />
+        ),
       });
+      const onBack = () => {
+        navigation.navigate('Home', {});
+        return true;
+      };
+      BackHandler.addEventListener('hardwareBackPress', onBack);
+      return () => BackHandler.removeEventListener('hardwareBackPress', onBack);
     }, [navigation, set, count]),
   );
 
diff --git a/EditWorkout.tsx b/EditWorkout.tsx
index 01981ea..7572dab 100644
--- a/EditWorkout.tsx
+++ b/EditWorkout.tsx
@@ -1,11 +1,12 @@
 import {
+  NavigationProp,
   RouteProp,
   useFocusEffect,
   useNavigation,
   useRoute,
 } from '@react-navigation/native';
 import React, {useCallback, useContext, useState} from 'react';
-import {ScrollView, View} from 'react-native';
+import {BackHandler, ScrollView, View} from 'react-native';
 import DocumentPicker from 'react-native-document-picker';
 import {Button, Card, IconButton, TouchableRipple} from 'react-native-paper';
 import ConfirmDialog from './ConfirmDialog';
@@ -32,19 +33,27 @@ export default function EditWorkout() {
   );
   const [sets, setSets] = useState(params.value.sets?.toString() ?? '3');
   const {toast} = useContext(SnackbarContext);
-  const navigation = useNavigation();
+  const navigation = useNavigation<NavigationProp<DrawerParamList>>();
 
   useFocusEffect(
     useCallback(() => {
-      navigation.getParent()?.setOptions({
+      navigation.setOptions({
         headerLeft: () => (
-          <IconButton icon="arrow-back" onPress={() => navigation.goBack()} />
+          <IconButton
+            icon="arrow-back"
+            onPress={() => navigation.navigate('Workouts', {})}
+          />
         ),
         headerRight: null,
         title: params.value.name || 'New workout',
       });
-      if (!name) return;
-    }, [navigation, name, params.value.name]),
+      const onBack = () => {
+        navigation.navigate('Workouts', {});
+        return true;
+      };
+      BackHandler.addEventListener('hardwareBackPress', onBack);
+      return () => BackHandler.removeEventListener('hardwareBackPress', onBack);
+    }, [navigation, params.value.name]),
   );
 
   const update = async () => {
diff --git a/Routes.tsx b/Routes.tsx
index 571eec0..47d9b59 100644
--- a/Routes.tsx
+++ b/Routes.tsx
@@ -1,5 +1,5 @@
 import {createDrawerNavigator} from '@react-navigation/drawer';
-import {useNavigation} from '@react-navigation/native';
+import {NavigationProp, useNavigation} from '@react-navigation/native';
 import React, {useContext, useEffect, useState} from 'react';
 import {useColorScheme} from 'react-native';
 import {IconButton} from 'react-native-paper';
@@ -25,7 +25,7 @@ export default function Routes() {
   const [migrated, setMigrated] = useState(false);
   const dark = useColorScheme() === 'dark';
   const {setColor} = useContext(CustomTheme);
-  const navigation = useNavigation();
+  const navigation = useNavigation<NavigationProp<DrawerParamList>>();
 
   useEffect(() => {
     runMigrations()
@@ -77,12 +77,6 @@ export default function Routes() {
           component={route.component}
           options={{
             drawerItemStyle: {height: 0},
-            headerLeft: () => (
-              <IconButton
-                icon="arrow-back"
-                onPress={() => navigation.goBack()}
-              />
-            ),
           }}
         />
       ))}