Refactoring

src/components/Dashboard/Inventory/FilamentStocks/FilamentStockInfo.jsx

@@ -113,7 +113,7 @@ const FilamentStockInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -130,7 +130,7 @@ const FilamentStockInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('events', expanded)
                       }
-                      key='events'
+                      collapseKey='events'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />
@@ -150,10 +150,13 @@ const FilamentStockInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={filamentStockId} />
+                        <NotesPanel
+                          _id={filamentStockId}
+                          type='filamentStock'
+                        />
                       </Card>
                     </InfoCollapse>
 
@@ -164,7 +167,7 @@ const FilamentStockInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/Filaments/FilamentInfo.jsx

@@ -133,7 +133,7 @@ const FilamentInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -151,7 +151,7 @@ const FilamentInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('stocks', expanded)
                       }
-                      key='stocks'
+                      collapseKey='stocks'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />
@@ -175,10 +175,10 @@ const FilamentInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={filamentId} />
+                        <NotesPanel _id={filamentId} type='filament' />
                       </Card>
                     </InfoCollapse>
 
@@ -189,7 +189,7 @@ const FilamentInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/NoteTypes.jsx

@@ -1,6 +1,5 @@
-import React, { useState, useContext, useRef } from 'react'
+import React, { useState, useRef } from 'react'
 import { Button, Flex, Space, Modal, Dropdown, message } from 'antd'
-import { AuthContext } from '../context/AuthContext'
 import NewNoteType from './NoteTypes/NewNoteType'
 import ObjectTable from '../common/ObjectTable'
 import PlusIcon from '../../Icons/PlusIcon'
@@ -15,7 +14,7 @@ const NoteTypes = () => {
   const [messageApi, contextHolder] = message.useMessage()
   const [newNoteTypeOpen, setNewNoteTypeOpen] = useState(false)
   const tableRef = useRef()
-  const { authenticated } = useContext(AuthContext)
+
   const [viewMode, setViewMode] = useViewMode('noteType')
 
   const [columnVisibility, setColumnVisibility] =
@@ -73,7 +72,6 @@ const NoteTypes = () => {
           ref={tableRef}
           visibleColumns={columnVisibility}
           type='noteType'
-          authenticated={authenticated}
           cards={viewMode === 'cards'}
         />
       </Flex>

src/components/Dashboard/Management/NoteTypes/NoteTypeInfo.jsx

@@ -122,7 +122,7 @@ const NoteTypeInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -140,7 +140,7 @@ const NoteTypeInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/Parts/PartInfo.jsx

@@ -131,7 +131,7 @@ const PartInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -148,10 +148,10 @@ const PartInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={partId} />
+                        <NotesPanel _id={partId} type='part' />
                       </Card>
                     </InfoCollapse>
 
@@ -162,7 +162,7 @@ const PartInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/Products.jsx

@@ -1,6 +1,6 @@
 // src/gcodefiles.js
 
-import React, { useState, useContext, useRef } from 'react'
+import React, { useState, useRef } from 'react'
 import { useNavigate } from 'react-router-dom'
 import {
   Button,
@@ -15,8 +15,6 @@ import {
   Input
 } from 'antd'
 import { DownloadOutlined } from '@ant-design/icons'
-
-import { AuthContext } from '../context/AuthContext'
 import IdDisplay from '../common/IdDisplay'
 import TimeDisplay from '../common/TimeDisplay'
 import ObjectTable from '../common/ObjectTable'
@@ -37,7 +35,7 @@ const Products = () => {
   const navigate = useNavigate()
   const [newProductOpen, setNewProductOpen] = useState(false)
   const tableRef = useRef()
-  const { authenticated } = useContext(AuthContext)
+
   const [viewMode, setViewMode] = useViewMode('Products')
 
   const getProductActionItems = (id) => {
@@ -350,7 +348,6 @@ const Products = () => {
         <ObjectTable
           ref={tableRef}
           type={'product'}
-          authenticated={authenticated}
           cards={viewMode === 'cards'}
         />
       </Flex>

src/components/Dashboard/Management/Products/ProductInfo.jsx

@@ -123,7 +123,7 @@ const ProductInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -140,7 +140,7 @@ const ProductInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('parts', expanded)
                       }
-                      key='parts'
+                      collapseKey='parts'
                     >
                       <ObjectTable
                         type='part'
@@ -159,10 +159,10 @@ const ProductInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={productId} />
+                        <NotesPanel _id={productId} type='product' />
                       </Card>
                     </InfoCollapse>
 
@@ -173,7 +173,7 @@ const ProductInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/Users.jsx

@@ -1,6 +1,5 @@
-import React, { useContext, useRef } from 'react'
+import React, { useRef } from 'react'
 import { Button, Flex, Space, Dropdown } from 'antd'
-import { AuthContext } from '../context/AuthContext'
 import ObjectTable from '../common/ObjectTable'
 import ReloadIcon from '../../Icons/ReloadIcon'
 import useColumnVisibility from '../hooks/useColumnVisibility'
@@ -11,7 +10,7 @@ import ColumnViewButton from '../common/ColumnViewButton'
 
 const Users = () => {
   const tableRef = useRef()
-  const { authenticated } = useContext(AuthContext)
+
   const [viewMode, setViewMode] = useViewMode('user')
 
   const [columnVisibility, setColumnVisibility] = useColumnVisibility('user')
@@ -56,7 +55,6 @@ const Users = () => {
         ref={tableRef}
         type={'user'}
         visibleColumns={columnVisibility}
-        authenticated={authenticated}
         cards={viewMode === 'cards'}
       />
     </Flex>

src/components/Dashboard/Management/Users/UserInfo.jsx

@@ -123,7 +123,7 @@ const UserInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -141,10 +141,10 @@ const UserInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={userId} />
+                        <NotesPanel _id={userId} type='user' />
                       </Card>
                     </InfoCollapse>
 
@@ -155,7 +155,7 @@ const UserInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Management/Vendors.jsx

@@ -1,6 +1,5 @@
-import React, { useState, useContext, useRef } from 'react'
+import React, { useState, useRef } from 'react'
 import { Button, Flex, Space, Modal, Dropdown, message } from 'antd'
-import { AuthContext } from '../context/AuthContext'
 import NewVendor from './Vendors/NewVendor'
 import ObjectTable from '../common/ObjectTable'
 import PlusIcon from '../../Icons/PlusIcon'
@@ -15,7 +14,7 @@ const Vendors = () => {
   const [messageApi, contextHolder] = message.useMessage()
   const [newVendorOpen, setNewVendorOpen] = useState(false)
   const tableRef = useRef()
-  const { authenticated } = useContext(AuthContext)
+
   const [viewMode, setViewMode] = useViewMode('vendor')
 
   const [columnVisibility, setColumnVisibility] = useColumnVisibility('vendor')
@@ -72,7 +71,6 @@ const Vendors = () => {
           ref={tableRef}
           visibleColumns={columnVisibility}
           type='vendor'
-          authenticated={authenticated}
           cards={viewMode === 'cards'}
         />
       </Flex>

src/components/Dashboard/Production/GCodeFiles/GCodeFileInfo.jsx

@@ -144,7 +144,7 @@ const GCodeFileInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -162,7 +162,7 @@ const GCodeFileInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('preview', expanded)
                       }
-                      key='preview'
+                      collapseKey='preview'
                     >
                       <Card>
                         {objectData?.gcodeFileInfo?.thumbnail ? (
@@ -184,10 +184,10 @@ const GCodeFileInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={gcodeFileId} />
+                        <NotesPanel _id={gcodeFileId} type='gcodeFile' />
                       </Card>
                     </InfoCollapse>
 
@@ -198,7 +198,7 @@ const GCodeFileInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Production/Jobs.jsx

@@ -1,9 +1,7 @@
 // src/Jobs.js
 
-import React, { useState, useContext, useRef } from 'react'
+import React, { useState, useRef } from 'react'
 import { Button, Flex, Space, Modal, Dropdown, message } from 'antd'
-
-import { AuthContext } from '../context/AuthContext.js'
 import NewJob from './Jobs/NewJob.jsx'
 import useColumnVisibility from '../hooks/useColumnVisibility.js'
 import PlusIcon from '../../Icons/PlusIcon.jsx'
@@ -19,7 +17,6 @@ const Jobs = () => {
   const [newJobOpen, setNewJobOpen] = useState(false)
   const tableRef = useRef()
   const [viewMode, setViewMode] = useViewMode('job')
-  const { authenticated } = useContext(AuthContext)
 
   const [columnVisibility, setColumnVisibility] = useColumnVisibility('job')
 
@@ -81,7 +78,6 @@ const Jobs = () => {
           ref={tableRef}
           type={'job'}
           visibleColumns={columnVisibility}
-          authenticated={authenticated}
           cards={viewMode === 'cards'}
         />
       </Flex>

src/components/Dashboard/Production/Jobs/JobInfo.jsx

@@ -1,4 +1,4 @@
-import React, { useContext } from 'react'
+import React from 'react'
 import { useLocation } from 'react-router-dom'
 import { Space, Flex, Card } from 'antd'
 import { LoadingOutlined } from '@ant-design/icons'
@@ -17,14 +17,12 @@ import JobIcon from '../../../Icons/JobIcon'
 import AuditLogIcon from '../../../Icons/AuditLogIcon'
 import NoteIcon from '../../../Icons/NoteIcon'
 import ObjectActions from '../../common/ObjectActions.jsx'
-import { ApiServerContext } from '../../context/ApiServerContext'
 import ObjectTable from '../../common/ObjectTable.jsx'
 import InfoCollapsePlaceholder from '../../common/InfoCollapsePlaceholder.jsx'
 
 const JobInfo = () => {
   const location = useLocation()
   const jobId = new URLSearchParams(location.search).get('jobId')
-  const { fetchObjectContent } = useContext(ApiServerContext)
   const [collapseState, updateCollapseState] = useCollapseState('JobInfo', {
     info: true,
     subJobs: true,
@@ -41,9 +39,6 @@ const JobInfo = () => {
       {({
         loading,
         isEditing,
-        startEditing,
-        cancelEditing,
-        handleUpdate,
         formValid,
         objectData,
         editLoading,
@@ -55,28 +50,6 @@ const JobInfo = () => {
           reload: () => {
             fetchObject()
             return true
-          },
-          edit: () => {
-            startEditing()
-            return false
-          },
-          cancelEdit: () => {
-            cancelEditing()
-            return true
-          },
-          finishEdit: () => {
-            handleUpdate()
-            return true
-          },
-          download: () => {
-            if (jobId) {
-              fetchObjectContent(
-                jobId,
-                'job',
-                `${objectData.name || 'job'}.json`
-              )
-              return true
-            }
           }
         }
 
@@ -135,7 +108,7 @@ const JobInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -153,7 +126,7 @@ const JobInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('subJobs', expanded)
                       }
-                      key='subJobs'
+                      collapseKey='subJobs'
                     >
                       <SubJobsTree jobData={objectData} loading={loading} />
                     </InfoCollapse>
@@ -165,10 +138,10 @@ const JobInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={jobId} />
+                        <NotesPanel _id={jobId} type='job' />
                       </Card>
                     </InfoCollapse>
 
@@ -179,7 +152,7 @@ const JobInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogs', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Production/Printers/PrinterInfo.jsx

@@ -135,7 +135,7 @@ const PrinterInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('info', expanded)
                       }
-                      key='info'
+                      collapseKey='info'
                     >
                       <ObjectInfo
                         loading={loading}
@@ -153,7 +153,7 @@ const PrinterInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('jobs', expanded)
                       }
-                      key='jobs'
+                      collapseKey='jobs'
                     >
                       <PrinterJobsTree
                         subJobs={objectData?.subJobs}
@@ -168,10 +168,10 @@ const PrinterInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('notes', expanded)
                       }
-                      key='notes'
+                      collapseKey='notes'
                     >
                       <Card>
-                        <NotesPanel _id={printerId} />
+                        <NotesPanel _id={printerId} type='printer' />
                       </Card>
                     </InfoCollapse>
 
@@ -182,7 +182,7 @@ const PrinterInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogsParent', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />
@@ -201,7 +201,7 @@ const PrinterInfo = () => {
                       onToggle={(expanded) =>
                         updateCollapseState('auditLogsOwner', expanded)
                       }
-                      key='auditLogs'
+                      collapseKey='auditLogs'
                     >
                       {loading ? (
                         <InfoCollapsePlaceholder />

src/components/Dashboard/Production/SubJobs.jsx

@@ -1,9 +1,7 @@
 // src/SubJobs.js
 
-import React, { useContext, useRef } from 'react'
+import React, { useRef } from 'react'
 import { Button, Flex, Space, Dropdown } from 'antd'
-
-import { AuthContext } from '../context/AuthContext.js'
 import useColumnVisibility from '../hooks/useColumnVisibility.js'
 import ReloadIcon from '../../Icons/ReloadIcon.jsx'
 import ObjectTable from '../common/ObjectTable.jsx'
@@ -15,7 +13,6 @@ import ColumnViewButton from '../common/ColumnViewButton.jsx'
 const SubJobs = () => {
   const tableRef = useRef()
   const [viewMode, setViewMode] = useViewMode('subJob')
-  const { authenticated } = useContext(AuthContext)
 
   const [columnVisibility, setColumnVisibility] = useColumnVisibility('subJob')
 
@@ -64,7 +61,6 @@ const SubJobs = () => {
           ref={tableRef}
           type={'subJob'}
           visibleColumns={columnVisibility}
-          authenticated={authenticated}
           cards={viewMode === 'cards'}
         />
       </Flex>