@kaspernj/api-maker 1.0.262 → 1.0.264

package/package.json

@@ -16,7 +16,7 @@
     ]
   },
   "name": "@kaspernj/api-maker",
-  "version": "1.0.262",
+  "version": "1.0.264",
   "type": "module",
   "description": "",
   "main": "index.js",
@@ -75,6 +75,6 @@
     "eslint-plugin-react": "^7.23.2",
     "i18n-on-steroids": "^1.0.5",
     "jest": "^29.0.1",
-    "jsdom": "^21.0.0"
+    "jsdom": "^22.0.0"
   }
 }

package/src/error-logger.mjs

@@ -3,7 +3,7 @@ import SourceMapsLoader from "./source-maps-loader.mjs"
 
 export default class ErrorLogger {
   constructor () {
-    this.debugging = true
+    this.debugging = false
     this.errorOccurred = false
     this.errors = []
     this.isHandlingError = false
@@ -18,7 +18,12 @@ export default class ErrorLogger {
     })
   }
 
+  debug(...output) {
+    if (this.debugging) console.error(`ApiMaker ErrorLogger:`, ...output)
+  }
+
   enable () {
+    this.debug("Enable called")
     this.connectOnError()
     this.connectUnhandledRejection()
   }
@@ -40,7 +45,8 @@ export default class ErrorLogger {
   }
 
   connectOnError () {
-    globalThis.addEventListener("error", (event) => {
+    window.addEventListener("error", (event) => {
+      if (this.debugging) this.debug(`Error:`, event.message)
       this.errorOccurred = true
 
       if (!this.isHandlingError) {
@@ -53,7 +59,8 @@ export default class ErrorLogger {
   }
 
   connectUnhandledRejection () {
-    globalThis.addEventListener("unhandledrejection", (event) => {
+    window.addEventListener("unhandledrejection", (event) => {
+      if (this.debugging) this.debug(`Unhandled rejection:`, event.reason.message)
       this.errorOccurred = true
 
       if (!this.isHandlingError) {

package/src/table/model-row.jsx

@@ -7,6 +7,8 @@ import Link from "../link"
 import MoneyFormatter from "../money-formatter"
 import PropTypes from "prop-types"
 
+const WorkerPluginsCheckbox = React.lazy(() => import("./worker-plugins-checkbox"))
+
 export default class ApiMakerBootStrapLiveTableModelRow extends React.PureComponent {
   static propTypes = {
     cacheKey: PropTypes.string.isRequired,
@@ -16,10 +18,10 @@ export default class ApiMakerBootStrapLiveTableModelRow extends React.PureCompon
   }
 
   render() {
-    const {cacheKey, model} = digs(this.props, "cacheKey", "model")
-    const {modelClass} = digs(this.props.liveTable.props, "modelClass")
+    const {model} = digs(this.props, "model")
+    const {modelClass, workplace} = digs(this.props.liveTable.props, "modelClass", "workplace")
     const {actionsContent, columnsContent, destroyEnabled, editModelPath, viewModelPath} = digg(this, "props", "liveTable", "props")
-    const {columns} = digg(this, "props", "liveTable", "shape")
+    const {columns, currentWorkplace} = digg(this, "props", "liveTable", "shape")
 
     this.modelCallbackArgs = this._modelCallbackArgs() // 'model' can change so this needs to be re-cached for every render
 
@@ -33,6 +35,11 @@ export default class ApiMakerBootStrapLiveTableModelRow extends React.PureCompon
 
     return (
       <RowComponent className={`live-table-row ${inflection.dasherize(modelClass.modelClassData().paramKey)}-row`} data-model-id={model.id()}>
+        {workplace &&
+          <ColumnComponent className="workplace-column">
+            <WorkerPluginsCheckbox currentWorkplace={currentWorkplace} model={model} />
+          </ColumnComponent>
+        }
         {columns && this.columnsContentFromColumns(model)}
         {!columns && columnsContent && columnsContent(this.modelCallbackArgs)}
         <ColumnComponent className="actions-column">

package/src/table/style.scss

@@ -1,6 +1,6 @@
 @import "./variables";
 
-.component-api-maker-live-table {
+.api-maker--table {
   .live-table-header {
     text-align: left;
   }

package/src/table/table.jsx

@@ -23,6 +23,7 @@ import uniqunize from "uniqunize"
 import withBreakpoint from "./with-breakpoint"
 
 const paginationOptions = [30, 60, 90, ["All", "all"]]
+const WorkerPluginsCheckAllCheckbox = React.lazy(() => import("./worker-plugins-check-all-checkbox"))
 
 class ApiMakerTable extends React.PureComponent {
   static defaultProps = {
@@ -33,7 +34,8 @@ class ApiMakerTable extends React.PureComponent {
     noRecordsAvailableContent: undefined,
     noRecordsFoundContent: undefined,
     preloads: [],
-    select: {}
+    select: {},
+    workplace: false
   }
 
   static propTypes = {
@@ -69,7 +71,8 @@ class ApiMakerTable extends React.PureComponent {
     queryName: PropTypes.string,
     select: PropTypes.object,
     selectColumns: PropTypes.object,
-    viewModelPath: PropTypes.func
+    viewModelPath: PropTypes.func,
+    workplace: PropTypes.bool.isRequired
   }
 
   filterFormRef = React.createRef()
@@ -86,6 +89,7 @@ class ApiMakerTable extends React.PureComponent {
 
     this.shape = new Shape(this, {
       columns: columnsAsArray,
+      currentWorkplace: undefined,
       identifier: this.props.identifier || `${collectionKey}-default`,
       models: undefined,
       overallCount: undefined,
@@ -105,6 +109,16 @@ class ApiMakerTable extends React.PureComponent {
     })
 
     this.loadTableSetting()
+
+    if (this.props.workplace) this.loadCurrentWorkplace()
+  }
+
+  async loadCurrentWorkplace() {
+    const Workplace = modelClassRequire("Workplace")
+    const result = await Workplace.current()
+    const currentWorkplace = digg(result, "current", 0)
+
+    this.shape.set({currentWorkplace})
   }
 
   async loadTableSetting() {
@@ -270,6 +284,7 @@ class ApiMakerTable extends React.PureComponent {
       select,
       selectColumns,
       viewModelPath,
+      workplace,
       ...restProps
     } = this.props
     const {models, qParams, query, result} = digs(this.shape, "models", "qParams", "query", "result")
@@ -382,8 +397,8 @@ class ApiMakerTable extends React.PureComponent {
   }
 
   tableContent () {
-    const {breakPoint} = digs(this.props, "breakPoint")
-    const {models, preparedColumns} = digs(this.shape, "models", "preparedColumns")
+    const {breakPoint, workplace} = digs(this.props, "breakPoint", "workplace")
+    const {currentWorkplace, models, preparedColumns, query} = digs(this.shape, "currentWorkplace", "models", "preparedColumns", "query")
     const ColumnInHeadComponent = this.columnInHeadComponent()
     const RowComponent = this.rowComponent()
 
@@ -401,6 +416,11 @@ class ApiMakerTable extends React.PureComponent {
       <>
         <HeadComponent>
           <RowComponent className="live-table-header-row">
+            {workplace && currentWorkplace &&
+              <ColumnInHeadComponent>
+                <WorkerPluginsCheckAllCheckbox currentWorkplace={currentWorkplace} query={query} />
+              </ColumnInHeadComponent>
+            }
             {this.headersContentFromColumns()}
             <ColumnInHeadComponent />
           </RowComponent>
@@ -452,7 +472,7 @@ class ApiMakerTable extends React.PureComponent {
   }
 
   className() {
-    const classNames = ["component-api-maker-live-table"]
+    const classNames = ["api-maker--table"]
 
     if (this.props.className)
       classNames.push(this.props.className)

package/src/table/worker-plugins-check-all-checkbox.jsx

@@ -0,0 +1,29 @@
+import Collection from "../collection.mjs"
+
+export default class ApiMakerTableWorkerPluginsCheckAllCheckbox extends BaseComponent {
+  static propTypes = PropTypesExact({
+    currentWorkplace: PropTypes.object,
+    query: PropTypes.instanceOf(Collection)
+  })
+
+  render() {
+    const {className} = this.props
+
+    return (
+      <input
+        className={classNames("api-maker--table--worker-plugins-check-all-checkbox", className)}
+        onChange={this.onCheckedChanged}
+        type="checkbox"
+      />
+    )
+  }
+
+  onCheckedChanged = async (e) => {
+    e.preventDefault()
+
+    const {currentWorkplace, query} = this.props
+
+    await currentWorkplace.addCollection({query})
+    e.target.checked = true
+  }
+}

package/src/table/worker-plugins-checkbox.jsx

@@ -0,0 +1,96 @@
+import EventConnection from "../event-connection"
+import modelClassRequire from "../model-class-require.mjs"
+
+const Workplace = modelClassRequire("Workplace")
+
+export default class ApiMakerTableWorkerPluginsCheckbox extends BaseComponent {
+  static propTypes = PropTypesExact({
+    currentWorkplace: PropTypes.object,
+    model: PropTypes.object.isRequired
+  })
+
+  shape = new Shape(this, {
+    checked: false
+  })
+
+  componentDidMount() {
+    this.loadCurrentLink()
+  }
+
+  async loadCurrentLink() {
+    const {model} = this.props
+    const response = await Workplace.linkFor({model_class: model.modelClassData().name, model_id: model.id()})
+    const link = digg(response, "link")
+
+    this.shape.set({
+      checked: Boolean(link),
+      linkLoaded: true
+    })
+  }
+
+  render() {
+    const {className, currentWorkplace, model} = this.props
+    const {checked, linkLoaded} = this.shape
+
+    if (!linkLoaded) {
+      return null
+    }
+
+    return (
+      <>
+        {currentWorkplace &&
+          <>
+            <EventConnection event="workplace_links_created" model={currentWorkplace} onCall={this.onLinksCreated} />
+            <EventConnection event="workplace_links_destroyed" model={currentWorkplace} onCall={this.onLinksDestroyed} />
+          </>
+        }
+        <input
+          checked={checked}
+          className={classNames("api-maker--table--worker-plugins-checkbox", className)}
+          data-checked={checked}
+          data-model-id={model.id()}
+          onChange={this.onCheckedChanged}
+          type="checkbox"
+        />
+      </>
+    )
+  }
+
+  onCheckedChanged = (e) => {
+    e.preventDefault()
+
+    const {model} = this.props
+    const checked = e.target.checked
+
+    if (checked) {
+      Workplace.createLink({model_class: model.modelClassData().name, model_id: model.id()})
+    } else {
+      const modelClassName = model.modelClassData().name
+      const params = {models: {}}
+
+      params.models[modelClassName] = [model.id()]
+
+      Workplace.destroyLinks(params)
+    }
+  }
+
+  onLinksCreated = ({args}) => {
+    const {model} = digs(this.props, "model")
+    const id = model.id()
+    const modelClassName = model.modelClassData().name
+
+    if (args.created[modelClassName] && args.created[modelClassName].includes(id)) {
+      this.shape.set({checked: true})
+    }
+  }
+
+  onLinksDestroyed = ({args}) => {
+    const {model} = digs(this.props, "model")
+    const id = model.id()
+    const modelClassName = model.modelClassData().name
+
+    if (args.destroyed[modelClassName] && args.destroyed[modelClassName].includes(id)) {
+      this.shape.set({checked: false})
+    }
+  }
+}