Avoid reloading data for whole tree from the server after draging and dropping

js/Plugin/jstree/hm.jstree.js

@@ -88,30 +88,18 @@
               const thisTree = data.instance;
               const movedNode = data.node;
               const parent = data.parent === '#' ? 0 : data.parent;
+              const parent_node = thisTree.get_node(data.parent);
               const old_parent = data.old_parent === '#' ? 0 : data.old_parent;
               const drupalMessages = new Drupal.Message();
 
               if (!rollback) {
-                let list = thisTree.get_node(data.parent).children;
-                let before = '';
-                let after = '';
-                if (data.position > 0) {
-                  before = list[data.position - 1];
-                }
-
-                if (data.position < list.length - 1) {
-                  after = list[data.position];
-                }
-
                 // Update the data on server side.
                 $.post(updateURL, {
                   keys: [movedNode.id],
                   target: data.position,
                   parent: parent,
                   old_parent: old_parent,
-                  old_position: data.old_position,
-                  after: after,
-                  before: before
+                  old_position: data.old_position
                 })
                   .done(function(response) {
                     if (response.result !== "success") {
@@ -124,9 +112,21 @@
                         var parentText = Drupal.t('root');
                       }
                       else {
-                        var parentText = thisTree.get_node(parent).text;
+                        var parentText = parent_node.text;
+                      }
+                      // Update the nodes changed in the server side.
+                      if (response.updated_nodes) {
+                        let update_nodes = response.updated_nodes;
+                        for (const id in update_nodes) {
+                          let node = thisTree.get_node(id);
+                          if (node) {
+                            node.data.weight = update_nodes[id];
+                          }
+                        }
+                        //Refresh the tree without reloading data from server.
+                        thisTree.sort(parent_node, true);
+                        thisTree.redraw(true);
                       }
-                      thisTree.refresh();
                       let message = Drupal.t('@node is moved to position @position under @parent', {'@node': data.node.text, '@parent': parentText, '@position': data.position + 1});
                       // Inform user the movement.
                       drupalMessages.clear();
@@ -145,7 +145,7 @@
               }
             });
 
-            treeContainer.on('ready.jstree open_node.jstree move_node.jstree search.jstree clear_search.jstree', function (event, data) {
+            treeContainer.on('ready.jstree open_node.jstree move_node.jstree search.jstree clear_search.jstree redraw.jstree', function (event, data) {
               Drupal.attachBehaviors(event.target);
             });
 

src/Controller/HmMenuController.php

@@ -239,7 +239,12 @@ class HmMenuController extends ControllerBase {
         $this->menuLinkManager->updateDefinition($links_uuid[$link_id], ['weight' => $link_weight, 'parent' => $parent]);
       }
 
-      return new JsonResponse(['result' => 'success']);
+      $result = [
+        'result' => 'success',
+        'updated_nodes' => $new_hierarchy,
+      ];
+
+      return new JsonResponse($result);
     }
 
     return new JsonResponse(['result' => 'fail']);

src/Controller/HmTaxonomyController.php

@@ -174,9 +174,6 @@ class HmTaxonomyController extends ControllerBase {
     // Remove the parent index from the parent id.
     $parent_id = explode('_', $parent_id)[0];
     $updated_terms = $request->get('keys');
-    $before = $request->get('before');
-    // Remove the parent index from the term id.
-    $before = explode('_', $before)[0];
     $success = FALSE;
     $all_siblings = [];
 
@@ -234,11 +231,12 @@ class HmTaxonomyController extends ControllerBase {
       }
     }
 
-    if ($success) {
-      return new JsonResponse(['result' => 'success']);
-    }
+    $result = [
+      'result' => $success ? 'success' : 'fail',
+      'updated_nodes' => $new_hierarchy,
+    ];
 
-    return new JsonResponse(['result' => 'fail']);
+    return new JsonResponse($result);
   }
 
 }

src/PluginTypeManager.php

@@ -128,7 +128,7 @@ class PluginTypeManager {
         // we don't need to move any siblings.
         $weight = reset($all_siblings) - 1;
       }
-      elseif ($target_position >= $total - 1) {
+      elseif ($target_position >= $total + $num_new - 1) {
         // The insert postion is the end,
         // we don't need to move any siblings.
         $last_item= array_slice($all_siblings, -1, 1, TRUE);
@@ -204,7 +204,7 @@ class PluginTypeManager {
         }
       }
     }
-    
+
     foreach ($updated_items as $item) {
       $new_hierarchy[$item] = $weight++;
     }