Refactor ObjectTable and ObjectListViewContext for Simplified Filter Management
- Removed unnecessary state management for masterFilter and masterSort in ObjectTable, streamlining filter handling. - Updated ObjectListViewContext to simplify view state restoration logic, enhancing clarity and maintainability. - Adjusted references to masterFilter throughout ObjectTable to ensure consistent filter application.
This commit is contained in:
parent
73de7ac8ee
commit
b6834fecc6
@ -323,11 +323,6 @@ const ObjectTable = forwardRef(
|
|||||||
activeObjectViewRef.current = activeObjectView
|
activeObjectViewRef.current = activeObjectView
|
||||||
const onObjectViewFilterSortChangeRef = useRef(onObjectViewFilterSortChange)
|
const onObjectViewFilterSortChangeRef = useRef(onObjectViewFilterSortChange)
|
||||||
onObjectViewFilterSortChangeRef.current = onObjectViewFilterSortChange
|
onObjectViewFilterSortChangeRef.current = onObjectViewFilterSortChange
|
||||||
const listViewMastersRef = useRef({ masterFilter: {}, masterSort: {} })
|
|
||||||
const [listViewMasters, setListViewMastersState] = useState({
|
|
||||||
masterFilter: {},
|
|
||||||
masterSort: {}
|
|
||||||
})
|
|
||||||
const [sidebarFilter, setSidebarFilter] = useState({})
|
const [sidebarFilter, setSidebarFilter] = useState({})
|
||||||
const [tableSorter, setTableSorter] = useState({})
|
const [tableSorter, setTableSorter] = useState({})
|
||||||
const [initialized, setInitialized] = useState(false)
|
const [initialized, setInitialized] = useState(false)
|
||||||
@ -380,30 +375,12 @@ const ObjectTable = forwardRef(
|
|||||||
)
|
)
|
||||||
const prevValuesRef = useRef({ type, masterFilter })
|
const prevValuesRef = useRef({ type, masterFilter })
|
||||||
|
|
||||||
const effectiveMasterFilter = useMemo(
|
const getMasterFilter = useCallback(() => masterFilter || {}, [masterFilter])
|
||||||
() => ({
|
|
||||||
...listViewMasters.masterFilter,
|
|
||||||
...masterFilter
|
|
||||||
}),
|
|
||||||
[listViewMasters.masterFilter, masterFilter]
|
|
||||||
)
|
|
||||||
|
|
||||||
const getEffectiveMasterFilter = useCallback(
|
|
||||||
() => ({
|
|
||||||
...listViewMastersRef.current.masterFilter,
|
|
||||||
...masterFilter
|
|
||||||
}),
|
|
||||||
[masterFilter]
|
|
||||||
)
|
|
||||||
|
|
||||||
const resolveSorter = useCallback((userSorter) => {
|
const resolveSorter = useCallback((userSorter) => {
|
||||||
if (userSorter?.field && userSorter?.order) {
|
if (userSorter?.field && userSorter?.order) {
|
||||||
return { field: userSorter.field, order: userSorter.order }
|
return { field: userSorter.field, order: userSorter.order }
|
||||||
}
|
}
|
||||||
const masterSort = listViewMastersRef.current.masterSort
|
|
||||||
if (masterSort?.field && masterSort?.order) {
|
|
||||||
return { field: masterSort.field, order: masterSort.order }
|
|
||||||
}
|
|
||||||
return {}
|
return {}
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
@ -546,14 +523,14 @@ const ObjectTable = forwardRef(
|
|||||||
return fetchObjects(type, {
|
return fetchObjects(type, {
|
||||||
page: pageNum,
|
page: pageNum,
|
||||||
limit: pageSize,
|
limit: pageSize,
|
||||||
filter: { ...getEffectiveMasterFilter(), ...filter },
|
filter: { ...getMasterFilter(), ...filter },
|
||||||
sorter: resolveSorter(sorter),
|
sorter: resolveSorter(sorter),
|
||||||
onDataChange
|
onDataChange
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[
|
[
|
||||||
type,
|
type,
|
||||||
getEffectiveMasterFilter,
|
getMasterFilter,
|
||||||
pageSize,
|
pageSize,
|
||||||
onDataChange,
|
onDataChange,
|
||||||
fetchObjects,
|
fetchObjects,
|
||||||
@ -916,15 +893,15 @@ const ObjectTable = forwardRef(
|
|||||||
Object.entries(sidebarFilter).forEach(([k, v]) => {
|
Object.entries(sidebarFilter).forEach(([k, v]) => {
|
||||||
if (v !== '' && v !== undefined) active[k] = v
|
if (v !== '' && v !== undefined) active[k] = v
|
||||||
})
|
})
|
||||||
return { ...effectiveMasterFilter, ...active }
|
return { ...masterFilter, ...active }
|
||||||
}, [sidebarFilter, effectiveMasterFilter])
|
}, [sidebarFilter, masterFilter])
|
||||||
|
|
||||||
const tableFilterContextValue = useMemo(
|
const tableFilterContextValue = useMemo(
|
||||||
() => ({
|
() => ({
|
||||||
filter: getActiveFilterValues(sidebarFilter),
|
filter: getActiveFilterValues(sidebarFilter),
|
||||||
masterFilter: effectiveMasterFilter
|
masterFilter
|
||||||
}),
|
}),
|
||||||
[sidebarFilter, effectiveMasterFilter]
|
[sidebarFilter, masterFilter]
|
||||||
)
|
)
|
||||||
|
|
||||||
newEventHandlerRef.current = newEventHandler
|
newEventHandlerRef.current = newEventHandler
|
||||||
@ -1111,20 +1088,6 @@ const ObjectTable = forwardRef(
|
|||||||
resolveSorter
|
resolveSorter
|
||||||
])
|
])
|
||||||
|
|
||||||
const setListViewMasters = useCallback(
|
|
||||||
({ masterFilter: nextMasterFilter = {}, masterSort: nextMasterSort = {} }) => {
|
|
||||||
listViewMastersRef.current = {
|
|
||||||
masterFilter: nextMasterFilter,
|
|
||||||
masterSort: nextMasterSort
|
|
||||||
}
|
|
||||||
setListViewMastersState({
|
|
||||||
masterFilter: nextMasterFilter,
|
|
||||||
masterSort: nextMasterSort
|
|
||||||
})
|
|
||||||
},
|
|
||||||
[]
|
|
||||||
)
|
|
||||||
|
|
||||||
const applyViewState = useCallback(
|
const applyViewState = useCallback(
|
||||||
(filterState, sorterState) => {
|
(filterState, sorterState) => {
|
||||||
if (filterState == null && sorterState == null) {
|
if (filterState == null && sorterState == null) {
|
||||||
@ -1170,7 +1133,6 @@ const ObjectTable = forwardRef(
|
|||||||
useImperativeHandle(ref, () => ({
|
useImperativeHandle(ref, () => ({
|
||||||
reload,
|
reload,
|
||||||
applyViewState,
|
applyViewState,
|
||||||
setListViewMasters,
|
|
||||||
setData: (newData) => {
|
setData: (newData) => {
|
||||||
setPages([{ pageNum: 1, items: newData }])
|
setPages([{ pageNum: 1, items: newData }])
|
||||||
},
|
},
|
||||||
@ -1246,7 +1208,7 @@ const ObjectTable = forwardRef(
|
|||||||
propertyLabel={propertyLabel}
|
propertyLabel={propertyLabel}
|
||||||
modelType={type}
|
modelType={type}
|
||||||
filter={sidebarFilter}
|
filter={sidebarFilter}
|
||||||
masterFilter={effectiveMasterFilter}
|
masterFilter={masterFilter}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
|
|
||||||
@ -1440,7 +1402,7 @@ const ObjectTable = forwardRef(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isFilterable && !Object.keys(effectiveMasterFilter).includes(prop.name)) {
|
if (isFilterable && !Object.keys(masterFilter).includes(prop.name)) {
|
||||||
columnConfig.filterDropdown = ({
|
columnConfig.filterDropdown = ({
|
||||||
setSelectedKeys,
|
setSelectedKeys,
|
||||||
selectedKeys,
|
selectedKeys,
|
||||||
@ -1719,7 +1681,7 @@ const ObjectTable = forwardRef(
|
|||||||
type={type}
|
type={type}
|
||||||
filter={sidebarFilter}
|
filter={sidebarFilter}
|
||||||
onFilterChange={handleSidebarFilterChange}
|
onFilterChange={handleSidebarFilterChange}
|
||||||
masterFilter={effectiveMasterFilter}
|
masterFilter={masterFilter}
|
||||||
/>
|
/>
|
||||||
</Flex>
|
</Flex>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -140,23 +140,16 @@ export const ObjectListViewProvider = ({
|
|||||||
|
|
||||||
if (tabKey !== ALL_TAB_KEY && !view) return
|
if (tabKey !== ALL_TAB_KEY && !view) return
|
||||||
|
|
||||||
if (editing) {
|
// "All" outside edit mode restores the user's persisted filter/sort
|
||||||
tableRef.current.setListViewMasters?.({
|
if (tabKey === ALL_TAB_KEY && !editing) {
|
||||||
masterFilter: {},
|
tableRef.current.applyViewState(null, null)
|
||||||
masterSort: {}
|
|
||||||
})
|
|
||||||
tableRef.current.applyViewState(
|
|
||||||
view?.filter || {},
|
|
||||||
view?.sort?.field ? view.sort : {}
|
|
||||||
)
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
tableRef.current.setListViewMasters?.({
|
tableRef.current.applyViewState(
|
||||||
masterFilter: view?.filter || {},
|
view?.filter || {},
|
||||||
masterSort: view?.sort?.field ? view.sort : {}
|
view?.sort?.field ? view.sort : {}
|
||||||
})
|
)
|
||||||
tableRef.current.applyViewState(null, null)
|
|
||||||
},
|
},
|
||||||
[tableRef]
|
[tableRef]
|
||||||
)
|
)
|
||||||
@ -698,16 +691,6 @@ export const ObjectListViewProvider = ({
|
|||||||
|
|
||||||
const lastSyncedViewKeyRef = useRef(null)
|
const lastSyncedViewKeyRef = useRef(null)
|
||||||
|
|
||||||
const masterFilter = useMemo(() => {
|
|
||||||
if (isEditing || !activeView) return {}
|
|
||||||
return activeView.filter || {}
|
|
||||||
}, [activeView, isEditing])
|
|
||||||
|
|
||||||
const masterSort = useMemo(() => {
|
|
||||||
if (isEditing || !activeView?.sort?.field) return {}
|
|
||||||
return activeView.sort
|
|
||||||
}, [activeView, isEditing])
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const viewKey = isEditing
|
const viewKey = isEditing
|
||||||
? `edit:${activeView?._id ?? activeTabKey}`
|
? `edit:${activeView?._id ?? activeTabKey}`
|
||||||
@ -722,8 +705,6 @@ export const ObjectListViewProvider = ({
|
|||||||
|
|
||||||
onViewStateChange?.({
|
onViewStateChange?.({
|
||||||
activeView: isEditing ? activeViewRef.current : null,
|
activeView: isEditing ? activeViewRef.current : null,
|
||||||
masterFilter,
|
|
||||||
masterSort,
|
|
||||||
isEditing,
|
isEditing,
|
||||||
handleFilterSortChange: isEditing
|
handleFilterSortChange: isEditing
|
||||||
? stableFilterSortHandlerRef.current
|
? stableFilterSortHandlerRef.current
|
||||||
@ -733,8 +714,6 @@ export const ObjectListViewProvider = ({
|
|||||||
activeTabKey,
|
activeTabKey,
|
||||||
activeView?._id,
|
activeView?._id,
|
||||||
isEditing,
|
isEditing,
|
||||||
masterFilter,
|
|
||||||
masterSort,
|
|
||||||
onViewStateChange
|
onViewStateChange
|
||||||
])
|
])
|
||||||
|
|
||||||
@ -750,8 +729,6 @@ export const ObjectListViewProvider = ({
|
|||||||
views: displayedViews,
|
views: displayedViews,
|
||||||
activeView,
|
activeView,
|
||||||
activeTabKey,
|
activeTabKey,
|
||||||
masterFilter,
|
|
||||||
masterSort,
|
|
||||||
initialLoading,
|
initialLoading,
|
||||||
saving,
|
saving,
|
||||||
isEditing,
|
isEditing,
|
||||||
@ -773,8 +750,6 @@ export const ObjectListViewProvider = ({
|
|||||||
displayedViews,
|
displayedViews,
|
||||||
activeView,
|
activeView,
|
||||||
activeTabKey,
|
activeTabKey,
|
||||||
masterFilter,
|
|
||||||
masterSort,
|
|
||||||
initialLoading,
|
initialLoading,
|
||||||
saving,
|
saving,
|
||||||
isEditing,
|
isEditing,
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user