refactor: Consolidate tag drag/drop handlers into a single tagInteractions prop and streamline prop inheritance in DesktopWorkspace.
This commit is contained in:
@@ -118,20 +118,26 @@ type WorkspaceSnapshotState = {
|
|||||||
initialLoadDone: boolean;
|
initialLoadDone: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
import type { DocumentsViewProps } from '../documents/panel/DocumentsPanel';
|
export interface DeskTagInteractions {
|
||||||
|
handleTagDragEnterDoc: (...args: unknown[]) => void;
|
||||||
interface DesktopWorkspaceProps extends DocumentsViewProps {
|
handleTagDragOverDoc: (...args: unknown[]) => void;
|
||||||
// Override entries if needed, or rely on DocumentsViewProps
|
handleTagDragLeaveDoc: (...args: unknown[]) => void;
|
||||||
// entries: DocumentsListEntry[];
|
handleTagDropOnDoc: (...args: unknown[]) => void;
|
||||||
}
|
handleDocTagPointerDown: (...args: unknown[]) => void;
|
||||||
|
handleDocTagDragStart: (...args: unknown[]) => void;
|
||||||
interface DesktopWorkspaceViewProps {
|
handleDocTagDrag: (...args: unknown[]) => void;
|
||||||
engine: WorkspaceEngine;
|
handleDocTagDragEnd: (...args: unknown[]) => void;
|
||||||
items: DeskDocument[];
|
|
||||||
containerRef: React.RefObject<HTMLDivElement>;
|
|
||||||
handleCanvasDragOver: (event: React.DragEvent<HTMLDivElement>) => void;
|
handleCanvasDragOver: (event: React.DragEvent<HTMLDivElement>) => void;
|
||||||
handleCanvasDragLeave: (event: React.DragEvent<HTMLDivElement>) => void;
|
handleCanvasDragLeave: (event: React.DragEvent<HTMLDivElement>) => void;
|
||||||
handleCanvasDrop: (event: React.DragEvent<HTMLDivElement>) => void;
|
handleCanvasDrop: (event: React.DragEvent<HTMLDivElement>) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
import type { DocumentsViewProps } from '../documents/panel/DocumentsPanel';
|
||||||
|
|
||||||
|
interface DesktopWorkspaceViewProps extends Omit<DocumentsViewProps, 'entries' | 'activeTagFilters'> {
|
||||||
|
engine: WorkspaceEngine;
|
||||||
|
items: DeskDocument[];
|
||||||
|
containerRef: React.RefObject<HTMLDivElement>;
|
||||||
ensureDocumentSize: (doc: DeskDocument | null) => DocumentSizeInfo | null;
|
ensureDocumentSize: (doc: DeskDocument | null) => DocumentSizeInfo | null;
|
||||||
layoutSnapshot: Map<string, LayoutEntry>;
|
layoutSnapshot: Map<string, LayoutEntry>;
|
||||||
layoutRef: React.MutableRefObject<Map<string, LayoutEntry>>;
|
layoutRef: React.MutableRefObject<Map<string, LayoutEntry>>;
|
||||||
@@ -142,26 +148,14 @@ interface DesktopWorkspaceViewProps {
|
|||||||
tagDropTargetId: string | null;
|
tagDropTargetId: string | null;
|
||||||
pendingTagDocId: string | null;
|
pendingTagDocId: string | null;
|
||||||
pendingRemovalTag: unknown;
|
pendingRemovalTag: unknown;
|
||||||
ensureAssetUrl?: DesktopWorkspaceProps['ensureAssetUrl'];
|
|
||||||
getDocumentAsset?: DesktopWorkspaceProps['getDocumentAsset'];
|
|
||||||
handleNavigatorSnapshot: (docId: Identifier | null, snapshot: NavigatorSnapshot | null) => void;
|
handleNavigatorSnapshot: (docId: Identifier | null, snapshot: NavigatorSnapshot | null) => void;
|
||||||
activeTagSet: Set<string>;
|
activeTagSet: Set<string>;
|
||||||
handleTagDragEnterDoc: (...args: unknown[]) => void;
|
tagInteractions: DeskTagInteractions;
|
||||||
handleTagDragOverDoc: (...args: unknown[]) => void;
|
|
||||||
handleTagDragLeaveDoc: (...args: unknown[]) => void;
|
|
||||||
handleTagDropOnDoc: (...args: unknown[]) => void;
|
|
||||||
handleDocTagPointerDown: (...args: unknown[]) => void;
|
|
||||||
handleDocTagDragStart: (...args: unknown[]) => void;
|
|
||||||
handleDocTagDrag: (...args: unknown[]) => void;
|
|
||||||
handleDocTagDragEnd: (...args: unknown[]) => void;
|
|
||||||
overlayDisplay: OverlayDisplay | null;
|
overlayDisplay: OverlayDisplay | null;
|
||||||
closeOverlay: () => void;
|
closeOverlay: () => void;
|
||||||
overlayOriginRect: DOMRect | null;
|
overlayOriginRect: DOMRect | null;
|
||||||
overlayOriginTransform: OverlayOriginTransform | null;
|
overlayOriginTransform: OverlayOriginTransform | null;
|
||||||
overlayDocument: DeskDocument | null;
|
overlayDocument: DeskDocument | null;
|
||||||
onDocumentClick?: DesktopWorkspaceProps['onDocumentClick'];
|
|
||||||
onDocumentStackSelect?: (docIds: Identifier[], event?: PointerEvent | MouseEvent | null) => void;
|
|
||||||
onPromoteSelection?: (docId: Identifier | null) => void;
|
|
||||||
documentLookup: Map<string, DeskDocument>;
|
documentLookup: Map<string, DeskDocument>;
|
||||||
selectedDocumentIds: Identifier[];
|
selectedDocumentIds: Identifier[];
|
||||||
onClearSelection: () => void;
|
onClearSelection: () => void;
|
||||||
@@ -176,24 +170,22 @@ interface DesktopWorkspaceViewProps {
|
|||||||
openOverlayForDoc: (docId: Identifier | null, originInfo?: OverlayOriginHint | null) => void;
|
openOverlayForDoc: (docId: Identifier | null, originInfo?: OverlayOriginHint | null) => void;
|
||||||
recalcVisibleDocIds: () => void;
|
recalcVisibleDocIds: () => void;
|
||||||
dragSettings: DragSettings;
|
dragSettings: DragSettings;
|
||||||
onDocumentActivate?: DesktopWorkspaceProps['onDocumentActivate'];
|
|
||||||
markLayoutDirty: () => void;
|
markLayoutDirty: () => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
const defaultGetDocumentAsset: GetAsset = () => null;
|
const defaultGetDocumentAsset: GetAsset = () => null;
|
||||||
|
|
||||||
const DesktopWorkspace: React.FC<DesktopWorkspaceProps> = ({
|
const DesktopWorkspace: React.FC<DocumentsViewProps> = ({
|
||||||
entries = [],
|
entries = [],
|
||||||
onDocumentActivate = null,
|
|
||||||
onDocumentClick = null,
|
|
||||||
onDocumentTagDrop = null,
|
|
||||||
ensureAssetUrl = null,
|
|
||||||
getDocumentAsset = defaultGetDocumentAsset,
|
|
||||||
activeTagFilters = [],
|
activeTagFilters = [],
|
||||||
|
onDocumentTagDrop = null,
|
||||||
tenantId = null,
|
tenantId = null,
|
||||||
viewId = 'default',
|
viewId = 'default',
|
||||||
documentLinks,
|
documentLinks,
|
||||||
ensureDownloadUrl,
|
ensureDownloadUrl,
|
||||||
|
ensureAssetUrl = null,
|
||||||
|
getDocumentAsset = defaultGetDocumentAsset,
|
||||||
|
...passThroughProps
|
||||||
}) => {
|
}) => {
|
||||||
const {
|
const {
|
||||||
selectedDocumentIds,
|
selectedDocumentIds,
|
||||||
@@ -526,20 +518,6 @@ const DesktopWorkspace: React.FC<DesktopWorkspaceProps> = ({
|
|||||||
requestCanvasFocus,
|
requestCanvasFocus,
|
||||||
});
|
});
|
||||||
|
|
||||||
const {
|
|
||||||
handleTagDragEnterDoc,
|
|
||||||
handleTagDragOverDoc,
|
|
||||||
handleTagDragLeaveDoc,
|
|
||||||
handleTagDropOnDoc,
|
|
||||||
handleCanvasDragOver,
|
|
||||||
handleCanvasDragLeave,
|
|
||||||
handleCanvasDrop,
|
|
||||||
handleDocTagPointerDown,
|
|
||||||
handleDocTagDragStart,
|
|
||||||
handleDocTagDrag,
|
|
||||||
handleDocTagDragEnd,
|
|
||||||
} = tagInteractions;
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const current = docSizeMapRef.current;
|
const current = docSizeMapRef.current;
|
||||||
const next = new Map<string, DocumentSizeInfo>(current);
|
const next = new Map<string, DocumentSizeInfo>(current);
|
||||||
@@ -789,110 +767,45 @@ const DesktopWorkspace: React.FC<DesktopWorkspaceProps> = ({
|
|||||||
[],
|
[],
|
||||||
);
|
);
|
||||||
|
|
||||||
const viewProps = useMemo<DesktopWorkspaceViewProps>(
|
const viewProps: DesktopWorkspaceViewProps = {
|
||||||
() => ({
|
...passThroughProps,
|
||||||
engine,
|
engine,
|
||||||
items,
|
items,
|
||||||
containerRef,
|
containerRef,
|
||||||
handleCanvasDragOver,
|
ensureDocumentSize,
|
||||||
handleCanvasDragLeave,
|
layoutSnapshot,
|
||||||
handleCanvasDrop,
|
layoutRef,
|
||||||
ensureDocumentSize,
|
dragTransformsRef,
|
||||||
layoutSnapshot,
|
itemRefs,
|
||||||
layoutRef,
|
visibleDocIds,
|
||||||
dragTransformsRef,
|
draggingId,
|
||||||
itemRefs,
|
tagDropTargetId,
|
||||||
visibleDocIds,
|
pendingTagDocId,
|
||||||
draggingId,
|
pendingRemovalTag,
|
||||||
tagDropTargetId,
|
ensureAssetUrl,
|
||||||
pendingTagDocId,
|
getDocumentAsset,
|
||||||
pendingRemovalTag,
|
handleNavigatorSnapshot,
|
||||||
ensureAssetUrl,
|
activeTagSet,
|
||||||
getDocumentAsset,
|
tagInteractions,
|
||||||
handleNavigatorSnapshot,
|
overlayDisplay,
|
||||||
activeTagSet,
|
closeOverlay,
|
||||||
handleTagDragEnterDoc,
|
overlayOriginRect,
|
||||||
handleTagDragOverDoc,
|
overlayOriginTransform,
|
||||||
handleTagDragLeaveDoc,
|
overlayDocument,
|
||||||
handleTagDropOnDoc,
|
onDocumentStackSelect: handleStackSelect,
|
||||||
handleDocTagPointerDown,
|
onPromoteSelection: handlePromoteSelection,
|
||||||
handleDocTagDragStart,
|
selectedDocumentIds,
|
||||||
handleDocTagDrag,
|
onClearSelection: clearSelection,
|
||||||
handleDocTagDragEnd,
|
documentLookup,
|
||||||
overlayDisplay,
|
resolveBaseMetrics,
|
||||||
closeOverlay,
|
bringToFront,
|
||||||
overlayOriginRect,
|
setDraggingId,
|
||||||
overlayOriginTransform,
|
canvasSize,
|
||||||
overlayDocument,
|
openOverlayForDoc,
|
||||||
onDocumentClick,
|
recalcVisibleDocIds,
|
||||||
handleStackSelect,
|
dragSettings,
|
||||||
handlePromoteSelection,
|
markLayoutDirty,
|
||||||
onDocumentStackSelect: handleStackSelect,
|
};
|
||||||
onPromoteSelection: handlePromoteSelection,
|
|
||||||
selectedDocumentIds,
|
|
||||||
onClearSelection: clearSelection,
|
|
||||||
documentLookup,
|
|
||||||
resolveBaseMetrics,
|
|
||||||
bringToFront,
|
|
||||||
setDraggingId,
|
|
||||||
canvasSize,
|
|
||||||
openOverlayForDoc,
|
|
||||||
recalcVisibleDocIds,
|
|
||||||
dragSettings,
|
|
||||||
onDocumentActivate,
|
|
||||||
markLayoutDirty,
|
|
||||||
}),
|
|
||||||
[
|
|
||||||
activeTagSet,
|
|
||||||
bringToFront,
|
|
||||||
canvasSize,
|
|
||||||
closeOverlay,
|
|
||||||
containerRef,
|
|
||||||
draggingId,
|
|
||||||
dragSettings,
|
|
||||||
engine,
|
|
||||||
ensureAssetUrl,
|
|
||||||
ensureDocumentSize,
|
|
||||||
getDocumentAsset,
|
|
||||||
dragTransformsRef,
|
|
||||||
handleCanvasDragLeave,
|
|
||||||
handleCanvasDragOver,
|
|
||||||
handleCanvasDrop,
|
|
||||||
handleDocTagDrag,
|
|
||||||
handleDocTagDragEnd,
|
|
||||||
handleDocTagDragStart,
|
|
||||||
handleDocTagPointerDown,
|
|
||||||
handleNavigatorSnapshot,
|
|
||||||
handleTagDragEnterDoc,
|
|
||||||
handleTagDragLeaveDoc,
|
|
||||||
handleTagDragOverDoc,
|
|
||||||
handleTagDropOnDoc,
|
|
||||||
itemRefs,
|
|
||||||
items,
|
|
||||||
layoutRef,
|
|
||||||
layoutSnapshot,
|
|
||||||
onDocumentClick,
|
|
||||||
handleStackSelect,
|
|
||||||
handlePromoteSelection,
|
|
||||||
openOverlayForDoc,
|
|
||||||
overlayDisplay,
|
|
||||||
overlayOriginRect,
|
|
||||||
overlayOriginTransform,
|
|
||||||
overlayDocument,
|
|
||||||
documentLookup,
|
|
||||||
pendingRemovalTag,
|
|
||||||
pendingTagDocId,
|
|
||||||
recalcVisibleDocIds,
|
|
||||||
resolveBaseMetrics,
|
|
||||||
setDraggingId,
|
|
||||||
selectedDocumentIds,
|
|
||||||
clearSelection,
|
|
||||||
onDocumentActivate,
|
|
||||||
markLayoutDirty,
|
|
||||||
tagDropTargetId,
|
|
||||||
visibleDocIds,
|
|
||||||
],
|
|
||||||
);
|
|
||||||
return <DesktopWorkspaceView {...viewProps} />;
|
return <DesktopWorkspaceView {...viewProps} />;
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -900,12 +813,10 @@ function DesktopWorkspaceView({
|
|||||||
engine,
|
engine,
|
||||||
items,
|
items,
|
||||||
containerRef,
|
containerRef,
|
||||||
handleCanvasDragOver,
|
|
||||||
handleCanvasDragLeave,
|
|
||||||
handleCanvasDrop,
|
|
||||||
ensureDocumentSize,
|
ensureDocumentSize,
|
||||||
layoutSnapshot,
|
layoutSnapshot,
|
||||||
layoutRef,
|
layoutRef,
|
||||||
|
dragTransformsRef,
|
||||||
itemRefs,
|
itemRefs,
|
||||||
visibleDocIds,
|
visibleDocIds,
|
||||||
draggingId,
|
draggingId,
|
||||||
@@ -916,14 +827,7 @@ function DesktopWorkspaceView({
|
|||||||
getDocumentAsset,
|
getDocumentAsset,
|
||||||
handleNavigatorSnapshot,
|
handleNavigatorSnapshot,
|
||||||
activeTagSet,
|
activeTagSet,
|
||||||
handleTagDragEnterDoc,
|
tagInteractions,
|
||||||
handleTagDragOverDoc,
|
|
||||||
handleTagDragLeaveDoc,
|
|
||||||
handleTagDropOnDoc,
|
|
||||||
handleDocTagPointerDown,
|
|
||||||
handleDocTagDragStart,
|
|
||||||
handleDocTagDrag,
|
|
||||||
handleDocTagDragEnd,
|
|
||||||
overlayDisplay,
|
overlayDisplay,
|
||||||
closeOverlay,
|
closeOverlay,
|
||||||
overlayOriginRect,
|
overlayOriginRect,
|
||||||
@@ -944,7 +848,6 @@ function DesktopWorkspaceView({
|
|||||||
dragSettings,
|
dragSettings,
|
||||||
onDocumentActivate,
|
onDocumentActivate,
|
||||||
markLayoutDirty,
|
markLayoutDirty,
|
||||||
dragTransformsRef,
|
|
||||||
}: DesktopWorkspaceViewProps) {
|
}: DesktopWorkspaceViewProps) {
|
||||||
const handleDeskDocumentActivate = useCallback(
|
const handleDeskDocumentActivate = useCallback(
|
||||||
(docId: Identifier) => {
|
(docId: Identifier) => {
|
||||||
@@ -1036,9 +939,9 @@ function DesktopWorkspaceView({
|
|||||||
ref={containerRef}
|
ref={containerRef}
|
||||||
tabIndex={0}
|
tabIndex={0}
|
||||||
onKeyDown={handleShellKeyDown}
|
onKeyDown={handleShellKeyDown}
|
||||||
onDragOver={handleCanvasDragOver}
|
onDragOver={tagInteractions.handleCanvasDragOver}
|
||||||
onDragLeave={handleCanvasDragLeave}
|
onDragLeave={tagInteractions.handleCanvasDragLeave}
|
||||||
onDrop={handleCanvasDrop}
|
onDrop={tagInteractions.handleCanvasDrop}
|
||||||
onPointerDown={(event) => {
|
onPointerDown={(event) => {
|
||||||
if (event.target === event.currentTarget) {
|
if (event.target === event.currentTarget) {
|
||||||
onClearSelection();
|
onClearSelection();
|
||||||
@@ -1129,14 +1032,14 @@ function DesktopWorkspaceView({
|
|||||||
handleNavigatorSnapshot={handleNavigatorSnapshot}
|
handleNavigatorSnapshot={handleNavigatorSnapshot}
|
||||||
cardPointerHandlers={cardPointerHandlers}
|
cardPointerHandlers={cardPointerHandlers}
|
||||||
onDocumentActivate={onDocumentActivate}
|
onDocumentActivate={onDocumentActivate}
|
||||||
onTagDragEnter={handleTagDragEnterDoc}
|
onTagDragEnter={tagInteractions.handleTagDragEnterDoc}
|
||||||
onTagDragOver={handleTagDragOverDoc}
|
onTagDragOver={tagInteractions.handleTagDragOverDoc}
|
||||||
onTagDragLeave={handleTagDragLeaveDoc}
|
onTagDragLeave={tagInteractions.handleTagDragLeaveDoc}
|
||||||
onTagDrop={handleTagDropOnDoc}
|
onTagDrop={tagInteractions.handleTagDropOnDoc}
|
||||||
onDocTagPointerDown={handleDocTagPointerDown}
|
onDocTagPointerDown={tagInteractions.handleDocTagPointerDown}
|
||||||
onDocTagDragStart={handleDocTagDragStart}
|
onDocTagDragStart={tagInteractions.handleDocTagDragStart}
|
||||||
onDocTagDrag={handleDocTagDrag}
|
onDocTagDrag={tagInteractions.handleDocTagDrag}
|
||||||
onDocTagDragEnd={handleDocTagDragEnd}
|
onDocTagDragEnd={tagInteractions.handleDocTagDragEnd}
|
||||||
pendingRemovalTag={pendingRemovalTag}
|
pendingRemovalTag={pendingRemovalTag}
|
||||||
registerNode={registerNode}
|
registerNode={registerNode}
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in New Issue
Block a user