[GH #9613] Extending UndoRedo plugin-- seeking advice/best practices

Tags: #<Tag:0x00007fee368694e0> #<Tag:0x00007fee368693a0>

We need to extend the base functionality of the UndoRedo plugin by adding functionality such as the ability to undo/restore formatting, style, and other cell elements we’ve implemented.

Now, I’m at a loss at the right way to approach this.

On one hand-- I can follow the New Plugin Guide and get started writing our own “UndoRedo” plugin. However, this feels like reinventing the wheel since a lot of great work has already been done.

On the other-- it doesn’t seem easy to simply enhance the existing plugin since it’s essentially “baked into” HandsOnTable itself.

I had considered creating my own plugin, and then copying in most of the logic from src/handsontable/plugins/UndoRedo, but there are internal imports that make this difficult:

import Hooks from '../../pluginHooks';
import { arrayMap, arrayEach } from '../../helpers/array';
import { rangeEach } from '../../helpers/number';
import { inherit, deepClone } from '../../helpers/object';
import { align } from '../contextMenu/utils';

I’d appreciate any advice as to the best way to begin this endeavor.

Thanks in advance.

Hi @adamjroth

maybe you won’t need a plugin. Can you tell me a bit more about the requirements? Especially how and when the metadata is added?

Hi @aleksandra_budnik

Meta data is added for style, format, and decimal count. Custom renderers then get this data from cellProperties and process as necessary, ex:

const BaseRenderer = (
  hotInstance: Handsontable,
  TD: HTMLTableCellElement,
  row: number,
  column: number,
  prop: string | number,
  value: any,
  cellProperties: CellProperties
) => {
  const style = cellProperties?.style;

  if (cellMeta.style){ 
    TD.style = cellMeta.style;
  TD.innerHTML = value;
  return value;

From our understanding, changes to cell meta properties are not tracked in the default UndoRedo plugin. Please advise.


OK. So it’s quite similar to what we have in this demo https://jsfiddle.net/t75wx9vu/2/.
So what I would do to extend this functionality with undoRedo would rely on the afterUndo hook to get coordinates of the cell/cells that participates in undo

afterUndo: function(action){
        let row = action.changes[0];
        let col = action.changes[1];

and based on that, you can read cell meta via getCellMeta(), and if that’s something you’d like to remove, run removeCellMeta().

What do you think about this idea?

Thank you for this. It may prove useful. However, we’re opting for a custom Undo/Redo implementation until this bug is fixed:

Do you have any status on the above?

Thank you!

I do not see this issue being attached to the next milestone. However, I will keep you updated with the status.