From 471d41eb6141d93f355da22eb878da4033e0a0f6 Mon Sep 17 00:00:00 2001 From: Leon Si Date: Wed, 8 Apr 2020 11:44:39 -0400 Subject: [PATCH] made changes --- App.js | 10 +-- screens/GroceryListChecklistScreen.js | 90 ++++++++++++++++++--------- screens/GroceryListSearchScreen.js | 4 +- screens/GroceryListSummaryScreen.js | 8 ++- screens/ScannerScreen.js | 4 ++ screens/StoreSelectionScreen.js | 30 +++------ screens/YourGroceryListScreen.js | 2 + 7 files changed, 86 insertions(+), 62 deletions(-) diff --git a/App.js b/App.js index e78900d..4335b2e 100644 --- a/App.js +++ b/App.js @@ -24,6 +24,7 @@ const Drawer = createDrawerNavigator(); function DrawerContent(props) { const {user, setUser} = useContext(UserContext); + return ( @@ -89,15 +90,6 @@ export default function App() { })(); }, []); - useEffect(() => { - (async() => { - const id = await SecureStore.getItemAsync('userId'); - if (!id) return; - const response = await fetch(`https://grocerserver.herokuapp.com/users/${id}`); - const result = await response.json(); - })(); - }, []); - React.useEffect(() => { isMountedRef.current = true; return () => {isMountedRef.current = false}; diff --git a/screens/GroceryListChecklistScreen.js b/screens/GroceryListChecklistScreen.js index 4ea97db..870c5f8 100644 --- a/screens/GroceryListChecklistScreen.js +++ b/screens/GroceryListChecklistScreen.js @@ -3,47 +3,63 @@ import {View, Text, FlatList, Image, StyleSheet, Alert} from 'react-native'; import SvgQRCode from 'react-native-qrcode-svg'; import {Button, CheckBox, ListItem, Overlay} from "react-native-elements"; import StackWrapperScreenOptions from "../constants/StackWrapperScreenOptions"; +import {Notifications} from "expo"; export default function GroceryListChecklistScreen({navigation, route}) { const groceryList = route.params; - const [groceryListItems, setGroceryListItems] = useState([]); const [checkedItems, setCheckedItems] = useState({}); const [isQRCodeVisible, setQRCodeVisibility] = useState(false); + function handleNotification(notification) { + console.log(notification); + alert(`Order completed. You received ${groceryList.items.length} Grocer Point(s).`); + setQRCodeVisibility(false); + navigation.dangerouslyGetParent()?.dangerouslyGetParent()?.dangerouslyGetParent()?.setOptions(StackWrapperScreenOptions); + navigation.reset({ + index: 0, + routes: [ + {name: 'GroceryListSearch'} + ] + }); + } + useEffect(() => { - let orderedItems = []; - for (let [key, value] of Object.entries(groceryList.items)) { - let obj = value; - obj._id = key; - orderedItems.push(obj); + const listener = Notifications.addListener(handleNotification); + return () => { + console.log("Removed listener."); + listener.remove(); } - setGroceryListItems(orderedItems); }, []); return ( ( - - { - const newCheckedItems = {...checkedItems}; - if (checkedItems[item._id]) - delete newCheckedItems[item._id]; - else - newCheckedItems[item._id] = true; - setCheckedItems(newCheckedItems); - }} - />} - title={`${item.name} (${item.count?.toString()})`} - bottomDivider={true} - /> - - )} + data={groceryList.items} + renderItem={({item: groceryItem}) => { + const item = groceryItem.item; + return ( + + { + const newCheckedItems = {...checkedItems}; + if (checkedItems[item._id]) + delete newCheckedItems[item._id]; + else + newCheckedItems[item._id] = true; + setCheckedItems(newCheckedItems); + }} + /> + } + title={`${item.name} (${groceryItem.count?.toString()})`} + bottomDivider={true} + /> + + ); + }} keyExtractor={item => item._id} /> { - setQRCodeVisibility(true); + if (Object.keys(checkedItems).length !== groceryList.items.length) { + Alert.alert( + "Are you sure?", + "It looks like you haven't checked all the items off the" + + " grocery list. If certain items are out of stock, make sure" + + " to let the workers know!", + [ + {text: "Finish", onPress: () => { + setQRCodeVisibility(true); + }}, + {text: "Nevermind"} + ] + ); + } else { + setQRCodeVisibility(true); + } }} > Complete diff --git a/screens/GroceryListSearchScreen.js b/screens/GroceryListSearchScreen.js index 99ec9f6..4f63c40 100644 --- a/screens/GroceryListSearchScreen.js +++ b/screens/GroceryListSearchScreen.js @@ -7,11 +7,13 @@ import GroceryListChecklistScreen from "./GroceryListChecklistScreen"; import {createStackNavigator} from "@react-navigation/stack"; import dateFormat from 'dateformat'; import UserContext from "../contexts/User"; +import CurrentStoreContext from "../../client/contexts/CurrentStore"; function GroceryListSearch({navigation}) { const [groceryLists, updateGroceryLists] = useState([]); const [refreshing, setRefreshing] = useState(false); const {user} = useContext(UserContext); + const {currentStore} = useContext(CurrentStoreContext); useEffect(() => { (async() => { @@ -20,7 +22,7 @@ function GroceryListSearch({navigation}) { }, []); async function updateData() { - const listsUrl = 'https://grocerserver.herokuapp.com/lists'; + const listsUrl = `https://grocerserver.herokuapp.com/lists?storeId=${currentStore.id}`; setRefreshing(true); const response = await fetch(listsUrl); const result = await response.json(); diff --git a/screens/GroceryListSummaryScreen.js b/screens/GroceryListSummaryScreen.js index 5c6429c..273c887 100644 --- a/screens/GroceryListSummaryScreen.js +++ b/screens/GroceryListSummaryScreen.js @@ -12,13 +12,17 @@ export default function GroceryListSummaryScreen({navigation, route}) { function handleNotification(notification) { console.log("notification: ", notification); - if (notification.data.isActivation && notification.data.userId === user._id) + console.log(user._id); + if (notification.data?.isActivation && notification.data?.userId === user._id) navigation.navigate('GroceryListChecklist', groceryList); } useEffect(() => { const listener = Notifications.addListener(handleNotification); - return () => listener.remove(); + return () => { + console.log("Removed listener."); + listener.remove(); + } }, []); useEffect(() => { diff --git a/screens/ScannerScreen.js b/screens/ScannerScreen.js index 276963e..fc1c479 100644 --- a/screens/ScannerScreen.js +++ b/screens/ScannerScreen.js @@ -40,6 +40,10 @@ function QRCodeScanner() { const completeUrl = 'https://grocerserver.herokuapp.com/lists/complete'; const response = await fetch(completeUrl, { method: 'POST', + headers: { + 'Accept': 'application/json', + 'Content-Type': 'application/json', + }, body: JSON.stringify({qrCode: data}), }); const result = await response.json(); diff --git a/screens/StoreSelectionScreen.js b/screens/StoreSelectionScreen.js index bb58b4b..663c6d6 100644 --- a/screens/StoreSelectionScreen.js +++ b/screens/StoreSelectionScreen.js @@ -1,28 +1,18 @@ -import React from "react"; +import React, {useState, useEffect} from "react"; import {View, Dimensions, StyleSheet} from 'react-native'; import MapView from 'react-native-maps'; import StoreMarker from "../components/StoreMarker"; -const storeLocations = [ - { - name: "Walmart Toronto Downsview", - coords: { - latitude: 43.7577199, - longitude: -79.491159, - }, - id: 0 - }, - { - name: "Metro Warden Ave", - coords: { - latitude: 43.797456, - longitude: -79.3200992, - }, - id: 1 - }, -]; - export default function StoreSelectionScreen() { + const [storeLocations, setStoreLocations] = useState([]); + useEffect(() => { + (async() => { + const response = await fetch('https://grocerserver.herokuapp.com/stores'); + const result = await response.json(); + setStoreLocations(result); + })(); + }, []); + return (