@kaspernj/api-maker 1.0.368 → 1.0.369

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kaspernj/api-maker",
-  "version": "1.0.368",
+  "version": "1.0.369",
   "type": "module",
   "description": "",
   "main": "index.js",

package/src/event-created.jsx

@@ -1,11 +1,12 @@
+import {memo} from "react"
 import useCreatedEvent from "./use-created-event.mjs"
 
-const ApiMakerEventCreated = (props) => {
+const ApiMakerEventCreated = memo((props) => {
   const {modelClass, onCreated, ...restProps} = props
 
   useCreatedEvent(modelClass, onCreated, restProps)
 
   return null
-}
+})
 
 export default ApiMakerEventCreated

package/src/event-destroyed.jsx

@@ -1,27 +1,25 @@
-import ModelEvents from "./model-events.mjs"
+import {memo} from "react"
 import PropTypes from "prop-types"
 import propTypesExact from "prop-types-exact"
-import React from "react"
+import {shapeComponent, ShapeComponent} from "set-state-compare/src/shape-component.js"
+import useDestroyedEvent from "./use-destroyed-event.mjs"
 
-export default class ApiMakerEventDestroyed extends React.PureComponent {
+export default memo(shapeComponent(class ApiMakerEventDestroyed extends ShapeComponent {
   static propTypes = propTypesExact({
+    active: PropTypes.bool,
+    debounce: PropTypes.oneOfType([
+      PropTypes.bool,
+      PropTypes.number
+    ]),
     model: PropTypes.object.isRequired,
-    onDestroyed: PropTypes.func.isRequired
+    onConnected: PropTypes.func,
+    onUpdated: PropTypes.func.isRequired
   })
 
-  componentDidMount () {
-    this.connect()
-  }
-
-  componentWillUnmount () {
-    if (this.connectDestroyed) {
-      this.connectDestroyed.unsubscribe()
-    }
-  }
+  render() {
+    const {model, onDestroyed, ...restProps} = this.props
+    useDestroyedEvent(model, onDestroyed, restProps)
 
-  connect () {
-    this.connectDestroyed = ModelEvents.connectDestroyed(this.props.model, this.props.onDestroyed)
+    return null
   }
-
-  render = () => null
-}
+}))

package/src/event-updated.jsx

@@ -1,23 +1,26 @@
 import PropTypes from "prop-types"
 import propTypesExact from "prop-types-exact"
 import {memo} from "react"
+import {shapeComponent, ShapeComponent} from "set-state-compare/src/shape-component.js"
 import useUpdatedEvent from "./use-updated-event.mjs"
 
-const ApiMakerEventUpdated = ({model, onUpdated, ...restProps}) => {
-  useUpdatedEvent(model, onUpdated, restProps)
+export default memo(shapeComponent(class ApiMakerEventUpdated extends ShapeComponent {
+  static propTypes = propTypesExact({
+    active: PropTypes.bool,
+    debounce: PropTypes.oneOfType([
+      PropTypes.bool,
+      PropTypes.number
+    ]),
+    model: PropTypes.object.isRequired,
+    onConnected: PropTypes.func,
+    onUpdated: PropTypes.func.isRequired
+  })
 
-  return null
-}
+  render() {
+    const {model, onUpdated, ...restProps} = this.props
 
-ApiMakerEventUpdated.propTypes = propTypesExact({
-  active: PropTypes.bool,
-  debounce: PropTypes.oneOfType([
-    PropTypes.bool,
-    PropTypes.number
-  ]),
-  model: PropTypes.object.isRequired,
-  onConnected: PropTypes.func,
-  onUpdated: PropTypes.func.isRequired
-})
+    useUpdatedEvent(model, onUpdated, restProps)
 
-export default memo(ApiMakerEventUpdated)
+    return null
+  }
+}))

package/src/use-destroyed-event.mjs

@@ -0,0 +1,60 @@
+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 apiMakerUseDestroyedEvent = (model, onDestroyed, props) => {
+  const {active = true, debounce, onConnected, ...restProps} = props || {}
+
+  if (Object.keys(restProps).length > 0) {
+    throw new Error(`Unknown props given to useDestroyedEvent: ${Object.keys(restProps).join(", ")}`)
+  }
+
+  const s = useShape({active, debounce, model, onDestroyed})
+
+  const debounceCallback = useMemo(() => {
+    if (typeof debounce == "number") {
+      return debounceFunction(s.p.onDestroyed, debounce)
+    } else {
+      return debounceFunction(s.p.onDestroyed)
+    }
+  }, [debounce])
+
+  s.updateMeta({debounceCallback})
+
+  const onDestroyedCallback = useCallback((...args) => {
+    if (!s.p.active) {
+      return
+    }
+
+    if (s.p.debounce) {
+      s.m.debounceCallback(...args)
+    } else {
+      s.p.onDestroyed(...args)
+    }
+  }, [])
+
+  useEffect(() => {
+    let connectDestroyed, onConnectedListener
+
+    if (model) {
+      connectDestroyed = ModelEvents.connectDestroyed(model, onDestroyedCallback)
+
+      if (onConnected) {
+        onConnectedListener = connectDestroyed.events.addListener("connected", onConnected)
+      }
+    }
+
+    return () => {
+      if (onConnectedListener) {
+        connectDestroyed.events.removeListener("connected", onConnected)
+      }
+
+      if (connectDestroyed) {
+        connectDestroyed.unsubscribe()
+      }
+    }
+  }, [model?.id()])
+}
+
+export default apiMakerUseDestroyedEvent

package/src/use-updated-event.mjs

@@ -3,7 +3,7 @@ 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}) => {
+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(", ")}`)
   }
@@ -55,4 +55,4 @@ const ApiMakerUseUpdatedEvent = (model, onUpdated, {active = true, debounce, onC
   }, [model?.id()])
 }
 
-export default ApiMakerUseUpdatedEvent
+export default apiMakerUseUpdatedEvent