Refactor EditObjectForm to ObjectForm
This commit is contained in:
parent
be2109505f
commit
eba1a87664
@ -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
|
||||
|
||||
@ -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>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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'
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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
|
||||
Loading…
x
Reference in New Issue
Block a user