Implemented DocumentPrinters and DocumentJobs

src/components/Dashboard/Management/DocumentJobs/NewDocumentJob.jsx

@@ -68,12 +68,14 @@ const NewDocumentJob = ({ onOk, defaultValues = {} }) => {
             }
             onSubmit={async () => {
               const newDocumentJob = await handleSubmit()
-              if (newDocumentJob.sendToFile == true) {
+              await sendObjectAction(
-                sendObjectAction(newDocumentJob._id, 'documentJob', {
+                newDocumentJob.documentPrinter._id,
-                  type: 'print',
+                'documentPrinter',
+                {
+                  type: 'deploy',
                   data: newDocumentJob
-                })
                 }
+              )
               if (onOk) {
                 onOk()
               }

src/components/Dashboard/Management/Hosts/HostInfo.jsx

@@ -22,6 +22,7 @@ import InfoCollapsePlaceholder from '../../common/InfoCollapsePlaceholder.jsx'
 import HostOTP from './HostOtp.jsx'
 import DocumentPrintButton from '../../common/DocumentPrintButton.jsx'
 import PrinterIcon from '../../../Icons/PrinterIcon.jsx'
+import DocumentPrinterIcon from '../../../Icons/DocumentPrinterIcon.jsx'
 
 const log = loglevel.getLogger('HostInfo')
 log.setLevel(config.logLevel)
@@ -34,6 +35,7 @@ const HostInfo = () => {
   const [collapseState, updateCollapseState] = useCollapseState('HostInfo', {
     info: true,
     printers: true,
+    documentPrinters: true,
     notes: true,
     auditLogs: true
   })
@@ -95,6 +97,7 @@ const HostInfo = () => {
                 items={[
                   { key: 'info', label: 'Host Information' },
                   { key: 'printers', label: 'Printers' },
+                  { key: 'documentPrinters', label: 'Document Printers' },
                   { key: 'notes', label: 'Notes' },
                   { key: 'auditLogs', label: 'Audit Logs' }
                 ]}
@@ -149,7 +152,6 @@ const HostInfo = () => {
                   style={{ height: '100%' }}
                   ref={objectFormRef}
                   onStateChange={(state) => {
-                    console.log('Got edit form state change', state)
                     setEditFormState((prev) => ({ ...prev, ...state }))
                   }}
                 >
@@ -188,6 +190,28 @@ const HostInfo = () => {
                 />
               )}
             </InfoCollapse>
+            <InfoCollapse
+              title='Document Printers'
+              icon={<DocumentPrinterIcon />}
+              active={collapseState.documentPrinters}
+              onToggle={(expanded) =>
+                updateCollapseState('documentPrinters', expanded)
+              }
+              collapseKey='documentPrinters'
+            >
+              {objectFormState.loading ? (
+                <InfoCollapsePlaceholder />
+              ) : (
+                <ObjectTable
+                  type='documentPrinter'
+                  masterFilter={{ 'host._id': hostId }}
+                  visibleColumns={{
+                    host: false,
+                    'host._id': false
+                  }}
+                />
+              )}
+            </InfoCollapse>
 
             <InfoCollapse
               title='Notes'

src/components/Dashboard/common/ObjectProperty.jsx

@@ -37,6 +37,7 @@ import ObjectDisplay from './ObjectDisplay'
 import ObjectTypeSelect from './ObjectTypeSelect'
 import ObjectTypeDisplay from './ObjectTypeDisplay'
 import CodeBlockEditor from './CodeBlockEditor'
+import CustomSelect from './CustomSelect'
 import StateDisplay from './StateDisplay'
 import AlertsDisplay from './AlertsDisplay'
 import FileUpload from './FileUpload'
@@ -84,6 +85,7 @@ const ObjectProperty = ({
   options = [],
   roundNumber = false,
   showHyperlink,
+  showSince,
   ...rest
 }) => {
   if (value && typeof value == 'function' && objectData) {
@@ -117,6 +119,9 @@ const ObjectProperty = ({
   if (masterFilter && typeof masterFilter == 'function' && objectData) {
     masterFilter = masterFilter(objectData)
   }
+  if (options && typeof options == 'function' && objectData) {
+    options = options(objectData)
+  }
 
   if (!value) {
     value = getPropertyValue(objectData, name)
@@ -169,8 +174,9 @@ const ObjectProperty = ({
               )
           }
         case 'select': {
-          const selectValue = options.find((option) => option.value === value)
+          if (options && Array.isArray(options)) {
-          if (selectValue) {
+            const selectValue =
+              options.find((option) => option.value === value) || 'n/a'
             return <Text {...textParams}>{selectValue.label}</Text>
           } else {
             return (
@@ -206,7 +212,9 @@ const ObjectProperty = ({
         }
         case 'dateTime': {
           if (value != null) {
-            return <TimeDisplay dateTime={value} {...rest} />
+            return (
+              <TimeDisplay dateTime={value} showSince={showSince} {...rest} />
+            )
           } else {
             return (
               <Text type='secondary' {...textParams}>
@@ -249,7 +257,7 @@ const ObjectProperty = ({
               )
             } else {
               var roundedValue = value
-              if (roundNumber != false) {
+              if (roundNumber != false && typeof value === 'number') {
                 roundedValue = value.toFixed(roundNumber)
               }
 
@@ -508,7 +516,10 @@ const ObjectProperty = ({
 
     // Editable mode: wrap in Form.Item
     // Merge required rule if needed
-    let mergedFormItemProps = { ...formItemProps, style: { flexGrow: 1 } }
+    let mergedFormItemProps = {
+      ...formItemProps,
+      style: { flexGrow: 1, width: '100%' }
+    }
     if (required && disabled == false) {
       let rules
       if (mergedFormItemProps.rules) {
@@ -575,11 +586,10 @@ const ObjectProperty = ({
       case 'select':
         return (
           <Form.Item name={formItemName} {...mergedFormItemProps}>
-            <Select
+            <CustomSelect
-              defaultValue={value}
               placeholder={'Select a ' + label.toLowerCase() + '...'}
               disabled={disabled}
-              options={options}
+              options={Array.isArray(options) ? options : []}
             />
           </Form.Item>
         )
@@ -804,7 +814,8 @@ ObjectProperty.propTypes = {
   previewOpen: PropTypes.bool,
   showPreview: PropTypes.bool,
   showHyperlink: PropTypes.bool,
-  options: PropTypes.array
+  options: PropTypes.array,
+  showSince: PropTypes.bool
 }
 
 export default ObjectProperty

src/components/Dashboard/common/StateDisplay.jsx

@@ -1,9 +1,18 @@
 // PrinterSelect.js
 import PropTypes from 'prop-types'
-import { Progress, Flex, Space } from 'antd'
+import { Progress, Flex, Space, Modal, Button, Typography } from 'antd'
 import StateTag from './StateTag'
+import InfoCircleIcon from '../../Icons/InfoCircleIcon'
+import { useState } from 'react'
 
-const StateDisplay = ({ state, showProgress = true, showState = true }) => {
+const { Text } = Typography
+
+const StateDisplay = ({
+  state,
+  showProgress = true,
+  showState = true,
+  showMessage = true
+}) => {
   const loadingProgressTypes = [
     'loading',
     'processing',
@@ -15,8 +24,9 @@ const StateDisplay = ({ state, showProgress = true, showState = true }) => {
     type: 'unknown',
     progress: 0
   }
-
+  const [showMessageModal, setShowMessageModal] = useState(false)
   return (
+    <>
       <Flex gap='small' align={'center'}>
         {showState && (
           <Space>
@@ -34,14 +44,34 @@ const StateDisplay = ({ state, showProgress = true, showState = true }) => {
             style={{ width: '150px', marginBottom: '2px' }}
           />
         ) : null}
+
+        {showMessage && currentState?.message && (
+          <Button
+            type='text'
+            size='small'
+            style={{ padding: '4px' }}
+            onClick={() => setShowMessageModal(true)}
+          >
+            <InfoCircleIcon />
+          </Button>
+        )}
       </Flex>
+      <Modal
+        open={showMessageModal}
+        onCancel={() => setShowMessageModal(false)}
+        footer={null}
+      >
+        <Text>{currentState.message}</Text>
+      </Modal>
+    </>
   )
 }
 
 StateDisplay.propTypes = {
   state: PropTypes.object,
   showProgress: PropTypes.bool,
-  showState: PropTypes.bool
+  showState: PropTypes.bool,
+  showMessage: PropTypes.bool
 }
 
 export default StateDisplay

src/components/Dashboard/common/StateTag.jsx

@@ -32,6 +32,14 @@ const StateTag = ({ state, showBadge = true, style = {} }) => {
         status = 'warning'
         text = 'Initializing'
         break
+      case 'connecting':
+        status = 'warning'
+        text = 'Connecting'
+        break
+      case 'deploying':
+        status = 'warning'
+        text = 'Deploying'
+        break
       case 'printing':
         status = 'processing'
         text = 'Printing'

src/components/Dashboard/context/ApiServerContext.jsx

@@ -337,8 +337,6 @@ const ApiServerProvider = ({ children }) => {
         const callbacks = subscribedCallbacksRef.current
           .get(objectType)
           .filter((cb) => cb !== callback)
-        console.log('API: CALLBACKS', callbacks)
-
         if (callbacks.length === 0) {
           subscribedCallbacksRef.current.delete(objectType)
           socketRef.current.emit('unsubscribeObjectTypeUpdate', {

src/database/models/DocumentPrinter.js

@@ -84,10 +84,10 @@ export const DocumentPrinter = {
       readOnly: true
     },
     {
-      name: 'active',
+      name: 'connectedAt',
-      label: 'Active',
+      label: 'Connected At',
-      type: 'bool',
+      type: 'dateTime',
-      required: true
+      readOnly: true
     },
     {
       name: 'online',
@@ -95,6 +95,12 @@ export const DocumentPrinter = {
       type: 'bool',
       readOnly: true
     },
+    {
+      name: 'active',
+      label: 'Active',
+      type: 'bool',
+      required: true
+    },
     {
       name: 'host',
       label: 'Host',
@@ -111,16 +117,6 @@ export const DocumentPrinter = {
       showCopy: true,
       showHyperlink: true
     },
-    {
-      name: 'connection.mode',
-      label: 'Mode',
-      type: 'select',
-      options: [
-        { label: 'Network', value: 'network' },
-        { label: 'Serial', value: 'serial' }
-      ],
-      required: true
-    },
     {
       name: 'connection.interface',
       label: 'Interface',
@@ -132,12 +128,43 @@ export const DocumentPrinter = {
       ],
       required: true
     },
+    {
+      name: 'connection.protocol',
+      label: 'Protocol',
+      type: 'select',
+      options: (objectData) => {
+        if (objectData?.connection?.interface == 'cups') {
+          return [
+            { label: 'IPP', value: 'ipp' },
+            { label: 'HTTP', value: 'http' }
+          ]
+        }
+        return [
+          { label: 'TCP', value: 'tcp' },
+          { label: 'Serial', value: 'serial' },
+          { label: 'System', value: 'system' }
+        ]
+      },
+      required: true
+    },
     {
       name: 'connection.host',
-      label: 'Connection String',
+      label: 'Host Name',
       type: 'text',
       required: true
     },
+    {
+      name: 'connection.port',
+      label: 'Port',
+      type: 'number',
+      required: false,
+      disabled: (objectData) => {
+        return (
+          objectData?.connection?.protocol == 'system' ||
+          objectData?.connection?.protocol == 'serial'
+        )
+      }
+    },
     {
       name: 'currentDocumentSize',
       label: 'Current Document Size',

src/database/models/DocumentSize.js

@@ -95,7 +95,17 @@ export const DocumentSize = {
       required: true,
       columnWidth: 150,
       type: 'number',
-      suffix: 'mm'
+      suffix: 'mm',
+      disabled: (objectData) => {
+        return objectData.infiniteHeight
+      }
+    },
+    {
+      name: 'infiniteHeight',
+      label: 'Infinite Height',
+      required: true,
+      columnWidth: 150,
+      type: 'bool'
     }
   ]
 }