HistoryPanel = () => {
  const { canUndo, canRedo, actions } = useEditor((state, query) => ({
    canUndo: query.history.canUndo(),
    canRedo: query.history.canRedo(),
  }));

  return (
    <Fragment>
      {canUndo && (
        <button
          className="btn btn-sm btn-secondary ms-2 me-2"
          title="Undo"
          onClick={() => actions.history.undo()}
        >
          <FontAwesomeIcon icon={faUndo} />
        </button>
      )}
      {canRedo && (
        <button
          className="btn btn-sm btn-secondary"
          title="Redo"
          onClick={() => actions.history.redo()}
        >
          <FontAwesomeIcon icon={faRedo} />
        </button>
      )}
    </Fragment>
  );
}
@returns {Fragment}
@category saltcorn-builder
@subcategory components
@namespace