Use useReducer to forceUpdate the view when Whiskies deep object changes

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>

whisky-business/App.tsx

@@ -1,5 +1,5 @@
 import { StatusBar } from 'expo-status-bar';
-import React, { useState } from 'react';
+import React, { useState, useReducer } from 'react';
 import { StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native';
 import { request, GraphQLClient, gql } from 'graphql-request';
 import moment from 'moment';
@@ -89,9 +89,55 @@ export default function App() {
     [search, setSearch] = useState<string>(""),
     [lastSearch, setLastSearch] = useState<string>(""),
     [activeWhisky, setActiveWhisky] = useState<string>("");
+  
+  const [, forceUpdate] = useReducer(x => x + 1, 0);
+
+  const updateWhisky = (code : string) => {
+    const query = gql` {
+      Whisky(code: "${code}") {
+        inventories {
+          location {
+            code
+            address
+            city
+            phone
+            longitude
+            latitude
+          }
+          quantity
+          updated
+        }
+        code
+        size
+        description
+        updated
+        quantity
+      }
+    }`;
+    
+    client.request(query)
+    .then(data => {
+      for (let i = 0; i < whiskies.length; i++) {
+        if (whiskies[i].code == data.Whisky.code) {
+          whiskies[i] = data.Whisky;
+          break;
+        }
+      }
+      setWhiskies(whiskies);
+      forceUpdate();
+    })
+    .catch (error => {
+      console.error(error);
+    });
+  };
 
   const onPress = (code : string) => {
-    setActiveWhisky(code == activeWhisky ? "" : code);
+    if (code == activeWhisky) {
+      setActiveWhisky("");
+    } else {
+      setActiveWhisky(code);
+      updateWhisky(code);  
+    }
   };
 
   const items = whiskies ? whiskies
@@ -109,28 +155,6 @@ export default function App() {
     );
   }) : [];
 
-  const query = gql` {
-    Whiskies {
-      code
-      description
-      price
-      size
-      lastSeen
-      inventories {
-        location {
-          code
-          address
-          city
-          phone
-          longitude
-          latitude
-        }
-        quantity
-        updated
-      }
-    }
-  }`;
-  
   const submitSearch = () => {
     if (search.trim() == "") {
       setWhiskies([]);