|
33 | 33 | * prior parent + index, then tagged `metadata.suggestion = pending-remove`. |
34 | 34 | * - New blocks → tagged `metadata.suggestion = pending-insert` (the block |
35 | 35 | * stays in the tree; the marker drives the dimmed visual treatment). |
36 | | - * - Move detection ships in a follow-up. |
| 36 | + * - Moved blocks → tagged `metadata.suggestion = pending-move` with the |
| 37 | + * pre-move parent + anchor; an LCS-based heuristic isolates the moved |
| 38 | + * block from siblings whose index just shifted as a side-effect. |
37 | 39 | * |
38 | 40 | * In every case the live block carries the marker and a corresponding |
39 | 41 | * structural op is written to the overlay so auto-save persists it. |
@@ -432,6 +434,171 @@ function topLevelRemoved( removedIds, parentByClientId ) { |
432 | 434 | } ); |
433 | 435 | } |
434 | 436 |
|
| 437 | +/** |
| 438 | + * Length of the longest common subsequence of two arrays of clientIds (the |
| 439 | + * elements of the result appear in the same relative order in both inputs). |
| 440 | + * Used by the move-detection heuristic: blocks NOT in the LCS of their |
| 441 | + * parent's old vs new sibling order are the ones that actually moved; |
| 442 | + * blocks in the LCS just had their index shift as a side-effect. |
| 443 | + * |
| 444 | + * @param {string[]} a First array. |
| 445 | + * @param {string[]} b Second array. |
| 446 | + * @return {Set<string>} The LCS as a set for O(1) membership checks. |
| 447 | + */ |
| 448 | +function lcsClientIds( a, b ) { |
| 449 | + const m = a.length; |
| 450 | + const n = b.length; |
| 451 | + if ( m === 0 || n === 0 ) { |
| 452 | + return new Set(); |
| 453 | + } |
| 454 | + const dp = Array.from( { length: m + 1 }, () => |
| 455 | + new Array( n + 1 ).fill( 0 ) |
| 456 | + ); |
| 457 | + for ( let i = 1; i <= m; i++ ) { |
| 458 | + for ( let j = 1; j <= n; j++ ) { |
| 459 | + dp[ i ][ j ] = |
| 460 | + a[ i - 1 ] === b[ j - 1 ] |
| 461 | + ? dp[ i - 1 ][ j - 1 ] + 1 |
| 462 | + : Math.max( dp[ i - 1 ][ j ], dp[ i ][ j - 1 ] ); |
| 463 | + } |
| 464 | + } |
| 465 | + const result = new Set(); |
| 466 | + let i = m; |
| 467 | + let j = n; |
| 468 | + while ( i > 0 && j > 0 ) { |
| 469 | + if ( a[ i - 1 ] === b[ j - 1 ] ) { |
| 470 | + result.add( a[ i - 1 ] ); |
| 471 | + i--; |
| 472 | + j--; |
| 473 | + } else if ( dp[ i - 1 ][ j ] > dp[ i ][ j - 1 ] ) { |
| 474 | + i--; |
| 475 | + } else { |
| 476 | + j--; |
| 477 | + } |
| 478 | + } |
| 479 | + return result; |
| 480 | +} |
| 481 | + |
| 482 | +/** |
| 483 | + * Detect blocks that moved between two ticks of the live tree. A block has |
| 484 | + * "moved" when its parent changed (cross-parent move) or, within the same |
| 485 | + * parent, its position falls outside the LCS of the parent's old vs new |
| 486 | + * sibling order. The LCS heuristic prevents tagging blocks whose index |
| 487 | + * just shifted as a side-effect of another block moving past them. |
| 488 | + * |
| 489 | + * Blocks that are new (not in the previous-tick tree) or removed (in the |
| 490 | + * previous-tick tree but not live) are handled by the insertion / removal |
| 491 | + * branches; this function ignores both. |
| 492 | + * |
| 493 | + * @param {string[]} liveClientIds Live tree client ids. |
| 494 | + * @param {Object} tree Previous-tick tree snapshot from |
| 495 | + * `captureTreeSnapshot`. |
| 496 | + * @param {Object} blockEditor Block-editor selectors. |
| 497 | + * @return {Array<Object>} One entry per moved block, with from/to anchors. |
| 498 | + */ |
| 499 | +function detectMovedBlocks( liveClientIds, tree, blockEditor ) { |
| 500 | + const movedRaw = []; |
| 501 | + |
| 502 | + const candidatesByNewParent = new Map(); |
| 503 | + for ( const clientId of liveClientIds ) { |
| 504 | + if ( ! tree.parentByClientId.has( clientId ) ) { |
| 505 | + continue; // new block — handled elsewhere |
| 506 | + } |
| 507 | + const oldParent = tree.parentByClientId.get( clientId ); |
| 508 | + const newParent = |
| 509 | + blockEditor.getBlockRootClientId?.( clientId ) || null; |
| 510 | + if ( oldParent !== newParent ) { |
| 511 | + movedRaw.push( { clientId, oldParent, newParent } ); |
| 512 | + continue; |
| 513 | + } |
| 514 | + if ( ! candidatesByNewParent.has( newParent ) ) { |
| 515 | + candidatesByNewParent.set( newParent, [] ); |
| 516 | + } |
| 517 | + candidatesByNewParent.get( newParent ).push( clientId ); |
| 518 | + } |
| 519 | + |
| 520 | + for ( const [ parent, candidates ] of candidatesByNewParent ) { |
| 521 | + const oldSiblings = candidates |
| 522 | + .slice() |
| 523 | + .sort( |
| 524 | + ( a, b ) => |
| 525 | + ( tree.indexByClientId.get( a ) ?? 0 ) - |
| 526 | + ( tree.indexByClientId.get( b ) ?? 0 ) |
| 527 | + ); |
| 528 | + const newSiblingOrder = |
| 529 | + blockEditor.getBlockOrder?.( parent ?? undefined ) ?? []; |
| 530 | + const newSiblings = candidates |
| 531 | + .slice() |
| 532 | + .sort( |
| 533 | + ( a, b ) => |
| 534 | + newSiblingOrder.indexOf( a ) - newSiblingOrder.indexOf( b ) |
| 535 | + ); |
| 536 | + const samePosition = |
| 537 | + oldSiblings.length === newSiblings.length && |
| 538 | + oldSiblings.every( ( id, i ) => id === newSiblings[ i ] ); |
| 539 | + if ( samePosition ) { |
| 540 | + continue; |
| 541 | + } |
| 542 | + const stable = lcsClientIds( oldSiblings, newSiblings ); |
| 543 | + for ( const clientId of newSiblings ) { |
| 544 | + if ( ! stable.has( clientId ) ) { |
| 545 | + movedRaw.push( { |
| 546 | + clientId, |
| 547 | + oldParent: parent, |
| 548 | + newParent: parent, |
| 549 | + } ); |
| 550 | + } |
| 551 | + } |
| 552 | + } |
| 553 | + |
| 554 | + if ( movedRaw.length === 0 ) { |
| 555 | + return []; |
| 556 | + } |
| 557 | + |
| 558 | + // Reconstruct the previous-tick sibling order per parent so we can |
| 559 | + // compute fromAnchorClientId. Building this lazily keeps the no-move |
| 560 | + // path zero-cost. |
| 561 | + const oldOrderByParent = new Map(); |
| 562 | + const oldOrderFor = ( oldParent ) => { |
| 563 | + if ( oldOrderByParent.has( oldParent ) ) { |
| 564 | + return oldOrderByParent.get( oldParent ); |
| 565 | + } |
| 566 | + const ids = []; |
| 567 | + for ( const [ id, parent ] of tree.parentByClientId ) { |
| 568 | + if ( parent === oldParent ) { |
| 569 | + ids.push( id ); |
| 570 | + } |
| 571 | + } |
| 572 | + ids.sort( |
| 573 | + ( a, b ) => |
| 574 | + ( tree.indexByClientId.get( a ) ?? 0 ) - |
| 575 | + ( tree.indexByClientId.get( b ) ?? 0 ) |
| 576 | + ); |
| 577 | + oldOrderByParent.set( oldParent, ids ); |
| 578 | + return ids; |
| 579 | + }; |
| 580 | + |
| 581 | + return movedRaw.map( ( { clientId, oldParent, newParent } ) => { |
| 582 | + const oldIndex = tree.indexByClientId.get( clientId ) ?? 0; |
| 583 | + const oldSiblingOrder = oldOrderFor( oldParent ); |
| 584 | + const fromAnchorClientId = |
| 585 | + oldIndex > 0 ? oldSiblingOrder[ oldIndex - 1 ] : null; |
| 586 | + const newSiblingOrder = |
| 587 | + blockEditor.getBlockOrder?.( newParent ?? undefined ) ?? []; |
| 588 | + const newIndex = newSiblingOrder.indexOf( clientId ); |
| 589 | + const toAnchorClientId = |
| 590 | + newIndex > 0 ? newSiblingOrder[ newIndex - 1 ] : null; |
| 591 | + return { |
| 592 | + clientId, |
| 593 | + fromParentClientId: oldParent, |
| 594 | + fromAnchorClientId, |
| 595 | + fromIndex: oldIndex, |
| 596 | + toParentClientId: newParent, |
| 597 | + toAnchorClientId, |
| 598 | + }; |
| 599 | + } ); |
| 600 | +} |
| 601 | + |
435 | 602 | /** |
436 | 603 | * Invisible component that catches block-attribute mutations dispatched |
437 | 604 | * directly to the block-editor store while the editor is in Suggest intent. |
@@ -685,6 +852,49 @@ export default function SuggestionStoreInterceptor() { |
685 | 852 | // block; do NOT update it to `current` here. |
686 | 853 | } |
687 | 854 |
|
| 855 | + // Detect blocks that moved (different parent or out-of-place |
| 856 | + // within the same parent). The block stays at its new |
| 857 | + // position; tag it with `metadata.suggestion = pending-move` |
| 858 | + // and capture the from/to anchors for the structural op. |
| 859 | + // Apply leaves the block where it is; Reject dispatches |
| 860 | + // `moveBlockToPosition` with the from-position. |
| 861 | + const moves = detectMovedBlocks( liveClientIds, tree, blockEditor ); |
| 862 | + for ( const move of moves ) { |
| 863 | + const currentAttrs = blockEditor.getBlockAttributes?.( |
| 864 | + move.clientId |
| 865 | + ); |
| 866 | + if ( ! currentAttrs ) { |
| 867 | + continue; |
| 868 | + } |
| 869 | + const block = blockEditor.getBlock?.( move.clientId ); |
| 870 | + if ( ! block ) { |
| 871 | + continue; |
| 872 | + } |
| 873 | + isReverting = true; |
| 874 | + try { |
| 875 | + blockEditorDispatch.updateBlockAttributes( move.clientId, { |
| 876 | + metadata: withSuggestionMarker( currentAttrs.metadata, { |
| 877 | + type: 'pending-move', |
| 878 | + fromAnchorClientId: move.fromAnchorClientId, |
| 879 | + fromParentClientId: move.fromParentClientId, |
| 880 | + fromIndex: move.fromIndex, |
| 881 | + } ), |
| 882 | + } ); |
| 883 | + } finally { |
| 884 | + isReverting = false; |
| 885 | + } |
| 886 | + setStructuralOpRef.current?.( move.clientId, block.name, { |
| 887 | + type: 'block-move', |
| 888 | + clientId: move.clientId, |
| 889 | + blockName: block.name, |
| 890 | + fromAnchorClientId: move.fromAnchorClientId, |
| 891 | + fromParentClientId: move.fromParentClientId, |
| 892 | + fromIndex: move.fromIndex, |
| 893 | + toAnchorClientId: move.toAnchorClientId, |
| 894 | + toParentClientId: move.toParentClientId, |
| 895 | + } ); |
| 896 | + } |
| 897 | + |
688 | 898 | // Detect blocks that disappeared from the live tree and route |
689 | 899 | // them through the Suggest-mode "apply-and-tag" flow: re-insert |
690 | 900 | // the subtree from the previous-tick snapshot at its previous |
@@ -838,4 +1048,6 @@ export { |
838 | 1048 | captureTreeSnapshot, |
839 | 1049 | topLevelRemoved, |
840 | 1050 | withSuggestionMarker, |
| 1051 | + lcsClientIds, |
| 1052 | + detectMovedBlocks, |
841 | 1053 | }; |
0 commit comments