@rpcbase/client 0.106.0 → 0.110.0

package/hashState.js

@@ -3,7 +3,8 @@ import {useState, useEffect, createContext, useContext, useCallback} from "react
 import LZString from "lz-string"
 import _isNil from "lodash/isNil"
 import _omitBy from "lodash/omitBy"
-import isEqual from "fast-deep-equal"
+
+import isEqualValues from "./isEqualValues"
 
 
 const PAGE_NAVIGATION_EVENT = "RB_PAGE_NAVIGATION"
@@ -87,7 +88,7 @@ export const HashStateProvider = ({children}) => {
         ...parsed,
       }
       // apply only if changed
-      if (!isEqual(hashState, newState)) {
+      if (!isEqualValues(hashState, newState)) {
         setHashState(newState)
       }
     }

package/isEqualValues.js

@@ -0,0 +1,47 @@
+/* @flow */
+const isEqual = require("fast-deep-equal/react")
+
+
+const isPlainObject = (obj) => {
+  return Object.prototype.toString.call(obj) === "[object Object]"
+}
+
+const sortValuesConsideringObjects = (values) => {
+  return values
+    .map(val => (isPlainObject(val) ? sortValuesConsideringObjects(Object.values(val)) : val))
+    .sort()
+}
+
+const isEqualValues = (a, b) => {
+  // Extract values and sort them if they belong to plain objects
+  const valsA = isPlainObject(a) ? sortValuesConsideringObjects(Object.values(a)) : a
+  const valsB = isPlainObject(b) ? sortValuesConsideringObjects(Object.values(b)) : b
+
+  if (valsA === null && valsB === null) {
+    return true
+  }
+
+  if (Array.isArray(valsA) || Array.isArray(valsB)) {
+    return isEqual(valsA, valsB)
+  }
+
+  // Check value count
+  if (valsA.length !== valsB.length) return false
+
+  // Compare the sorted arrays of values
+  for (let i = 0; i < valsA.length; i++) {
+    if (typeof valsA[i] === "object" && typeof valsB[i] === "object") {
+      if (!isEqualValues(valsA[i], valsB[i])) {
+        return false
+      }
+    } else {
+        if (!isEqual(valsA[i], valsB[i])) {
+          return false
+        }
+    }
+  }
+  return true
+}
+
+
+module.exports = isEqualValues

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpcbase/client",
-  "version": "0.106.0",
+  "version": "0.110.0",
   "scripts": {
     "build-firebase": "webpack -c firebase/webpack.config.js",
     "build": "yarn build-firebase",

package/rts/{getUseQuery.js → getUseQuery/index.js}

@@ -3,10 +3,13 @@ import assert from "assert"
 import {Platform} from "react-native"
 import {useCallback, useEffect, useState, useMemo, useId, useRef} from "react"
 import debug from "debug"
-import isEqual from "fast-deep-equal/react"
 import _omit from "lodash/omit"
+import LZString from "lz-string"
 
-import get_uid from "../auth/get_uid"
+import isEqualValues from "../../isEqualValues"
+import get_uid from "../../auth/get_uid"
+
+import useData from "./useData"
 
 
 const log = debug("rb:rts:useQuery")
@@ -27,6 +30,7 @@ const getUseQuery = (register_query) => (
     return _uid
   }, [])
 
+  // used to track if data was loaded synchronously (no need to show any loader)
   const hasInitiallySetFromStorage = useRef(false)
   const hasFirstReply = useRef(false)
   const hasNetworkReply = useRef(false)
@@ -46,31 +50,7 @@ const getUseQuery = (register_query) => (
 
   const [source, setSource] = useState()
 
-  const [data, setData] = useState(() => {
-    if (!useStorage) {
-      return
-    }
-
-    if (Platform.OS === "web") {
-      const item = localStorage.getItem(storageKey)
-      if (!item) return
-
-      hasInitiallySetFromStorage.current = true
-
-      let parsedItem
-      try {
-        parsedItem = JSON.parse(item)
-      } catch (err) {
-        //
-      }
-      if (parsedItem) {
-        return parsedItem
-      }
-    } else {
-      // TODO: fast storage not implemented on mobile
-      console.log("fast storage mobile nOT IMPLEMENTED")
-    }
-  })
+  const [data, setData] = useData({useStorage, storageKey, hasInitiallySetFromStorage})
 
   const [error, setError] = useState()
 
@@ -93,7 +73,7 @@ const getUseQuery = (register_query) => (
     // we only save network queries
     if (useStorage && context.source === "network") {
       if (Platform.OS === "web") {
-        localStorage.setItem(storageKey, JSON.stringify(newData))
+        localStorage.setItem(storageKey, LZString.compressToUTF16(JSON.stringify(newData)))
       } else {
         // TODO: rn fast storage async
       }
@@ -162,7 +142,7 @@ const getUseQuery = (register_query) => (
         hasFirstReply.current = true
 
         // skip if we already have the data
-        if (isEqual(data, newData)) {
+        if (isEqualValues(data, newData)) {
           applyContext(context)
           return
         }
@@ -178,7 +158,7 @@ const getUseQuery = (register_query) => (
         return
       }
 
-      if (!isEqual(data, newData)) {
+      if (!isEqualValues(data, newData)) {
         applyContext(context)
         applyNewData(newData, context)
       } else {

package/rts/getUseQuery/useData.js

@@ -0,0 +1,55 @@
+/* @flow */
+import {useState} from "react"
+import {Platform} from "react-native"
+import LZString from "lz-string"
+
+
+const useData = ({useStorage, storageKey, hasInitiallySetFromStorage}) => {
+  const [data, setData] = useState(() => {
+    if (!useStorage) {
+      return
+    }
+
+    if (Platform.OS === "web") {
+      const itemStr = localStorage.getItem(storageKey)
+      if (!itemStr) return
+
+      let decompressedItem
+      try {
+        decompressedItem = LZString.decompressFromUTF16(itemStr)
+      } catch (err) {
+        //
+      }
+
+      if (!decompressedItem) {
+        localStorage.removeItem(storageKey)
+        return
+      }
+
+
+      let parsedItem
+      try {
+        parsedItem = JSON.parse(decompressedItem)
+      } catch (err) {
+        //
+      }
+      //
+      if (!parsedItem) {
+        localStorage.removeItem(storageKey)
+        return
+      }
+
+      // success
+      hasInitiallySetFromStorage.current = true
+      return parsedItem
+
+    } else {
+      // TODO: fast storage not implemented on mobile
+      console.log("fast storage mobile nOT IMPLEMENTED")
+    }
+  })
+
+  return [data, setData]
+}
+
+export default useData