@kaspernj/api-maker 1.0.326 → 1.0.328

package/package.json

@@ -16,7 +16,7 @@
     ]
   },
   "name": "@kaspernj/api-maker",
-  "version": "1.0.326",
+  "version": "1.0.328",
   "type": "module",
   "description": "",
   "main": "index.js",
@@ -49,7 +49,7 @@
     "js-money": ">= 0.6.3",
     "numberable": ">= 1.0.0",
     "object-to-formdata": ">= 4.1.0",
-    "on-location-changed": ">= 1.0.8",
+    "on-location-changed": ">= 1.0.10",
     "qs": ">= 6.9.3",
     "replaceall": ">= 0.1.6",
     "set-state-compare": ">= 1.0.28",

package/src/base-model.mjs

@@ -552,15 +552,24 @@ export default class BaseModel {
 
   setNewModel (model) {
     this.setNewModelData(model)
-    this.relationships = digg(model, "relationships")
-    this.relationshipsCache = digg(model, "relationshipsCache")
+
+    for(const relationshipName in model.relationships) {
+      this.relationships[relationshipName] = model.relationships[relationshipName]
+    }
+
+    for(const relationshipCacheName in model.relationshipsCache) {
+      this.relationshipsCache[relationshipCacheName] = model.relationshipsCache[name]
+    }
   }
 
   setNewModelData (model) {
     if (!("modelData" in model)) throw new Error(`No modelData in model: ${JSON.stringify(model)}`)
 
-    this.previousModelData = digg(this, "modelData")
-    this.modelData = digg(model, "modelData")
+    this.previousModelData = Object.assign({}, digg(this, "modelData"))
+
+    for(const attributeName in model.modelData) {
+      this.modelData[attributeName] = model.modelData[attributeName]
+    }
   }
 
   _isDateChanged (oldValue, newValue) {

package/src/collection-loader.jsx

@@ -1,11 +1,14 @@
+import Collection from "./collection.mjs"
 import {digg} from "diggerize"
 import {memo, useEffect} from "react"
+import PropTypes from "prop-types"
+import PropTypesExact from "prop-types-exact"
 import useCollection from "./use-collection"
 import useShape from "set-state-compare/src/use-shape.js"
 
-const CollectionLoader = (props) => {
-  const s = useShape(props)
-  const useCollectionResult = useCollection(props)
+const CollectionLoader = ({component, ...restProps}) => {
+  const s = useShape(restProps)
+  const useCollectionResult = useCollection(restProps)
   const cachePartsKeys = [
     "modelIdsCacheString",
     "overallCount",
@@ -25,10 +28,10 @@ const CollectionLoader = (props) => {
     cacheParts.push(digg(useCollectionResult, cachePartsKey))
   }
 
-  s.updateMeta({useCollectionResult})
+  s.updateMeta({component, useCollectionResult})
 
   useEffect(() => {
-    const componentShape = digg(s.p.component, "shape")
+    const componentShape = digg(s.m.component, "shape")
 
     componentShape.set(s.m.useCollectionResult)
   }, cacheParts)
@@ -36,4 +39,23 @@ const CollectionLoader = (props) => {
   return null
 }
 
+CollectionLoader.propTypes = PropTypesExact({
+  abilities: PropTypes.object,
+  collection: PropTypes.instanceOf(Collection),
+  component: PropTypes.object.isRequired,
+  defaultParams: PropTypes.object,
+  groupBy: PropTypes.array,
+  modelClass: PropTypes.func.isRequired,
+  noRecordsAvailableContent: PropTypes.func,
+  noRecordsFoundContent: PropTypes.func,
+  onModelsLoaded: PropTypes.func,
+  pagination: PropTypes.bool.isRequired,
+  preloads: PropTypes.array.isRequired,
+  queryMethod: PropTypes.func,
+  queryName: PropTypes.string,
+  ransack: PropTypes.object,
+  select: PropTypes.object,
+  selectColumns: PropTypes.object
+})
+
 export default memo(CollectionLoader)

package/src/devise.mjs

@@ -6,44 +6,38 @@ import * as inflection from "inflection"
 import modelClassRequire from "./model-class-require.mjs"
 import Services from "./services.mjs"
 
+const events = new EventEmitter()
+const shared = {}
+
+events.setMaxListeners(1000)
+
+export {events}
+
 export default class ApiMakerDevise {
   static callSignOutEvent (args) {
-    ApiMakerDevise.events().emit("onDeviseSignOut", {args})
+    events.emit("onDeviseSignOut", {args})
   }
 
   static current () {
-    if (!globalThis.currentApiMakerDevise) {
-      globalThis.currentApiMakerDevise = new ApiMakerDevise()
+    if (!shared.currentApiMakerDevise) {
+      shared.currentApiMakerDevise = new ApiMakerDevise()
     }
 
-    return globalThis.currentApiMakerDevise
+    return shared.currentApiMakerDevise
   }
 
   static events () {
-    if (!globalThis.apiMakerDeviseEvents) {
-      globalThis.apiMakerDeviseEvents = new EventEmitter()
-      globalThis.apiMakerDeviseEvents.setMaxListeners(1000)
-    }
-
-    return globalThis.apiMakerDeviseEvents
+    return events
   }
 
   static addUserScope (scope) {
     const currentMethodName = `current${inflection.camelize(scope)}`
 
-    ApiMakerDevise[currentMethodName] = function () {
-      return ApiMakerDevise.current().getCurrentScope(scope)
-    }
+    ApiMakerDevise[currentMethodName] = () => ApiMakerDevise.current().getCurrentScope(scope)
 
     const isSignedInMethodName = `is${inflection.camelize(scope)}SignedIn`
 
-    ApiMakerDevise[isSignedInMethodName] = function () {
-      if (ApiMakerDevise.current().getCurrentScope(scope)) {
-        return true
-      }
-
-      return false
-    }
+    ApiMakerDevise[isSignedInMethodName] = () => Boolean(ApiMakerDevise.current().getCurrentScope(scope))
   }
 
   static async signIn (username, password, args = {}) {
@@ -59,7 +53,7 @@ export default class ApiMakerDevise {
     await CanCan.current().resetAbilities()
 
     ApiMakerDevise.updateSession(model)
-    ApiMakerDevise.events().emit("onDeviseSignIn", Object.assign({username}, args))
+    events.emit("onDeviseSignIn", Object.assign({username}, args))
 
     return {model, response}
   }
@@ -88,8 +82,8 @@ export default class ApiMakerDevise {
     await CanCan.current().resetAbilities()
 
     // Cannot use the class because they would both import each other
-    if (globalThis.apiMakerSessionStatusUpdater) {
-      globalThis.apiMakerSessionStatusUpdater.updateSessionStatus()
+    if (shared.apiMakerSessionStatusUpdater) {
+      shared.apiMakerSessionStatusUpdater.updateSessionStatus()
     }
 
     ApiMakerDevise.setSignedOut(args)
@@ -103,8 +97,9 @@ export default class ApiMakerDevise {
   }
 
   getCurrentScope (scope) {
-    if (!(scope in this.currents))
+    if (!(scope in this.currents)) {
       this.currents[scope] = this.loadCurrentScope(scope)
+    }
 
     return this.currents[scope]
   }

package/src/event-updated.jsx

@@ -1,72 +1,23 @@
-import debounce from "debounce"
-import ModelEvents from "./model-events.mjs"
 import PropTypes from "prop-types"
 import propTypesExact from "prop-types-exact"
-import React from "react"
+import {memo} from "react"
+import useUpdatedEvent from "./use-updated-event.mjs"
 
-export default class ApiMakerEventUpdated extends React.PureComponent {
-  static defaultProps = {
-    active: true
-  }
+const ApiMakerEventUpdated = ({model, onUpdated, ...restProps}) => {
+  useUpdatedEvent(model, onUpdated, restProps)
 
-  static propTypes = propTypesExact({
-    active: PropTypes.bool.isRequired,
-    debounce: PropTypes.oneOfType([
-      PropTypes.bool,
-      PropTypes.number
-    ]),
-    model: PropTypes.object.isRequired,
-    onConnected: PropTypes.func,
-    onUpdated: PropTypes.func.isRequired
-  })
-
-  componentDidMount () {
-    this.connect()
-  }
-
-  componentWillUnmount () {
-    if (this.connectUpdated) {
-      this.connectUpdated.unsubscribe()
-    }
-
-    if (this.onConnectedListener) {
-      this.connectUpdated.events.removeListener("connected", this.props.onConnected)
-    }
-  }
-
-  connect () {
-    const {model, onConnected} = this.props
-
-    this.connectUpdated = ModelEvents.connectUpdated(model, this.onUpdated)
-
-    if (onConnected) {
-      this.onConnectedListener = this.connectUpdated.events.addListener("connected", this.props.onConnected)
-    }
-  }
-
-  debounce () {
-    if (!this.debounceInstance) {
-      if (typeof this.props.debounce == "number") {
-        this.debounceInstance = debounce(this.props.onUpdated, this.props.debounce)
-      } else {
-        this.debounceInstance = debounce(this.props.onUpdated)
-      }
-    }
-
-    return this.debounceInstance
-  }
-
-  onUpdated = (...args) => {
-    if (!this.props.active) {
-      return
-    }
-
-    if (this.props.debounce) {
-      this.debounce()(...args)
-    } else {
-      this.props.onUpdated(...args)
-    }
-  }
-
-  render = () => null
+  return null
 }
+
+ApiMakerEventUpdated.propTypes = propTypesExact({
+  active: PropTypes.bool,
+  debounce: PropTypes.oneOfType([
+    PropTypes.bool,
+    PropTypes.number
+  ]),
+  model: PropTypes.object.isRequired,
+  onConnected: PropTypes.func,
+  onUpdated: PropTypes.func.isRequired
+})
+
+export default memo(ApiMakerEventUpdated)

package/src/use-collection.mjs

@@ -1,10 +1,7 @@
-import Collection from "./collection.mjs"
 import debounce from "debounce"
 import {digg} from "diggerize"
 import * as inflection from "inflection"
 import ModelEvents from "./model-events.mjs"
-import PropTypes from "prop-types"
-import PropTypesExact from "prop-types-exact"
 import {useCallback, useEffect} from "react"
 import useShape from "set-state-compare/src/use-shape.js"
 import useQueryParams from "on-location-changed/src/use-query-params.js"
@@ -15,6 +12,7 @@ const useCollection = (
     collection,
     defaultParams,
     groupBy = ["id"],
+    limit,
     modelClass,
     noRecordsAvailableContent = undefined,
     noRecordsFoundContent = undefined,
@@ -23,16 +21,23 @@ const useCollection = (
     preloads = [],
     queryMethod,
     queryName,
+    ransack,
     select = {},
-    selectColumns
+    selectColumns,
+    ...restProps
   },
   cacheKeys = []
 ) => {
+  if (Object.keys(restProps).length > 0) {
+    throw new Error(`Unknown props given to useCollection: ${Object.keys(restProps).join(", ")}`)
+  }
+
   const s = useShape({
     abilities,
     collection,
     defaultParams,
     groupBy,
+    limit,
     modelClass,
     noRecordsAvailableContent,
     noRecordsFoundContent,
@@ -40,12 +45,27 @@ const useCollection = (
     pagination,
     preloads,
     queryMethod,
+    ransack,
     select,
     selectColumns
   })
 
+  s.meta.queryParams = useQueryParams()
+
   if (!queryName) queryName = digg(modelClass.modelClassData(), "collectionKey")
 
+  const hasQParams = useCallback(() => {
+    if (s.s.queryQName in s.m.queryParams) return true
+
+    return false
+  }, [])
+
+  const qParams = useCallback(() => {
+    if (hasQParams()) return JSON.parse(digg(s.m.queryParams, s.s.queryQName))
+
+    return {}
+  }, [])
+
   s.useStates({
     models: undefined,
     overallCount: undefined,
@@ -55,14 +75,14 @@ const useCollection = (
     queryQName: `${queryName}_q`,
     querySName: `${queryName}_s`,
     queryPageName: `${queryName}_page`,
-    qParams: undefined,
     result: undefined,
     searchParams: undefined,
     showNoRecordsAvailableContent: false,
     showNoRecordsFoundContent: false
   })
-
-  const queryParams = useQueryParams()
+  s.useStates({
+    qParams: qParams()
+  })
 
   let modelIdsCacheString
 
@@ -74,8 +94,6 @@ const useCollection = (
     modelIdsCacheString = s.s.models.map((model) => model.cacheKey())?.join("---")
   }
 
-  s.updateMeta({queryParams})
-
   const loadOverallCount = useCallback(async () => {
     const baseQuery = s.p.collection || s.p.modelClass.all()
     const overallCount = await baseQuery.count()
@@ -87,18 +105,6 @@ const useCollection = (
     })
   }, [])
 
-  const hasQParams = useCallback(() => {
-    if (s.s.queryQName in s.m.queryParams) return true
-
-    return false
-  }, [])
-
-  const qParams = useCallback(() => {
-    if (hasQParams()) return JSON.parse(digg(s.m.queryParams, s.s.queryQName))
-
-    return {}
-  }, [])
-
   const loadQParams = useCallback(() => {
     const qParamsToSet = hasQParams() ? qParams() : Object.assign({}, s.p.defaultParams)
     const searchParams = []
@@ -137,6 +143,7 @@ const useCollection = (
 
     query = query
       .ransack(s.s.qParams)
+      .ransack(s.props.ransack)
       .search(s.s.searchParams)
       .searchKey(s.s.queryQName)
       .pageKey(s.s.queryPageName)
@@ -145,6 +152,7 @@ const useCollection = (
       .select(s.p.select)
 
     if (s.p.abilities) query = query.abilities(s.p.abilities)
+    if (s.p.limit !== undefined) query = query.limit(s.p.limit)
     if (s.p.selectColumns) query = query.selectColumns(s.p.selectColumns)
 
     let result
@@ -235,7 +243,13 @@ const useCollection = (
       loadQParams()
       loadModels()
     },
-    [queryParams[s.s.queryQName], queryParams[s.s.queryPageName], queryParams[s.s.queryPerKey], queryParams[s.s.querySName], collection].concat(cacheKeys)
+    [
+      s.m.queryParams[s.s.queryQName],
+      s.m.queryParams[s.s.queryPageName],
+      s.m.queryParams[s.s.queryPerKey],
+      s.m.queryParams[s.s.querySName],
+      collection
+    ].concat(cacheKeys)
   )
 
   useEffect(() => {
@@ -276,21 +290,4 @@ const useCollection = (
   return result
 }
 
-useCollection.propTypes = PropTypesExact({
-  abilities: PropTypes.object,
-  collection: PropTypes.instanceOf(Collection),
-  defaultParams: PropTypes.object,
-  groupBy: PropTypes.array,
-  modelClass: PropTypes.func.isRequired,
-  noRecordsAvailableContent: PropTypes.func,
-  noRecordsFoundContent: PropTypes.func,
-  onModelsLoaded: PropTypes.func,
-  pagination: PropTypes.bool.isRequired,
-  preloads: PropTypes.array.isRequired,
-  queryMethod: PropTypes.func,
-  queryName: PropTypes.string,
-  select: PropTypes.object,
-  selectColumns: PropTypes.object
-})
-
 export default useCollection

package/src/use-created-event.mjs

@@ -2,7 +2,7 @@ import debounceFunction from "debounce"
 import ModelEvents from "./model-events.mjs"
 import PropTypes from "prop-types"
 import propTypesExact from "prop-types-exact"
-import {useCallback, useEffect, memo} from "react"
+import {useCallback, useEffect} from "react"
 import useShape from "set-state-compare/src/use-shape.js"
 
 const ApiMakerUseCreatedEvent = (modelClass, onCreated, args = {}) => {

package/src/use-current-user.mjs

@@ -5,7 +5,7 @@ const useCurrentUser = () => {
   const [currentUser, setCurrentUser] = useState(Devise.currentUser())
   const updateCurrentUser = useCallback(() => {
     setCurrentUser(Devise.currentUser())
-  })
+  }, [])
 
   useEffect(() => {
     Devise.events().addListener("onDeviseSignIn", updateCurrentUser)

package/src/use-updated-event.mjs

@@ -0,0 +1,58 @@
+import {useCallback, useEffect, useMemo} from "react"
+import debounceFunction from "debounce"
+import ModelEvents from "./model-events.mjs"
+import useShape from "set-state-compare/src/use-shape.js"
+
+const ApiMakerUseUpdatedEvent = (model, onUpdated, {active = true, debounce, onConnected, ...restProps}) => {
+  if (Object.keys(restProps).length > 0) {
+    throw new Error(`Unknown props given to useUpdatedEvent: ${Object.keys(restProps).join(", ")}`)
+  }
+
+  const s = useShape({active, debounce, model, onUpdated})
+
+  const debounceCallback = useMemo(() => {
+    if (typeof debounce == "number") {
+      return debounceFunction(s.p.onUpdated, debounce)
+    } else {
+      return debounceFunction(s.p.onUpdated)
+    }
+  }, [debounce])
+
+  s.updateMeta({debounceCallback})
+
+  const onUpdatedCallback = useCallback((...args) => {
+    if (!s.p.active) {
+      return
+    }
+
+    if (s.p.debounce) {
+      s.m.debounceCallback(...args)
+    } else {
+      s.p.onUpdated(...args)
+    }
+  }, [])
+
+  useEffect(() => {
+    let connectUpdated, onConnectedListener
+
+    if (model) {
+      connectUpdated = ModelEvents.connectUpdated(model, onUpdatedCallback)
+
+      if (onConnected) {
+        onConnectedListener = connectUpdated.events.addListener("connected", onConnected)
+      }
+    }
+
+    return () => {
+      if (onConnectedListener) {
+        connectUpdated.events.removeListener("connected", onConnected)
+      }
+
+      if (connectUpdated) {
+        connectUpdated.unsubscribe()
+      }
+    }
+  }, [model?.id()])
+}
+
+export default ApiMakerUseUpdatedEvent

package/src/with-current-user.jsx

@@ -1,30 +1,9 @@
-import Devise from "./devise"
-import {digs} from "diggerize"
-import EventEmitterListener from "./event-emitter-listener"
-import PureComponent from "set-state-compare/src/pure-component"
-import React from "react"
+import useCurrentUser from "./use-current-user.mjs"
 
-export default (WrappedComponent) => class WithCurrentUser extends PureComponent {
-  state = {
-    currentUser: Devise.currentUser()
-  }
+export default (WrappedComponent) => (props) => {
+  const currentUser = useCurrentUser()
 
-  render() {
-    const {onDeviseSigned} = digs(this, "onDeviseSigned")
-    const {currentUser} = digs(this.state, "currentUser")
-
-    return (
-      <>
-        <EventEmitterListener events={Devise.events()} event="onDeviseSignIn" onCalled={onDeviseSigned} />
-        <EventEmitterListener events={Devise.events()} event="onDeviseSignOut" onCalled={onDeviseSigned} />
-        <WrappedComponent {...this.props} currentUser={currentUser} />
-      </>
-    )
-  }
-
-  onDeviseSigned = () => {
-    const currentUser = Devise.currentUser()
-
-    if (this.state.currentUser !== currentUser) this.setState({currentUser})
-  }
+  return (
+    <WrappedComponent {...props} currentUser={currentUser} />
+  )
 }