Compare commits

...

2 Commits

Author SHA1 Message Date
2d32c55456 Add filter and sort persistence to multiple dashboard components
Some checks failed
farmcontrol/farmcontrol-ui/pipeline/head There was a failure building this commit
- Enhanced various components across the Dashboard, including Invoices, Payments, TaxRecords, and Inventory items, by adding props to save and use filters and sorting in both session and URL.
- This update improves user experience by maintaining state across sessions and enhancing data handling consistency throughout the application.
2026-08-01 14:10:16 +01:00
ddd48660e0 Refactor Filament and Printer Profiles components to streamline state management and remove unused context
- Removed unnecessary useContext for ApiServerContext in both FilamentProfiles and PrinterProfiles components.
- Simplified modal state handling by consolidating profile modal logic into a single state variable for new profiles.
- Cleaned up the handleRowAction function in both components, focusing on new profile creation and removing delete functionality for improved clarity.
2026-08-01 14:09:16 +01:00
43 changed files with 359 additions and 76 deletions

View File

@ -81,6 +81,14 @@ const Invoices = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const Payments = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const TaxRecords = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -87,6 +87,14 @@ const FilamentStocks = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const OrderItems = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -87,6 +87,14 @@ const PartStocks = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -88,6 +88,14 @@ const ProductStocks = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const PurchaseOrders = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const Shipments = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -87,6 +87,14 @@ const StockAudits = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -70,6 +70,14 @@ const StockEvents = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
</>

View File

@ -85,6 +85,14 @@ const StockLocations = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -85,6 +85,14 @@ const StockTransfers = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const AppPasswords = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
<Modal

View File

@ -63,6 +63,14 @@ const AuditLogs = () => {
type='auditLog'
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
</>

View File

@ -81,6 +81,14 @@ const CourierServices = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -80,6 +80,14 @@ const Couriers = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const DocumentJobs = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -80,6 +80,14 @@ const DocumentPrinters = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -79,6 +79,14 @@ const DocumentSizes = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const DocumentTemplates = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -85,6 +85,14 @@ const FilamentSkus = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -87,6 +87,14 @@ const Filaments = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
<Modal

View File

@ -69,6 +69,14 @@ const Files = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
</>

View File

@ -86,6 +86,14 @@ const Hosts = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
<Modal

View File

@ -84,6 +84,14 @@ const Materials = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
<Modal

View File

@ -81,6 +81,14 @@ const NoteTypes = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -84,6 +84,14 @@ const PartSkus = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -86,6 +86,14 @@ const Parts = (filter) => {
filter={filter}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -84,6 +84,14 @@ const ProductCategories = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
<Modal

View File

@ -85,6 +85,14 @@ const ProductSkus = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -356,6 +356,14 @@ const Products = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -80,6 +80,14 @@ const TaxRates = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -80,6 +80,14 @@ const Vendors = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -1,14 +1,11 @@
import { useContext, useRef, useState } from 'react'
import { useRef, useState } from 'react'
import { Button, Dropdown, Flex, Modal, Space } from 'antd'
import NewFilamentProfile, {
EditFilamentProfile
} from './FilamentProfiles/NewFilamentProfile'
import NewFilamentProfile from './FilamentProfiles/NewFilamentProfile'
import ColumnViewButton from '../common/ColumnViewButton'
import ExportListButton from '../common/ExportListButton'
import FilterSidebarButton from '../common/FilterSidebarButton'
import ObjectTable from '../common/ObjectTable'
import ObjectTableViewButton from '../common/ObjectTableViewButton'
import { ApiServerContext } from '../context/ApiServerContext'
import PlusIcon from '../../Icons/PlusIcon'
import ReloadIcon from '../../Icons/ReloadIcon'
import useColumnVisibility from '../hooks/useColumnVisibility'
@ -16,11 +13,7 @@ import useFilterSidebarVisibility from '../hooks/useFilterSidebarVisibility'
import useViewMode from '../hooks/useViewMode'
const FilamentProfiles = () => {
const { deleteObject } = useContext(ApiServerContext)
const [profileModal, setProfileModal] = useState({
open: false,
profileId: null
})
const [newProfileOpen, setNewProfileOpen] = useState(false)
const tableRef = useRef()
const [viewMode, setViewMode] = useViewMode('FilamentProfiles')
const [columnVisibility, setColumnVisibility] =
@ -46,34 +39,11 @@ const FilamentProfiles = () => {
if (key === 'reloadList') {
tableRef.current?.reload()
} else if (key === 'newFilamentProfile') {
setProfileModal({ open: true, profileId: null })
setNewProfileOpen(true)
}
}
}
const handleRowAction = (action, profile) => {
if (action.name === 'edit') {
setProfileModal({ open: true, profileId: profile._id })
return true
}
if (action.name === 'delete') {
Modal.confirm({
title: 'Delete filament profile?',
content: `This will permanently delete ${profile.name || profile._reference}.`,
okText: 'Delete',
okType: 'danger',
onOk: async () => {
await deleteObject(profile._id, 'filamentProfile')
await tableRef.current?.reload()
}
})
return true
}
return false
}
return (
<>
<Flex vertical={'true'} gap='large' className='h-100'>
@ -108,34 +78,32 @@ const FilamentProfiles = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
onRowAction={handleRowAction}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal
open={profileModal.open}
open={newProfileOpen}
footer={null}
width={800}
onCancel={() => setProfileModal({ open: false, profileId: null })}
onCancel={() => setNewProfileOpen(false)}
destroyOnHidden
>
{profileModal.open &&
(profileModal.profileId ? (
<EditFilamentProfile
profileId={profileModal.profileId}
onOk={() => {
setProfileModal({ open: false, profileId: null })
tableRef.current?.reload()
}}
/>
) : (
<NewFilamentProfile
onOk={() => {
setProfileModal({ open: false, profileId: null })
tableRef.current?.reload()
}}
/>
))}
{newProfileOpen && (
<NewFilamentProfile
onOk={() => {
setNewProfileOpen(false)
tableRef.current?.reload()
}}
/>
)}
</Modal>
</>
)

View File

@ -83,6 +83,14 @@ const GCodeFiles = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -87,6 +87,14 @@ const Jobs = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -1,4 +1,4 @@
import { useContext, useRef, useState } from 'react'
import { useRef, useState } from 'react'
import { Button, Dropdown, Flex, Modal, Space } from 'antd'
import NewPrinterProfile from './PrinterProfiles/NewPrinterProfile'
import ColumnViewButton from '../common/ColumnViewButton'
@ -6,14 +6,12 @@ import ExportListButton from '../common/ExportListButton'
import FilterSidebarButton from '../common/FilterSidebarButton'
import ObjectTable from '../common/ObjectTable'
import ObjectTableViewButton from '../common/ObjectTableViewButton'
import { ApiServerContext } from '../context/ApiServerContext'
import PlusIcon from '../../Icons/PlusIcon'
import ReloadIcon from '../../Icons/ReloadIcon'
import useColumnVisibility from '../hooks/useColumnVisibility'
import useFilterSidebarVisibility from '../hooks/useFilterSidebarVisibility'
import useViewMode from '../hooks/useViewMode'
const PrinterProfiles = () => {
const { deleteObject } = useContext(ApiServerContext)
const [newProfileOpen, setNewProfileOpen] = useState(false)
const tableRef = useRef()
const [viewMode, setViewMode] = useViewMode('PrinterProfiles')
@ -45,24 +43,6 @@ const PrinterProfiles = () => {
}
}
const handleRowAction = (action, profile) => {
if (action.name === 'delete') {
Modal.confirm({
title: 'Delete printer profile?',
content: `This will permanently delete ${profile.name || profile._reference}.`,
okText: 'Delete',
okType: 'danger',
onOk: async () => {
await deleteObject(profile._id, 'printerProfile')
await tableRef.current?.reload()
}
})
return true
}
return false
}
return (
<>
<Flex vertical={'true'} gap='large' className='h-100'>
@ -97,7 +77,14 @@ const PrinterProfiles = () => {
visibleColumns={columnVisibility}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
onRowAction={handleRowAction}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>

View File

@ -72,6 +72,14 @@ const SubJobs = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
</>

View File

@ -80,6 +80,14 @@ const Clients = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const Listings = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const Marketplaces = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal

View File

@ -81,6 +81,14 @@ const SalesOrders = () => {
cards={viewMode === 'cards'}
showFilterSidebar={showFilterSidebar}
expandHeight={true}
saveFilterInSession={true}
saveFilterInUrl={true}
useFilterInSession={true}
useFilterInUrl={true}
saveSortInSession={true}
saveSortInUrl={true}
useSortInSession={true}
useSortInUrl={true}
/>
</Flex>
<Modal