change product to dump to object before storing in redix. TODO: solve dimensions issue.

app/(tabs)/_layout.tsx

@@ -10,7 +10,7 @@ import { setupStore } from '../store';
 export default function TabLayout() {
   const colorScheme = useColorScheme();
   const store = setupStore({
-    products: fixtures
+    products: fixtures.map(p => p.asObject)
   });
   return (
     <Provider store={store}>

app/(tabs)/index.tsx

@@ -23,17 +23,23 @@ export default function HomeScreen() {
       if (!activeProduct) return;
       const l = Number.parseInt(length);
       const w = Number.parseInt(width);
-      console.log("l=%d, w=%d", l, w);
+      // console.log("l=%d, w=%d", l, w);
       const u = units;
       const d: dimensions_t = activeProduct.area ? { l, w, u } : { l, u };
-      const p = activeProduct.priceFor(d);
-      console.log("set price %s", p);
-      const s = p.toLocaleString(undefined, {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2,
-      })
-      setPrice(s == "NaN" ? "0.00" : s);
-    }, 10);
+      try {
+        const p = activeProduct.priceFor(d);
+        console.log("set price %s", p);
+        const s = p.toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })
+        setPrice(s == "NaN" ? "0.00" : s);
+      } catch (err) {
+        console.log(activeProduct);
+        console.error(err)
+        return null;
+      }
+    }, 50);
     return function () {
       clearInterval(iv);
     }
@@ -67,13 +73,13 @@ export default function HomeScreen() {
                   <Text style={styles.unitHints}>{units}</Text>
                 </View>)
               }
+              <View style={styles.unitSelector}>
+                <Button title="in" onPress={() => setUnits("in")} color={units === "in" ? "gray" : "blue"} />
+                <Button title="ft" onPress={() => setUnits("ft")} color={units === "ft" ? "gray" : "blue"} />
+              </View>
             </View>
           ) : (<Text>Please choose a product</Text>)}
         </View>
-        <View style={styles.unitSelector}>
-          <Button title="in" onPress={() => setUnits("in")} color={units === "in" ? "gray" : "blue"} />
-          <Button title="ft" onPress={() => setUnits("ft")} color={units === "ft" ? "gray" : "blue"} />
-        </View>
       </View>
       <FlatList
         data={products}

app/store.ts

@@ -3,14 +3,14 @@ import { configureStore } from '@reduxjs/toolkit';
 import { rememberReducer, rememberEnhancer } from 'redux-remember';
 import reducers from "@/features/product/productSlice"
 import AsyncStorage from '@react-native-async-storage/async-storage';
-import { Product, } from "@/lib/product";
+import { Product, ProductData, } from "@/lib/product";
 
 const rememberedKeys = ['products'];
 
 const rootReducer = reducers;
 
 export function setupStore(preloadedState = {
-    products: [] as Product[],
+    products: [] as ProductData[],
 }) {
     return configureStore({
         reducer: rememberReducer(reducers),