simplify frontend document and folder memoization.

This commit is contained in:
2025-12-09 02:03:46 +01:00
parent 1d127e2122
commit 24950e1a12
4 changed files with 81 additions and 164 deletions
@@ -458,15 +458,12 @@ const useDocumentsWorkspace = ({
tenantIdRef.current = currentTenantId; tenantIdRef.current = currentTenantId;
}, [currentTenantId, tenantIdRef]); }, [currentTenantId, tenantIdRef]);
const tagLookupById = useMemo(() => { const tagLookupById = new Map();
const map = new Map();
tags.forEach((tag) => { tags.forEach((tag) => {
if (tag?.id) { if (tag?.id) {
map.set(tag.id, tag); tagLookupById.set(tag.id, tag);
} }
}); });
return map;
}, [tags]);
const tagsState = { const tagsState = {
...tagsStateRaw, ...tagsStateRaw,
@@ -106,17 +106,8 @@ const SelectionFolderMenu: React.FC<SelectionFolderMenuProps> = ({
return { nodeMap: nMap, parentMap: pMap }; return { nodeMap: nMap, parentMap: pMap };
}, [folderTree]); }, [folderTree]);
const currentChildren = useMemo(() => {
const currentFolder = currentFolderId ? nodeMap.get(currentFolderId) : null;
return currentFolder ? currentFolder.children || [] : folderTree;
}, [currentFolderId, nodeMap, folderTree]);
const currentFolder = currentFolderId ? nodeMap.get(currentFolderId) : null; const currentFolder = currentFolderId ? nodeMap.get(currentFolderId) : null;
// Filter items based on search query
// If searching, we might want to show flattened results matching the query?
// Or just filter current level?
// Usually, search implies searching the whole tree.
const isSearching = query.trim().length > 0; const isSearching = query.trim().length > 0;
const displayedItems = useMemo(() => { const displayedItems = useMemo(() => {
@@ -130,8 +121,10 @@ const SelectionFolderMenu: React.FC<SelectionFolderMenuProps> = ({
}); });
return results; return results;
} }
return currentChildren; return currentFolderId
}, [isSearching, query, currentChildren, nodeMap]); ? (nodeMap.get(currentFolderId)?.children || [])
: folderTree;
}, [isSearching, query, currentFolderId, nodeMap, folderTree]);
const handleTriggerClick = useCallback(() => { const handleTriggerClick = useCallback(() => {
if (disabled) { if (disabled) {
@@ -1,4 +1,3 @@
import { useMemo } from 'react';
import type { WorkspaceSelectionValue } from '../../app/WorkspaceSelectionContext'; import type { WorkspaceSelectionValue } from '../../app/WorkspaceSelectionContext';
import type { Identifier } from '../../types/identifiers'; import type { Identifier } from '../../types/identifiers';
@@ -115,8 +114,7 @@ const useDocumentsPanelProps = (props: UseDocumentsPanelPropsArgs) => {
selectionValue, selectionValue,
} = props; } = props;
return useMemo( return {
() => ({
currentFolderName, currentFolderName,
breadcrumbs, breadcrumbs,
onRefresh: refreshCurrentFolder, onRefresh: refreshCurrentFolder,
@@ -166,56 +164,7 @@ const useDocumentsPanelProps = (props: UseDocumentsPanelPropsArgs) => {
folderOptions, folderOptions,
onMoveDocumentsToFolder: moveDocumentsToFolder, onMoveDocumentsToFolder: moveDocumentsToFolder,
selectionValue, selectionValue,
}), };
[
activeCorrespondentFilters,
breadcrumbs,
correspondents,
currentFolderName,
currentSubfolders,
documents,
documentsSortDirection,
documentsSortField,
documentsViewMode,
searchQuery,
documentLookup,
draggedDocumentIds,
draggedFolderId,
focusedRowKey,
folderClickHandlers,
handleBulkCorrespondentAdd,
handleBulkCorrespondentRemove,
handleBulkSelectionReanalyze,
handleBulkTagAddFromDetail,
handleBulkTagRemoveFromDetail,
handleDeleteSelection,
handleDocumentDragEnd,
handleDocumentDragStart,
handleDocumentTagAttach,
handleDocumentTagDetach,
handleDocumentTitleUpdate,
handleDocumentsSortDirectionToggle,
handleDocumentsSortFieldChange,
handleDocumentsViewModeChange,
handleEntryPointerCore,
handleFolderDragEnd,
handleFolderDragStart,
handleFolderRename,
moveDocumentsToFolder,
refreshCurrentFolder,
searchLoading,
searchResultIds,
selectedFolder,
selectFolder,
tagLookupById,
activeTagFilters,
tags,
ensureAssetUrl,
getDocumentAsset,
folderOptions,
selectionValue,
],
);
}; };
export default useDocumentsPanelProps; export default useDocumentsPanelProps;
@@ -178,8 +178,7 @@ const useDetailWorkspace = ({
closeDetailPanel(); closeDetailPanel();
}, [closeDetailPanel]); }, [closeDetailPanel]);
const detailPanelProps = useMemo( const detailPanelProps = {
() => ({
document: detailPanelDocument, document: detailPanelDocument,
tags, tags,
tagLookupById, tagLookupById,
@@ -198,28 +197,7 @@ const useDetailWorkspace = ({
onClose: handleDetailPanelClose, onClose: handleDetailPanelClose,
resolveFolderPath, resolveFolderPath,
folderNodes, folderNodes,
}), };
[
activePreviewId,
correspondents,
detailPanelDocument,
ensureAssetUrl,
getAsset,
handleCorrespondentAdd,
handleCorrespondentRemove,
handleDetailPanelClose,
handleDocumentTagAdd,
handleDocumentIssuedUpdate,
handleDocumentTitleUpdate,
handleDocumentTagDetach,
folderNodes,
openDocumentPreview,
resolveFolderPath,
selectFolder,
tags,
tagLookupById,
],
);
return { return {
detailPanelProps, detailPanelProps,