@rpcbase/client 0.124.0 → 0.127.0

package/helpers/createBatcher/index.js

@@ -0,0 +1,36 @@
+/* @flow */
+
+const createBatcher = (func, delay) => {
+  let queue = []
+  let timeout = null
+
+  function processBatch() {
+    const batch = [...queue]
+    queue = []
+    timeout = null
+
+    func(batch.map((item) => item.args))
+      .then((results) => {
+        for (let i = 0; i < batch.length; i++) {
+          batch[i].resolve(results[i])
+        }
+      })
+      .catch((err) => {
+        for (let item of batch) {
+          item.reject(err)
+        }
+      })
+  }
+
+  return (...args) => {
+    return new Promise((resolve, reject) => {
+      queue.push({args, resolve, reject})
+
+      if (!timeout) {
+        timeout = setTimeout(processBatch, delay)
+      }
+    })
+  }
+}
+
+export default createBatcher

package/helpers/useStoredValue/batchedGetStoredValues.js

@@ -0,0 +1,30 @@
+/* @flow */
+import assert from "assert"
+import debug from "debug"
+
+import post from "../post"
+import createBatcher from "../createBatcher"
+
+const log = debug("useStoredValue:get")
+
+// we keep it just above the react rendering time, but it could even be a request animation frame
+const BATCH_TIMEOUT_MS = 4
+
+const batchedGetStoredValues = async(args) => {
+  log("batched call to args", args)
+
+  const keys = args.map((arg) => arg[0])
+
+  const res = await post("/api/v1/stored-values/get", keys)
+  assert(res.status === "ok")
+
+  if (debug.enabled) {
+    for (let i = 0; i < args.length; i++) {
+      log(args[i][0], res.values[i])
+    }
+  }
+
+  return res.values
+}
+
+export default createBatcher(batchedGetStoredValues, BATCH_TIMEOUT_MS)

package/helpers/useStoredValue/index.js

@@ -0,0 +1,107 @@
+/* @flow */
+import {useEffect, useState, useRef, useCallback} from "react"
+import _throttle from "lodash/throttle"
+import isEqual from "fast-deep-equal/react"
+
+import {getUid} from "../../auth"
+import storage from "../../storage"
+
+import batchedGetStoredValues from "./batchedGetStoredValues"
+import setStoredValues from "./setStoredValues"
+
+
+const DEFAULT_REMOTE = true
+const UPDATE_THROTTLE_DELAY = 300
+
+const useStoredValue = (_key, defaultValueOrFn = null, options = {}) => {
+  const uid = getUid()
+  const key = `${uid}.${_key}`
+
+  const hasRemote = typeof options.remote === "boolean" ? options.remote : DEFAULT_REMOTE
+
+  const previousKey = useRef()
+
+  const getInitialState = () => {
+    const defaultValue =
+      typeof defaultValueOrFn === "function" ? defaultValueOrFn() : defaultValueOrFn
+
+    if (!_key) return defaultValue
+
+    const val = storage.getItem(key)
+
+    return typeof val !== "undefined" && val !== null ? val : defaultValue
+  }
+
+  const [value, setValue] = useState(getInitialState())
+
+  // reload initial state when key changes
+  useEffect(() => {
+    const initialStateForKey = getInitialState()
+    if (!isEqual(initialStateForKey, value)) {
+      setValue(initialStateForKey)
+    }
+  }, [key])
+
+
+  const refresh = useCallback(async() => {
+    const nextVal = await batchedGetStoredValues(key)
+
+    // TODO: we check against null here because localStorage of a non existing key returns null, but this is wrong, it should be returning undefined, in case we want to be able to store a null value
+    if (typeof nextVal !== "undefined" && nextVal !== null && !isEqual(nextVal, value)) {
+      setValue(nextVal)
+      // add the value to local storage in case it wasn't present
+      storage.setItem(key, nextVal)
+    }
+  }, [key])
+
+
+  useEffect(() => {
+    if (!hasRemote) return
+    if (!key) return
+    // skip when value is still undefined -> it hasnt loaded from cache / default value
+    if (typeof value === "undefined") return
+
+    if (previousKey.current !== key) {
+      refresh()
+      previousKey.current = key
+    }
+  }, [hasRemote, key, value, setValue])
+
+  // TODO: are there several instances of this function that run for differents keys ?
+  const throttledUpdateRemote = useCallback(
+    _throttle(
+      async(newVal) => {
+        await setStoredValues({
+          values: [
+            {
+              key,
+              value: newVal,
+            },
+          ],
+        })
+      },
+      UPDATE_THROTTLE_DELAY,
+      {leading: false, trailing: true},
+    ),
+    [key],
+  )
+
+  const updateValue = async(newValOrFn) => {
+    const newVal = typeof newValOrFn === "function" ? newValOrFn(value) : newValOrFn
+
+    if (newVal !== value) {
+      setValue(newVal)
+    }
+    if (!_key) return
+
+    storage.setItem(key, newVal)
+
+    if (hasRemote) {
+      throttledUpdateRemote(newVal)
+    }
+  }
+
+  return [value, updateValue]
+}
+
+export default useStoredValue

package/helpers/useStoredValue/setStoredValues.js

@@ -0,0 +1,14 @@
+/* @flow */
+import assert from "assert"
+
+import post from "../post"
+
+
+const setStoredValue = async(payload) => {
+  const res = await post("/api/v1/stored-values/set", payload)
+
+  assert(res.status === "ok")
+  return res
+}
+
+export default setStoredValue

package/index.js

@@ -1,4 +1,5 @@
 /* @flow */
 import useRPC from "./helpers/useRPC"
+import useStoredValue from "./helpers/useStoredValue"
 
-export {useRPC}
+export {useRPC, useStoredValue}

package/package.json

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

package/rts/store/get_collection.js

@@ -4,13 +4,13 @@ import PouchDB from "pouchdb-core"
 import IndexedDBAdapter from "pouchdb-adapter-indexeddb"
 import FindPlugin from "pouchdb-find"
 
-import {TENANT_PREFIX, DATABASE_NAME} from "env"
+import {TENANT_PREFIX, RB_APP_NAME} from "env"
 
 const log = debug("rb:rts:store")
 
 let prefix = `rb/${TENANT_PREFIX}/`
 
-if (DATABASE_NAME) prefix += `${DATABASE_NAME}/`
+if (RB_APP_NAME) prefix += `${RB_APP_NAME}/`
 
 PouchDB.prefix = prefix