Refactor EditObjectForm to ObjectForm

This commit is contained in:
Tom Butcher 2025-08-30 23:42:05 +01:00
parent be2109505f
commit eba1a87664
16 changed files with 50 additions and 50 deletions

View File

@ -2,7 +2,7 @@ import { useRef, useState } from 'react'
import { useLocation } from 'react-router-dom'
import { Space, Flex, Card } from 'antd'
import useCollapseState from '../../hooks/useCollapseState'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import ObjectInfo from '../../common/ObjectInfo'
import ObjectTable from '../../common/ObjectTable'
import ObjectActions from '../../common/ObjectActions'
@ -123,7 +123,7 @@ const FilamentStockInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={filamentStockId}
type='filamentStock'
style={{ height: '100%' }}
@ -140,7 +140,7 @@ const FilamentStockInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -11,7 +11,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -37,7 +37,7 @@ const DocumentPrinterInfo = () => {
)
return (
<EditObjectForm
<ObjectForm
id={documentPrinterId}
type='documentPrinter'
style={{ height: '100%' }}
@ -193,7 +193,7 @@ const DocumentPrinterInfo = () => {
</ActionHandler>
)
}}
</EditObjectForm>
</ObjectForm>
)
}

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -126,7 +126,7 @@ const DocumentSizeInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={documentSizeId}
type='documentSize'
style={{ height: '100%' }}
@ -144,7 +144,7 @@ const DocumentSizeInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -8,7 +8,7 @@ import NotesPanel from '../../common/NotesPanel.jsx'
import InfoCollapse from '../../common/InfoCollapse.jsx'
import ViewButton from '../../common/ViewButton.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -128,7 +128,7 @@ const DocumentTemplateDesign = () => {
loading={editFormState.loading}
ref={actionHandlerRef}
>
<EditObjectForm
<ObjectForm
id={documentTemplateId}
type='documentTemplate'
style={{ height: '100%' }}
@ -149,7 +149,7 @@ const DocumentTemplateDesign = () => {
/>
)
}}
</EditObjectForm>
</ObjectForm>
</ActionHandler>
<InfoCollapse
title='Notes'

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -132,7 +132,7 @@ const DocumentTemplateInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={documentTemplateId}
type='documentTemplate'
style={{ height: '100%' }}
@ -157,7 +157,7 @@ const DocumentTemplateInfo = () => {
/>
)
}}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler'
@ -132,7 +132,7 @@ const FilamentInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={filamentId}
type='filament'
style={{ height: '100%' }}
@ -152,7 +152,7 @@ const FilamentInfo = () => {
/>
)
}}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -133,7 +133,7 @@ const HostInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={hostId}
type='host'
style={{ height: '100%' }}
@ -154,7 +154,7 @@ const HostInfo = () => {
/>
)
}}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>

View File

@ -8,7 +8,7 @@ import ObjectInfo from '../../common/ObjectInfo'
import ViewButton from '../../common/ViewButton'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -115,7 +115,7 @@ const NoteTypeInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={noteTypeId}
type='noteType'
style={{ height: '100%' }}
@ -133,7 +133,7 @@ const NoteTypeInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -6,7 +6,7 @@ import NotesPanel from '../../common/NotesPanel'
import InfoCollapse from '../../common/InfoCollapse'
import ObjectInfo from '../../common/ObjectInfo'
import ViewButton from '../../common/ViewButton'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
@ -125,7 +125,7 @@ const PartInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={partId}
type='part'
style={{ height: '100%' }}
@ -142,7 +142,7 @@ const PartInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -6,7 +6,7 @@ import NotesPanel from '../../common/NotesPanel'
import InfoCollapse from '../../common/InfoCollapse'
import ObjectInfo from '../../common/ObjectInfo'
import ViewButton from '../../common/ViewButton'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
@ -118,7 +118,7 @@ const ProductInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={productId}
type='product'
style={{ height: '100%' }}
@ -135,7 +135,7 @@ const ProductInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -10,7 +10,7 @@ import ViewButton from '../../common/ViewButton'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler'
@ -116,7 +116,7 @@ const UserInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={userId}
type='user'
style={{ height: '100%' }}
@ -134,7 +134,7 @@ const UserInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -11,7 +11,7 @@ import ViewButton from '../../common/ViewButton'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm'
import ObjectForm from '../../common/ObjectForm'
import EditButtons from '../../common/EditButtons'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -124,7 +124,7 @@ const VendorInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={vendorId}
type='vendor'
style={{ height: '100%' }}
@ -141,7 +141,7 @@ const VendorInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>
<InfoCollapse

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -127,7 +127,7 @@ const GCodeFileInfo = () => {
loading={editFormState.loading}
ref={actionHandlerRef}
>
<EditObjectForm
<ObjectForm
id={gcodeFileId}
type='gcodeFile'
style={{ height: '100%' }}
@ -182,7 +182,7 @@ const GCodeFileInfo = () => {
</Flex>
)
}}
</EditObjectForm>
</ObjectForm>
</ActionHandler>
<InfoCollapse

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -129,7 +129,7 @@ const JobInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={jobId}
type='job'
style={{ height: '100%' }}
@ -147,7 +147,7 @@ const JobInfo = () => {
objectData={objectData}
/>
)}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>

View File

@ -12,7 +12,7 @@ import ViewButton from '../../common/ViewButton.jsx'
import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import EditObjectForm from '../../common/EditObjectForm.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
import LockIndicator from '../../common/LockIndicator.jsx'
import ActionHandler from '../../common/ActionHandler.jsx'
@ -128,7 +128,7 @@ const PrinterInfo = () => {
onToggle={(expanded) => updateCollapseState('info', expanded)}
collapseKey='info'
>
<EditObjectForm
<ObjectForm
id={printerId}
type='printer'
style={{ height: '100%' }}
@ -149,7 +149,7 @@ const PrinterInfo = () => {
/>
)
}}
</EditObjectForm>
</ObjectForm>
</InfoCollapse>
</ActionHandler>

View File

@ -14,7 +14,7 @@ import DeleteObjectModal from './DeleteObjectModal'
import merge from 'lodash/merge'
/**
* EditObjectForm is a reusable form component for editing any object type.
* ObjectForm is a reusable form component for editing any object type.
* It handles fetching, updating, locking, unlocking, and validation logic.
*
* Props:
@ -25,7 +25,7 @@ import merge from 'lodash/merge'
* loading, isEditing, startEditing, cancelEditing, handleUpdate, form, formValid, objectData, setIsEditing, setObjectData
* }) => ReactNode
*/
const EditObjectForm = forwardRef(
const ObjectForm = forwardRef(
({ id, type, style, children, onEdit, onStateChange }, ref) => {
const [objectData, setObjectData] = useState(null)
const [serverObjectData, setServerObjectData] = useState(null)
@ -272,9 +272,9 @@ const EditObjectForm = forwardRef(
}
)
EditObjectForm.displayName = 'EditObjectForm'
ObjectForm.displayName = 'ObjectForm'
EditObjectForm.propTypes = {
ObjectForm.propTypes = {
id: PropTypes.string.isRequired,
type: PropTypes.string.isRequired,
children: PropTypes.func.isRequired,
@ -283,4 +283,4 @@ EditObjectForm.propTypes = {
onStateChange: PropTypes.func
}
export default EditObjectForm
export default ObjectForm