@kaspernj/api-maker 1.0.328 → 1.0.330

package/package.json

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

package/src/base-model/reflection.mjs

@@ -11,4 +11,5 @@ export default class ApiMakerBaseModelReflection {
   macro = () => digg(this, "reflectionData", "macro")
   modelClass = () => modelClassRequire(inflection.singularize(inflection.camelize(digg(this, "reflectionData", "resource_name"))))
   name = () => inflection.camelize(digg(this, "reflectionData", "name"), true)
+  through = () => digg(this, "reflectionData", "through")
 }

package/src/router.jsx

@@ -1,45 +1,38 @@
 import PropTypes from "prop-types"
-import React from "react"
-import shouldComponentUpdate from "set-state-compare/src/should-component-update"
+import React, {memo} from "react"
 import {Suspense} from "react"
 import withRouter from "./with-router"
 
-class ApiMakerRouter extends React.Component {
-  static propTypes = {
-    notFoundComponent: PropTypes.elementType,
-    requireComponent: PropTypes.func.isRequired
-  }
-
-  shouldComponentUpdate(nextProps, nextState) {
-    return shouldComponentUpdate(this, nextProps, nextState)
+const ApiMakerRouter = (props) => {
+  const {match, ...restProps} = props
+  const {matchingRoute} = match
+
+  if (!matchingRoute) {
+    if (props.notFoundComponent) {
+      const NotFoundComponent = props.notFoundComponent
+
+      return (
+        <Suspense fallback={<div />}>
+          <NotFoundComponent match={match} />
+        </Suspense>
+      )
+    } else {
+      return null
+    }
   }
 
-  render() {
-    const {match, ...restProps} = this.props
-    const {matchingRoute} = match
-
-    if (!matchingRoute) {
-      if (this.props.notFoundComponent) {
-        const NotFoundComponent = this.props.notFoundComponent
+  const Component = props.requireComponent({routeDefinition: matchingRoute.parsedRouteDefinition.routeDefinition})
 
-        return (
-          <Suspense fallback={<div />}>
-            <NotFoundComponent match={match} />
-          </Suspense>
-        )
-      } else {
-        return null
-      }
-    }
-
-    const Component = this.props.requireComponent({routeDefinition: matchingRoute.parsedRouteDefinition.routeDefinition})
+  return (
+    <Suspense fallback={<div />}>
+      <Component match={match} {...restProps} />
+    </Suspense>
+  )
+}
 
-    return (
-      <Suspense fallback={<div />}>
-        <Component match={match} {...restProps} />
-      </Suspense>
-    )
-  }
+ApiMakerRouter.propTypes = {
+  notFoundComponent: PropTypes.elementType,
+  requireComponent: PropTypes.func.isRequired
 }
 
-export default withRouter(ApiMakerRouter)
+export default withRouter(memo(ApiMakerRouter))

package/src/super-admin/show-page/index.jsx

@@ -43,21 +43,37 @@ const ApiMakerSuperAdminShowPage = ({modelClass}) => {
   }
 
   for (const reflection of modelClass.reflections()) {
-    if (reflection.macro() != "belongs_to") continue
-
-    const reflectionModelClass = reflection.modelClass()
-    const reflectionModelClassName = reflectionModelClass.modelClassData().name
-    const reflectionModelClassAttributes = reflectionModelClass.attributes()
-    const nameAttribute = reflectionModelClassAttributes.find((attribute) => attribute.name() == "name")
-
-    preload.push(inflection.underscore(reflection.name()))
-
-    if (!(reflectionModelClassName in select)) select[reflectionModelClassName] = []
-    if (!select[reflectionModelClassName].includes("id")) select[reflectionModelClassName].push("id")
-    if (nameAttribute && !select[reflectionModelClassName].includes("name")) select[reflectionModelClassName].push("name")
-
-    // The foreign key is needed to look up any belongs-to-relationships
-    if (!modelClassSelect.includes(reflection.foreignKey())) modelClassSelect.push(reflection.foreignKey())
+    if (reflection.macro() == "belongs_to") {
+      const reflectionModelClass = reflection.modelClass()
+      const reflectionModelClassName = reflectionModelClass.modelClassData().name
+      const reflectionModelClassAttributes = reflectionModelClass.attributes()
+      const nameAttribute = reflectionModelClassAttributes.find((attribute) => attribute.name() == "name")
+
+      preload.push(inflection.underscore(reflection.name()))
+
+      if (!(reflectionModelClassName in select)) select[reflectionModelClassName] = []
+      if (!select[reflectionModelClassName].includes("id")) select[reflectionModelClassName].push("id")
+      if (nameAttribute && !select[reflectionModelClassName].includes("name")) select[reflectionModelClassName].push("name")
+
+      // The foreign key is needed to look up any belongs-to-relationships
+      if (!modelClassSelect.includes(reflection.foreignKey())) modelClassSelect.push(reflection.foreignKey())
+    } else if (reflection.macro() == "has_one") {
+      const reflectionModelClass = reflection.modelClass()
+      const reflectionModelClassName = reflectionModelClass.modelClassData().name
+      const reflectionModelClassAttributes = reflectionModelClass.attributes()
+      const nameAttribute = reflectionModelClassAttributes.find((attribute) => attribute.name() == "name")
+
+      preload.push(inflection.underscore(reflection.name()))
+
+      if (!(reflectionModelClassName in select)) select[reflectionModelClassName] = []
+      if (!select[reflectionModelClassName].includes("id")) select[reflectionModelClassName].push("id")
+      if (nameAttribute && !select[reflectionModelClassName].includes("name")) select[reflectionModelClassName].push("name")
+
+      // The foreign key is needed to look up any has-one-relationships
+      if (!modelClassSelect.includes(reflection.foreignKey()) && !select[reflectionModelClassName].includes(reflection.foreignKey()) && !reflection.through()) {
+        select[reflectionModelClassName].push(reflection.foreignKey())
+      }
+    }
   }
 
   const useModelResult = useModel(modelClass, {
@@ -79,7 +95,7 @@ const ApiMakerSuperAdminShowPage = ({modelClass}) => {
       {attributes && model && attributes.map((attribute) =>
         <AttributePresenter attribute={attribute} key={attribute.attribute || attribute} modelArgs={modelArgs} model={model} />
       )}
-      {model && modelClass.reflections().filter((reflection) => reflection.macro() == "belongs_to").map((reflection) =>
+      {model && modelClass.reflections().filter((reflection) => reflection.macro() == "belongs_to" || reflection.macro() == "has_one").map((reflection) =>
         <BelongsToAttributeRow key={reflection.name()} model={model} modelClass={modelClass} reflection={reflection} />
       )}
       {model && extraContent && extraContent(modelArgs)}

package/src/use-router.jsx

@@ -0,0 +1,125 @@
+import config from "./config.mjs"
+import escapeStringRegexp from "escape-string-regexp"
+import * as inflection from "inflection"
+import PropTypes from "prop-types"
+import {useCallback, useMemo} from "react"
+import useShape from "set-state-compare/src/use-shape.js"
+
+const useRouter = (props) => {
+  const s = useShape(props)
+
+  const findRouteParams = useCallback((routeDefinition) => {
+    const result = []
+    const parts = routeDefinition.path.split("/")
+
+    for (const part of parts) {
+      if (part.match(/^:([a-z_]+)$/))
+        result.push(part)
+    }
+
+    return result
+  }, [])
+
+  const getPath = useCallback(() => {
+    let path = s.p.path || window.location.pathname
+
+    path = path.replace(/[/]+$/, "")
+
+    return path
+  }, [])
+
+  const getRouteDefinitions = useCallback(() =>  s.p.routeDefinitions || config.getRouteDefinitions(), [])
+  const getRoutes = useCallback(() => s.p.routes || config.getRoutes(), [])
+
+  const parseRouteDefinitions = useCallback(() => {
+    const Locales = require("shared/locales").default
+    const routeDefinitions = getRouteDefinitions()
+    const routes = getRoutes()
+    const regex = /:([A-z\d_]+)/
+    const parsedRouteDefinitions = []
+
+    for (const locale of Locales.availableLocales()) {
+      for (const routeDefinition of routeDefinitions.routes) {
+        const routePathName = `${inflection.camelize(routeDefinition.name, true)}Path`
+        const params = findRouteParams(routeDefinition)
+
+        params.push({locale})
+
+        if (!(routePathName in routes))
+          throw new Error(`${routePathName} not found in routes: ${Object.keys(routes, ", ")}`)
+
+        const routePath = routes[routePathName](...params).replace(/[/]+$/, "")
+        const groups = []
+        let pathRegexString = "^"
+
+        pathRegexString += escapeStringRegexp(routePath)
+
+        while (true) {
+          const match = pathRegexString.match(regex)
+
+          if (!match) break
+
+          const variableName = match[1]
+
+          groups.push(variableName)
+
+          pathRegexString = pathRegexString.replace(match[0], "([^/]+)")
+        }
+
+        pathRegexString += "$"
+
+        const pathRegex = new RegExp(pathRegexString)
+
+        parsedRouteDefinitions.push({groups, pathRegex, routeDefinition})
+      }
+    }
+
+    return parsedRouteDefinitions
+  }, [])
+
+  const parsedRouteDefinitions = useMemo(() => parseRouteDefinitions(), [])
+
+  s.updateMeta({parsedRouteDefinitions})
+
+  const findMatchingRoute = useCallback(() => {
+    const path = getPath()
+
+    for (const parsedRouteDefinition of s.m.parsedRouteDefinitions) {
+      const match = path.match(parsedRouteDefinition.pathRegex)
+      let matched, params
+
+      if (match) {
+        matched = true
+        params = {}
+
+        for (const groupKey in parsedRouteDefinition.groups) {
+          const groupName = parsedRouteDefinition.groups[groupKey]
+
+          params[groupName] = match[Number(groupKey) + 1]
+        }
+      }
+
+      if (path == "" && parsedRouteDefinition.routeDefinition.path == "/") matched = true
+      if (matched) {
+        return {params, parsedRouteDefinition}
+      }
+    }
+  }, [])
+
+  const matchingRoute = findMatchingRoute()
+  const params = matchingRoute?.params || {}
+  const match = {
+    matchingRoute,
+    params
+  }
+
+  return {match}
+}
+
+useRouter.propTypes = {
+  path: PropTypes.string,
+  routeDefinitions: PropTypes.object,
+  routes: PropTypes.object
+}
+
+export default useRouter

package/src/with-router.jsx

@@ -1,133 +1,10 @@
-import config from "./config.mjs"
-import escapeStringRegexp from "escape-string-regexp"
-import * as inflection from "inflection"
-import PropTypes from "prop-types"
-import React from "react"
-import shouldComponentUpdate from "set-state-compare/src/should-component-update"
+import useRouter from "./use-router"
 
-export default (WrapperComponent) => class WithRouter extends React.Component {
-  static propTypes = {
-    path: PropTypes.string,
-    routeDefinitions: PropTypes.object,
-    routes: PropTypes.object
-  }
+export default (WrapperComponent) => (props) => {
+  const {path, routes, routeDefinitions, ...restProps} = props
+  const {match} = useRouter({path, routes, routeDefinitions})
 
-  parsedRouteDefinitions = this.parseRouteDefinitions()
-
-  shouldComponentUpdate(nextProps, nextState) {
-    return shouldComponentUpdate(this, nextProps, nextState)
-  }
-
-  findRouteParams(routeDefinition) {
-    const result = []
-    const parts = routeDefinition.path.split("/")
-
-    for (const part of parts) {
-      if (part.match(/^:([a-z_]+)$/))
-        result.push(part)
-    }
-
-    return result
-  }
-
-  path() {
-    let path = this.props.path || window.location.pathname
-
-    path = path.replace(/[/]+$/, "")
-
-    return path
-  }
-
-  routeDefinitions() {
-    return this.props.routeDefinitions || config.getRouteDefinitions()
-  }
-
-  routes() {
-    return this.props.routes || config.getRoutes()
-  }
-
-  parseRouteDefinitions() {
-    const Locales = require("shared/locales").default
-    const routeDefinitions = this.routeDefinitions()
-    const routes = this.routes()
-    const regex = /:([A-z\d_]+)/
-    const parsedRouteDefinitions = []
-
-    for (const locale of Locales.availableLocales()) {
-      for (const routeDefinition of routeDefinitions.routes) {
-        const routePathName = `${inflection.camelize(routeDefinition.name, true)}Path`
-        const params = this.findRouteParams(routeDefinition)
-
-        params.push({locale})
-
-        if (!(routePathName in routes))
-          throw new Error(`${routePathName} not found in routes: ${Object.keys(routes, ", ")}`)
-
-        const routePath = routes[routePathName](...params).replace(/[/]+$/, "")
-        const groups = []
-        let pathRegexString = "^"
-
-        pathRegexString += escapeStringRegexp(routePath)
-
-        while (true) {
-          const match = pathRegexString.match(regex)
-
-          if (!match) break
-
-          const variableName = match[1]
-
-          groups.push(variableName)
-
-          pathRegexString = pathRegexString.replace(match[0], "([^/]+)")
-        }
-
-        pathRegexString += "$"
-
-        const pathRegex = new RegExp(pathRegexString)
-
-        parsedRouteDefinitions.push({groups, pathRegex, routeDefinition})
-      }
-    }
-
-    return parsedRouteDefinitions
-  }
-
-  findMatchingRoute() {
-    const path = this.path()
-
-    for (const parsedRouteDefinition of this.parsedRouteDefinitions) {
-      const match = path.match(parsedRouteDefinition.pathRegex)
-      let matched, params
-
-      if (match) {
-        matched = true
-        params = {}
-
-        for (const groupKey in parsedRouteDefinition.groups) {
-          const groupName = parsedRouteDefinition.groups[groupKey]
-
-          params[groupName] = match[Number(groupKey) + 1]
-        }
-      }
-
-      if (path == "" && parsedRouteDefinition.routeDefinition.path == "/") matched = true
-      if (matched) {
-        return {params, parsedRouteDefinition}
-      }
-    }
-  }
-
-  render() {
-    const {path, routes, routeDefinitions, ...restProps} = this.props
-    const matchingRoute = this.findMatchingRoute()
-    const params = matchingRoute?.params || {}
-    const match = {
-      matchingRoute,
-      params
-    }
-
-    return (
-      <WrapperComponent match={match} {...restProps} />
-    )
-  }
+  return (
+    <WrapperComponent match={match} {...restProps} />
+  )
 }