buttons work, all modal ready

src/components/GroceryList/groceries/List.js

@@ -9,7 +9,7 @@ import { Wrapper, WrapperList, WrapperListTitle, ListTitle, ListSubtitle, Button
 import { useSelector, useDispatch } from 'react-redux';
 import { selectAllSortedItems, itemsRemovedByList } from '../../../redux/slices/groceryList/itemsSlice'
 import { toggleOpen, listRemoved } from '../../../redux/slices/groceryList/listsSlice'
-import { FlatList, View } from 'react-native';
+import { Alert, FlatList, View } from 'react-native';
 import { TouchableOpacity } from 'react-native-gesture-handler';
 
 export default React.memo((props) => {
@@ -29,10 +29,20 @@ export default React.memo((props) => {
     const [modalListVisible, setModalListVisible] = useState(false);
 
     const removeList = () => {
-        if (window.confirm("Do you really want to remove this list and the groceries within")) {
-            dispatch(itemsRemovedByList(props.listId))
-            dispatch(listRemoved(props.listId))
-        }
+        Alert.alert(
+            "Warning",
+            "Are you sure you want to remove this list and the groceries within?",
+            [
+                { text: "Cancel", },
+                {
+                    text: "Remove", onPress: () => {
+                        dispatch(itemsRemovedByList(props.listId))
+                        dispatch(listRemoved(props.listId))
+                    }
+                }
+            ],
+            { cancelable: true, }
+        )
     }
     return (
         <Wrapper >