🚑 Stop infinite getMoves() loop

but keep updating the list when we navigate back to
this screen from the creation page

screens/moves/MoveListScreen.tsx

@@ -1,6 +1,6 @@
 // screens/moves/MoveListScreen.tsx
 
-import React, { useEffect }                               from 'react';
+import React                                              from 'react';
 import { Button, FlatList, ScrollView, StyleSheet, View } from 'react-native';
 import { StackNavigationProp }                            from '@react-navigation/stack';
 import { RootStackParamList }                             from "../../navigation/navigationTypes";
@@ -10,7 +10,7 @@ import { MoveState }                                      from "../../redux/redu
 import { AppDispatch }                                    from "../../redux/store";
 import MoveListItem                                       from "../../components/MoveListItem";
 import { MOVE_DETAIL, MOVE_FORM, MOVE_LIST }              from "../../navigation/constants";
-import { RouteProp }                                      from "@react-navigation/native";
+import { RouteProp, useFocusEffect }                      from "@react-navigation/native";
 
 type MoveListScreenNavigationProp = StackNavigationProp<RootStackParamList, typeof MOVE_LIST>;
 type MoveListScreenRouteProp = RouteProp<RootStackParamList, typeof MOVE_LIST>;
@@ -27,12 +27,14 @@ const MoveListScreen = ({ navigation }: Props) => {
     const dispatch: AppDispatch = useDispatch();
     const moves = useSelector((state: RootState) => state.move.moves);
 
-    useEffect(() => {
-        const loadMoves = async () => {
-            await (dispatch as AppDispatch)(getMoves());
-        };
-        loadMoves();
-    }, [dispatch, moves]);
+    useFocusEffect(
+        React.useCallback(() => {
+            const loadMoves = async () => {
+                await (dispatch as AppDispatch)(getMoves());
+            };
+            loadMoves();
+        }, [dispatch])
+    );
 
     return (
         <ScrollView>
@@ -48,7 +50,11 @@ const MoveListScreen = ({ navigation }: Props) => {
                             />
                             <Button title="Delete"
                                     color={styles.deleteButton.backgroundColor}
-                                    onPress={() => dispatch(deleteMove(item.id!))}/>
+                                    onPress={() => {
+                                        if (item.id) {
+                                            dispatch(deleteMove(item.id))
+                                        }
+                                    }}/>
                         </View>
                     )}
                     keyExtractor={(item) => item.name}