@kaspernj/api-maker 1.0.314 → 1.0.316

package/package.json

@@ -16,7 +16,7 @@
     ]
   },
   "name": "@kaspernj/api-maker",
-  "version": "1.0.314",
+  "version": "1.0.316",
   "type": "module",
   "description": "",
   "main": "index.js",

package/src/use-model.mjs

@@ -1,4 +1,5 @@
 import {useCallback, useEffect, useState} from "react"
+import Devise from "./devise.mjs"
 import * as inflection from "inflection"
 import ModelEvents from "./model-events.mjs"
 import useQueryParams from "on-location-changed/src/use-query-params.js"
@@ -120,6 +121,24 @@ const useModel = (modelClassArg, argsArg = {}) => {
     }
   }, [args.eventUpdated, model?.id()])
 
+  const onSignedIn = useCallback(() => {
+    loadModel()
+  }, [])
+
+  const onSignedOut = useCallback(() => {
+    loadModel()
+  }, [])
+
+  useEffect(() => {
+    Devise.events().addListener("onDeviseSignIn", onSignedIn)
+    Devise.events().addListener("onDeviseSignOut", onSignedOut)
+
+    return () => {
+      Devise.events().removeListener("onDeviseSignIn", onSignedIn)
+      Devise.events().removeListener("onDeviseSignOut", onSignedOut)
+    }
+  })
+
   const onDestroyed = useCallback(({model}) => {
     const forwardArgs = {model}
 

package/src/with-model.jsx

@@ -1,144 +1,15 @@
-import {digg, digs} from "diggerize"
-import EventUpdated from "./event-updated"
-import * as inflection from "inflection"
-import Params from "./params.mjs"
-import PropTypes from "prop-types"
-import React from "react"
-import withQueryParams from "on-location-changed/src/with-query-params"
+import {memo} from "react"
+import useModel from "./use-model.mjs"
 
-export default (WrappedComponent, modelClassArg, argsArg = {}) => {
-  class ApiMakerWithModel extends React.PureComponent {
-    static propTypes = {
-      queryParams: PropTypes.object
-    }
+export default (WrappedComponent, modelClass, givenArgs) => {
+  const ApiMakerWithModel = (props) => {
+    const args = Object.assign({match: props.match}, givenArgs)
+    const useModelResult = useModel(modelClass, args)
 
-    modelClass = this.resolveModelClass(modelClassArg)
-    args = this.resolveArgs()
-    modelVariableName = inflection.camelize(this.modelClass.modelClassData().name, true)
-    paramsVariableName = `${this.modelClass.modelName().paramKey()}_id`
-
-    state = {
-      model: undefined,
-      modelId: this.getModelId(),
-      notFound: undefined
-    }
-
-    resolveArgs() {
-      if (typeof argsArg == "function") {
-        return argsArg({
-          modelClass: this.modelClass
-        })
-      }
-
-      return argsArg
-    }
-
-    resolveModelClass(modelClassArg) {
-      if (typeof modelClassArg == "object") {
-        const {queryParams} = digs(this.props, "queryParams")
-
-        return modelClassArg.callback({queryParams})
-      }
-
-      return modelClassArg
-    }
-
-    componentDidMount() {
-      this.loadModel()
-    }
-
-    componentDidUpdate() {
-      const newModelId = this.getModelId()
-
-      // The model ID was changed in the URL and a different model should be loaded
-      if (newModelId != this.state.modelId) {
-        this.setState({model: undefined, modelId: newModelId})
-        this.loadExistingModel()
-      }
-    }
-
-    loadModel = async () => {
-      if (this.args.newIfNoId && !this.getModelId()) {
-        return await this.loadNewModel()
-      } else if (!this.args.optional || this.getModelId()) {
-        return await this.loadExistingModel()
-      }
-    }
-
-    getModelId() {
-      if (this.args.loadByQueryParam)
-        return this.args.loadByQueryParam({props: this.props})
-
-      return this.props.match.params[this.paramsVariableName] || this.props.match.params.id
-    }
-
-    loadExistingModel = async () => {
-      const modelId = this.getModelId()
-      const ModelClass = digg(this, "modelClass")
-      const query = await ModelClass.ransack({id_eq: modelId})
-
-      if (!modelId) throw new Error(`No model ID was given: ${modelId} by '${this.paramsVariableName}' in query params: ${Object.keys(this.props.match.params).join(", ")}`)
-      if (this.args.abilities) query.abilities(this.args.abilities)
-      if (this.args.preload) query.preload(this.args.preload)
-      if (this.args.select) query.select(this.args.select)
-
-      const model = await query.first()
-
-      this.setState({
-        model,
-        notFound: !model
-      })
-    }
-
-    async loadNewModel() {
-      const params = Params.parse()
-      const ModelClass = digg(this, "modelClass")
-      const paramKey = ModelClass.modelName().paramKey()
-      const modelDataFromParams = params[paramKey] || {}
-
-      let defaults = {}
-
-      if (this.args.newIfNoId?.defaults) {
-        defaults = await this.args.newIfNoId.defaults()
-      }
-
-      const modelData = Object.assign(defaults, this.args.newAttributes, modelDataFromParams)
-      const model = new ModelClass({
-        isNewRecord: true,
-        data: {a: modelData}
-      })
-
-      this.setState({model})
-    }
-
-    render() {
-      const {onUpdated, reloadModel} = digs(this, "onUpdated", "reloadModel")
-      const {model, modelId, notFound} = digs(this.state, "model", "modelId", "notFound")
-      const wrappedComponentProps = {}
-
-      wrappedComponentProps[this.modelVariableName] = model
-      wrappedComponentProps[`${this.modelVariableName}Id`] = modelId
-      wrappedComponentProps[`${this.modelVariableName}NotFound`] = notFound
-
-      return (
-        <>
-          {this.args.events &&
-            <EventEmitterListener event="reloadModel" events={this.args.events} onCalled={reloadModel} />
-          }
-          {model && this.args.eventUpdated &&
-            <EventUpdated model={model} onUpdated={onUpdated} />
-          }
-          {model && this.args.onDestroyed &&
-            <EventDestroyed model={model} onDestroyed={this.args.onDestroyed} />
-          }
-          <WrappedComponent {...wrappedComponentProps} {...this.props} />
-        </>
-      )
-    }
-
-    reloadModel = () => this.loadModel()
-    onUpdated = this.loadExistingModel
+    return (
+      <WrappedComponent {...useModelResult} {...props} />
+    )
   }
 
-  return withQueryParams(ApiMakerWithModel)
+  return memo(ApiMakerWithModel)
 }