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;
}, [currentTenantId, tenantIdRef]);
const tagLookupById = useMemo(() => {
const map = new Map();
tags.forEach((tag) => {
if (tag?.id) {
map.set(tag.id, tag);
}
});
return map;
}, [tags]);
const tagLookupById = new Map();
tags.forEach((tag) => {
if (tag?.id) {
tagLookupById.set(tag.id, tag);
}
});
const tagsState = {
...tagsStateRaw,
@@ -106,17 +106,8 @@ const SelectionFolderMenu: React.FC<SelectionFolderMenuProps> = ({
return { nodeMap: nMap, parentMap: pMap };
}, [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;
// 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 displayedItems = useMemo(() => {
@@ -130,8 +121,10 @@ const SelectionFolderMenu: React.FC<SelectionFolderMenuProps> = ({
});
return results;
}
return currentChildren;
}, [isSearching, query, currentChildren, nodeMap]);
return currentFolderId
? (nodeMap.get(currentFolderId)?.children || [])
: folderTree;
}, [isSearching, query, currentFolderId, nodeMap, folderTree]);
const handleTriggerClick = useCallback(() => {
if (disabled) {
@@ -1,4 +1,3 @@
import { useMemo } from 'react';
import type { WorkspaceSelectionValue } from '../../app/WorkspaceSelectionContext';
import type { Identifier } from '../../types/identifiers';
@@ -115,107 +114,57 @@ const useDocumentsPanelProps = (props: UseDocumentsPanelPropsArgs) => {
selectionValue,
} = props;
return useMemo(
() => ({
currentFolderName,
breadcrumbs,
onRefresh: refreshCurrentFolder,
subfolders: currentSubfolders,
documents,
searchQuery,
searchResultIds,
selectedFolder,
onFolderSelect: selectFolder,
onFolderDrop: folderClickHandlers.onDrop,
onFolderDragOver: folderClickHandlers.onDragOver,
onFolderDragLeave: folderClickHandlers.onDragLeave,
onFolderDragStart: handleFolderDragStart,
onFolderDragEnd: handleFolderDragEnd,
draggedFolderId,
onFolderRename: handleFolderRename,
onDocumentRename: handleDocumentTitleUpdate,
focusedRowKey,
draggingDocumentIds: draggedDocumentIds,
onDocumentDragStart: handleDocumentDragStart,
onDocumentDragEnd: handleDocumentDragEnd,
isSearchLoading: searchLoading,
tagLookupById,
activeTagFilters,
activeCorrespondentFilters,
activeCorrespondentIds: activeCorrespondentFilters,
ensureAssetUrl,
getDocumentAsset,
onDocumentTagAttach: handleDocumentTagAttach,
onDocumentTagDetach: handleDocumentTagDetach,
viewMode: documentsViewMode,
sortField: documentsSortField,
sortDirection: documentsSortDirection,
onSortFieldChange: handleDocumentsSortFieldChange,
onSortDirectionToggle: handleDocumentsSortDirectionToggle,
onViewModeChange: handleDocumentsViewModeChange,
onDeleteSelection: handleDeleteSelection,
onEntryPointer: handleEntryPointerCore,
tags,
correspondents,
documentLookup,
onBulkTagAdd: handleBulkTagAddFromDetail,
onBulkTagRemove: handleBulkTagRemoveFromDetail,
onBulkCorrespondentAdd: handleBulkCorrespondentAdd,
onBulkCorrespondentRemove: handleBulkCorrespondentRemove,
onBulkReanalyze: handleBulkSelectionReanalyze,
folderOptions,
onMoveDocumentsToFolder: moveDocumentsToFolder,
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,
],
);
return {
currentFolderName,
breadcrumbs,
onRefresh: refreshCurrentFolder,
subfolders: currentSubfolders,
documents,
searchQuery,
searchResultIds,
selectedFolder,
onFolderSelect: selectFolder,
onFolderDrop: folderClickHandlers.onDrop,
onFolderDragOver: folderClickHandlers.onDragOver,
onFolderDragLeave: folderClickHandlers.onDragLeave,
onFolderDragStart: handleFolderDragStart,
onFolderDragEnd: handleFolderDragEnd,
draggedFolderId,
onFolderRename: handleFolderRename,
onDocumentRename: handleDocumentTitleUpdate,
focusedRowKey,
draggingDocumentIds: draggedDocumentIds,
onDocumentDragStart: handleDocumentDragStart,
onDocumentDragEnd: handleDocumentDragEnd,
isSearchLoading: searchLoading,
tagLookupById,
activeTagFilters,
activeCorrespondentFilters,
activeCorrespondentIds: activeCorrespondentFilters,
ensureAssetUrl,
getDocumentAsset,
onDocumentTagAttach: handleDocumentTagAttach,
onDocumentTagDetach: handleDocumentTagDetach,
viewMode: documentsViewMode,
sortField: documentsSortField,
sortDirection: documentsSortDirection,
onSortFieldChange: handleDocumentsSortFieldChange,
onSortDirectionToggle: handleDocumentsSortDirectionToggle,
onViewModeChange: handleDocumentsViewModeChange,
onDeleteSelection: handleDeleteSelection,
onEntryPointer: handleEntryPointerCore,
tags,
correspondents,
documentLookup,
onBulkTagAdd: handleBulkTagAddFromDetail,
onBulkTagRemove: handleBulkTagRemoveFromDetail,
onBulkCorrespondentAdd: handleBulkCorrespondentAdd,
onBulkCorrespondentRemove: handleBulkCorrespondentRemove,
onBulkReanalyze: handleBulkSelectionReanalyze,
folderOptions,
onMoveDocumentsToFolder: moveDocumentsToFolder,
selectionValue,
};
};
export default useDocumentsPanelProps;
+20 -42
View File
@@ -178,48 +178,26 @@ const useDetailWorkspace = ({
closeDetailPanel();
}, [closeDetailPanel]);
const detailPanelProps = useMemo(
() => ({
document: detailPanelDocument,
tags,
tagLookupById,
onTagAdd: handleDocumentTagAdd,
onTagRemove: handleDocumentTagDetach,
onOpenPreview: openDocumentPreview,
activePreviewId,
onUpdateTitle: handleDocumentTitleUpdate,
onUpdateIssued: handleDocumentIssuedUpdate,
ensureAssetUrl,
getDocumentAsset: getAsset,
correspondents,
onCorrespondentAdd: handleCorrespondentAdd,
onCorrespondentRemove: handleCorrespondentRemove,
onFolderNavigate: selectFolder,
onClose: handleDetailPanelClose,
resolveFolderPath,
folderNodes,
}),
[
activePreviewId,
correspondents,
detailPanelDocument,
ensureAssetUrl,
getAsset,
handleCorrespondentAdd,
handleCorrespondentRemove,
handleDetailPanelClose,
handleDocumentTagAdd,
handleDocumentIssuedUpdate,
handleDocumentTitleUpdate,
handleDocumentTagDetach,
folderNodes,
openDocumentPreview,
resolveFolderPath,
selectFolder,
tags,
tagLookupById,
],
);
const detailPanelProps = {
document: detailPanelDocument,
tags,
tagLookupById,
onTagAdd: handleDocumentTagAdd,
onTagRemove: handleDocumentTagDetach,
onOpenPreview: openDocumentPreview,
activePreviewId,
onUpdateTitle: handleDocumentTitleUpdate,
onUpdateIssued: handleDocumentIssuedUpdate,
ensureAssetUrl,
getDocumentAsset: getAsset,
correspondents,
onCorrespondentAdd: handleCorrespondentAdd,
onCorrespondentRemove: handleCorrespondentRemove,
onFolderNavigate: selectFolder,
onClose: handleDetailPanelClose,
resolveFolderPath,
folderNodes,
};
return {
detailPanelProps,