Edit History

Preset ModePlugin Mode

Preset Info

@univerjs/preset-docs-collaboration

Server Required

Yes

Caution

The edit history functionality requires support from the Univer server. Please ensure that you have correctly installed and configured the Univer server. For details, please refer to: Upgrading to Pro

Edit History allows users to view and restore historical versions of documents, supporting various filtering and searching methods to help users efficiently manage document content.

Preset Mode

Installation

The UniverSheetsAdvancedPreset preset from @univerjs/preset-sheets-advanced depends on the UniverSheetsDrawingPreset preset at runtime. Please install @univerjs/preset-sheets-drawing first.

npm install @univerjs/preset-sheets-drawing @univerjs/preset-sheets-advanced

Usage

import { UniverSheetsAdvancedPreset } from '@univerjs/preset-sheets-advanced'
import UniverPresetSheetsAdvancedEnUS from '@univerjs/preset-sheets-advanced/locales/en-US'
import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsDrawingPreset } from '@univerjs/preset-sheets-drawing'
import UniverPresetSheetsDrawingEnUS from '@univerjs/preset-sheets-drawing/locales/en-US'
import { createUniver, LocaleType, merge } from '@univerjs/presets'

import '@univerjs/preset-sheets-core/lib/index.css'
import '@univerjs/preset-sheets-drawing/lib/index.css'
import '@univerjs/preset-sheets-advanced/lib/index.css'

const { univerAPI } = createUniver({
  locale: LocaleType.En_US,
  locales: {
    [LocaleType.En_US]: merge(
      {},
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsDrawingEnUS, 
      UniverPresetSheetsAdvancedEnUS, 
    ),
  },
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsDrawingPreset(), 
    UniverSheetsAdvancedPreset({ 
      universerEndpoint: 'http://localhost:3010', 
    }), 
  ],
})

If you have a commercial license for Univer, please refer to Using License in Client for configuration.

Preset and Configuration

The UniverSheetsAdvancedPreset configuration options:

interface IUniverSheetsAdvancedPresetConfig {
  // The endpoint of the Univer Server
  universerEndpoint?: string
  exchangeClientOptions?: {
    // Minimum number of rows in the worksheet after import
    minSheetRowCount?: number
    // Minimum number of columns in the worksheet after import
    minSheetColumnCount?: number
  }
}

Plugin Mode

Installation

npm install @univerjs-pro/edit-history-viewer @univerjs-pro/edit-history-loader

Usage

import { UniverEditHistoryLoaderPlugin } from '@univerjs-pro/edit-history-loader'
import EditHistoryViewerEnUS from '@univerjs-pro/edit-history-viewer/locale/en-US'
import { LocaleType, merge, Univer } from '@univerjs/core'

import '@univerjs-pro/edit-history-viewer/lib/index.css'

const univer = new Univer({
  locale: LocaleType.En_US,
  locales: {
    [LocaleType.En_US]: merge(
      {},
      EditHistoryViewerEnUS, 
    ),
  },
})

univer.registerPlugin(UniverEditHistoryLoaderPlugin, { 
  univerContainerId: 'your-univer-container-id', 
})

If you have a commercial license for Univer, please refer to Using License in Client for configuration.

Plugins and Configuration

The UniverExchangeClientPlugin configuration options:

interface IUniverExchangeClientConfig {
  // Univer Server configuration
  downloadEndpointUrl?: string
  uploadFileServerUrl?: string
  importServerUrl?: string
  exportServerUrl?: string
  getTaskServerUrl?: string
  signUrlServerUrl?: string
  // Maximum timeout time in milliseconds
  maxTimeoutTime?: number
  options?: {
    // Minimum number of rows in the worksheet after import
    minSheetRowCount?: number
    // Minimum number of columns in the worksheet after import
    minSheetColumnCount?: number
  }
}

When enabling edit history, the UniverEditHistoryLoaderPlugin will load a new Univer instance and mount it on the specified DOM node. Therefore, when registering, you need to provide a suitable DOM node id (such as the original Univer instance's container) to achieve the purpose of the history panel covering the original Univer panel. If the node id is not specified, it defaults to univer-container.

Feature Adaptation

In the Univer instance for edit history, only official plugins are loaded by default. Third-party feature plugins developed for business needs need to be registered with the HistoryLoaderService to be correctly displayed in the edit history.

For official plugins that are already registered, you can also modify their configurations.

In the HistoryLoaderService, you can also retrieve or subscribe to the Univer instance for edit history, which supports more extended operations.

import { HistoryLoaderService } from '@univerjs-pro/edit-history-loader'
// When using presets, you can import the `HistoryLoaderService` from `@univerjs/preset-sheets-collaboration`.

const disposable = univerAPI.addEvent(univerAPI.Event.LifeCycleChanged, ({ stage }) => {
  if (stage === univerAPI.Enum.LifecycleStages.Steady) {
    const injector = univer.__getInjector()
    const historyLoaderService = injector.get(HistoryLoaderService)

    // The registration method is the same as that of PluginService. The Univer instance for edit history will register the corresponding plugins according to the following configuration after creation.
    historyLoaderService.registerPlugin(YourPlugin, YourPluginConfig)
    // Configure the officially registered plugin, set the true parameter to indicate that the original configuration should be overridden
    historyLoaderService.registerPlugin(ExamplePlugin, ExamplePluginConfig, true)

    // If the edit history is loaded, you can directly obtain the Univer instance for edit history
    const historyUniver = historyLoaderService.historyUniver
  }
})

// Remove the event listener using `disposable.dispose()`

On this page