Compare commits

..

4 Commits

Author SHA1 Message Date
8d0f92af45 Add partSku field to GCodeFile model for enhanced object filtering
All checks were successful
farmcontrol/farmcontrol-ui/pipeline/head This commit looks good
- Introduced a new 'partSku' field in the GCodeFile model, which is required and supports object type filtering.
- Implemented a masterFilter function to facilitate filtering based on the associated part ID, improving data management and retrieval.
2026-07-26 21:21:25 +01:00
580e5dbb34 Update ObjectSelect component to adjust styling for improved layout
- Modified the style of the main container in ObjectSelect to include a relative position, enhancing the layout and positioning of child elements.
2026-07-26 21:21:18 +01:00
5c5083c615 Update loading indicator in ObjectChildTable to use a fragment for improved rendering 2026-07-26 21:21:12 +01:00
5e19b6c9b0 Refactor AlertsDisplay component to accept dynamic object and type props
- Updated AlertsDisplay to receive an object and its type instead of specific alerts and printerId, enhancing reusability for different object types.
- Modified ControlPrinter and ObjectProperty components to pass the new props structure, ensuring consistent alert handling across various contexts.
2026-07-26 21:11:15 +01:00
6 changed files with 90 additions and 38 deletions

View File

@ -278,8 +278,8 @@ const ControlPrinter = ({ slicerIntegration = false }) => {
</Flex>
<AlertsDisplay
alerts={objectFormState.objectData?.alerts}
printerId={printerId}
object={objectFormState.objectData}
objectType='printer'
/>
<ScrollBox>

View File

@ -1,27 +1,36 @@
import PropTypes from 'prop-types'
import { createElement } from 'react'
import { createElement, useContext } from 'react'
import { Flex, Alert, Button, Dropdown } from 'antd'
import ExclamationOctagonIcon from '../../Icons/ExclamationOctagonIcon'
import InfoCircleIcon from '../../Icons/InfoCircleIcon'
import { CaretDownOutlined } from '@ant-design/icons'
import XMarkIcon from '../../Icons/XMarkIcon'
import { getModelByName } from '../../../database/ObjectModels'
import { useNavigate } from 'react-router-dom'
import ActionsIcon from '../../Icons/ActionsIcon'
import { ApiServerContext } from '../context/ApiServerContext'
const AlertsDisplay = ({
alerts = [],
printerId,
object,
objectType,
showDismiss = true,
showActions = true
}) => {
const alerts = object?.alerts ?? []
const objectId = object?._id
const getAlertType = (type, priority) => {
if (type === 'error' || priority === '9') return 'error'
if (type === 'warning' || priority === '8') return 'warning'
return 'info'
}
const printerModel = getModelByName('printer')
const model = objectType ? getModelByName(objectType) : null
const navigate = useNavigate()
const { updateObject } = useContext(ApiServerContext)
const handleDismissAlert = (alertId) => {
const updatedAlerts = alerts.filter((a) => a._id !== alertId)
updateObject(objectId, objectType, { alerts: updatedAlerts })
}
const getAlertIcon = (type, priority) => {
if (type === 'error' || priority === '9') return <ExclamationOctagonIcon />
if (type === 'warning' || priority === '8')
@ -103,7 +112,7 @@ const AlertsDisplay = ({
}
const alertElements = alerts.map((alert, index) => {
const printerActions = printerModel?.actions || []
const objectActions = model?.actions || []
const alertActionKeys = Array.isArray(alert?.actions)
? alert.actions
@ -116,7 +125,7 @@ const AlertsDisplay = ({
: []
const allowedKeys = new Set(alertActionKeys)
const filteredActions = filterActionsByKeys(printerActions, allowedKeys)
const filteredActions = filterActionsByKeys(objectActions, allowedKeys)
const findActionByKey = (actions, key) => {
if (!Array.isArray(actions)) return null
@ -144,7 +153,7 @@ const AlertsDisplay = ({
const action = findActionByKey(filteredActions, key)
if (action?.url) {
navigate(action.url(printerId))
navigate(action.url(objectId))
} else {
console.warn('No action found for key:', key)
}
@ -155,20 +164,46 @@ const AlertsDisplay = ({
<Alert
key={`${alert.createdAt}-${index}-${alert._id}`}
message={alert.message}
style={{ padding: '4px 10px 4px 8px' }}
style={{ padding: '4px 5px 4px 10px', minHeight: '35px' }}
type={getAlertType(alert.type, alert.priority)}
icon={getAlertIcon(alert.type, alert.priority)}
showIcon
closable={showDismiss && alert.canDismiss}
closable={false}
onClose={() => {}}
action={
showActions ? (
<Flex gap='1px'>
{showActions && filteredActions.length >= 0 && (
<Dropdown menu={menu} on>
<Button size='small' type='text' style={{ marginLeft: '5px' }}>
<CaretDownOutlined />
</Button>
<Button
size='small'
type='text'
style={{ marginLeft: '5px' }}
icon={
<ActionsIcon
style={{ fontSize: '12px', marginBottom: '3.5px' }}
/>
}
/>
</Dropdown>
) : null
)}
{showDismiss && alert.canDismiss && (
<Button
size='small'
type='text'
style={{ marginLeft: '5px' }}
onClick={() => handleDismissAlert(alert._id)}
icon={
<XMarkIcon
style={{
fontSize: '10px',
marginBottom: '5px',
marginLeft: '0.5px'
}}
/>
}
/>
)}
</Flex>
}
/>
)
@ -182,20 +217,24 @@ const AlertsDisplay = ({
}
AlertsDisplay.propTypes = {
printerId: PropTypes.string.isRequired,
showActions: PropTypes.bool.isRequired,
showDismiss: PropTypes.bool.isRequired,
object: PropTypes.shape({
_id: PropTypes.string.isRequired,
alerts: PropTypes.arrayOf(
PropTypes.shape({
canDismiss: PropTypes.bool.isRequired,
_id: PropTypes.string.isRequired,
code: PropTypes.string,
type: PropTypes.string.isRequired,
createdAt: PropTypes.string.isRequired,
updatedAt: PropTypes.string.isRequired,
message: PropTypes.string,
actions: PropTypes.arrayOf(PropTypes.string)
})
).isRequired
)
}).isRequired,
objectType: PropTypes.string.isRequired,
showActions: PropTypes.bool,
showDismiss: PropTypes.bool
}
export default AlertsDisplay

View File

@ -538,7 +538,7 @@ const ObjectChildTable = ({
dataSource={rollupDataSource}
showHeader={false}
columns={rollupColumns}
loading={{ spinning: loading, indicator: null }}
loading={{ spinning: loading, indicator: <></> }}
pagination={false}
size={size}
rowKey={resolvedRowKey}

View File

@ -553,8 +553,8 @@ const ObjectProperty = ({
if (value != null && value?.length != 0) {
return (
<AlertsDisplay
alerts={value}
printerId={objectData._id}
object={objectData}
objectType={objectType}
showDismiss={false}
showActions={false}
/>

View File

@ -720,7 +720,7 @@ const ObjectSelect = ({
// --- Main TreeSelect UI ---
return (
<div style={style}>
<div style={{ ...style, position: 'relative' }}>
<TreeSelect
key={treeVersion}
treeDataSimpleMode={false}

View File

@ -288,6 +288,19 @@ export const GCodeFile = {
required: true,
showHyperlink: true
},
{
name: 'partSku',
label: 'Part SKU',
type: 'object',
objectType: 'partSku',
required: true,
showHyperlink: true,
masterFilter: (objectData) => {
const partId = objectData?.part?._id
if (partId == null) return {}
return { part: partId }
}
},
{
name: 'quantity',
label: 'Quantity',