Copy node serialization to memory and past it to new location

[hugominas]

Is your feature request related to a problem? Please describe.
Not a problems its a new feature that could come in handy, @nicosh #209 has successfully implemented a clone tree.

This has proven to be so handy that I was looking to implement this feature as a copy and paste nodes between pages. Much like the example landing page where we can copy the serialize state and load it.

Describe the solution you'd like
To implement this we could serialize the node query.node(idToClone).toNodeTree(); and then paste it in to a new node using some copy and paste indicators

Additional context
I have tried using but got stuck serializing and deserializing the nodeTree tree.serialize(); is there away to access the serialization without recreating.

 const getCloneTree = useCallback((idToClone) => {
    const tree = query.node(idToClone).toNodeTree();
    const newNodes = {};

    const changeNodeId = (node, newParentId) => {
      const newNodeId = shortid();
      const childNodes = node.data.nodes.map((childId) =>
        changeNodeId(tree.nodes[childId], newNodeId)
      );
      const linkedNodes = Object.keys(node.data.linkedNodes).reduce(
        (accum, id) => {
          const newNodeId = changeNodeId(
            tree.nodes[node.data.linkedNodes[id]],
            newNodeId
          );
          return {
            ...accum,
            [id]: newNodeId,
          };
        },
        {}
      );

      let tmpNode = {
        ...node,
        id: newNodeId,
        data: {
          ...node.data,
          parent: newParentId || node.data.parent,
          nodes: childNodes,
          linkedNodes,
        },
      };
      let freshnode = query.parseFreshNode(tmpNode).toNode();
      newNodes[newNodeId] = freshnode;
      return newNodeId;
    };

    const rootNodeId = changeNodeId(tree.nodes[tree.rootNodeId]);
    return {
      rootNodeId,
      nodes: newNodes,
    };
  }, []);

  const CopyNodeTree = (id) => {
    if (!id) return null;
    const theNode = query.node(id).get();
    const parentNode = query.node(theNode.data.parent).get();
    const indexToAdd = parentNode.data.nodes.indexOf(id);
    const tree = getCloneTree(id, parentNode.id);
    return tree.serialize(); //this does not exist
  };
  const PasteNodeTree = (parentId, node) => {
    const tree = actions.deserialize(node);
    actions.addNodeTree(tree, parentId, indexToAdd + 1);
    // uncomment this code block to have the clone
    // function to work properly
    setTimeout(function () {
      actions.deserialize(query.serialize());
      actions.selectNode(tree.rootNodeId);
    }, 100);
  };

[hugominas]

@prevwong sorry to bug you this, is there a way to serialize a node and not all the state, its the missing peace on this puzzle.
I think this could be very beneficial for template, on the fly.

[hugominas]

const copyNodeTree = (id) => {
    if (!id) return null;
    const theNode = query.node(id).get();
    const parentNode = query.node(theNode.data.parent).get();
    const tree = getCloneTree(id, parentNode.id);
    copy(lz.encodeBase64(lz.compress(JSON.stringify(tree))));
  };


  const pasteNodeTree = (id) => {
    if (!id) return null;

    //get parent props
    const theNode = query.node(id).get();
    const parentNode = query.node(theNode.data.parent).get();
    const indexToAdd = parentNode.data.nodes.indexOf(id);

    //set copy node to new position
    const nodeCopy = ``; // get the serializes content
    const node = lz.decompress(lz.decodeBase64(nodeCopy));
    const tree = JSON.parse(node);
    actions.addNodeTree(tree, id, 0);

    // uncomment this code block to have the clone
    // function to work properly
    setTimeout(function () {
      actions.deserialize(query.serialize());
      actions.selectNode(tree.rootNodeId);
    }, 100);
  };

[hugominas]

I am still getting an error on paste when I try to addNodeTree() something about reading the property name. I will have to look into it again.

[hugominas]

Duplicated issue with #316 closing it for now