Skip to content

Use in the admin (admin4)

viur-revision ships a ready-made Vue 3 component for the ViUR admin4 that turns the module's revision endpoints into a point-and-click UI: a revision history button in the handler bar that lists every revision and lets an editor preview, restore, or delete one.

The component lives in the admin4/ folder of this repository.

What it does

The button appears in a module's handler bar and opens a dialog that drives the RevisionModule endpoints:

In the dialog Endpoint called
Open / list GET /<module>/list_revision
Preview a row GET /<module>/view_revision
Restore a row POST /<module>/apply_revision (skey-protected)
Delete a row POST /<module>/delete_revision (skey-protected)

It works both in the list handler (enabled when exactly one row is selected) and in the edit handler (uses the currently opened entity). The preview renders each bone with the same boneLogic the list handler uses, so relational and code bones look the way they do everywhere else.

Installation

1. Add the component to your admin4 build

Copy revisionhistory.vue into your admin4 source tree, e.g. src/components/handlerbaractions/revisionhistory.vue.

2. Register it as a handler-bar action

In your admin's App.vue, register the component under a key in handlerbar.actions (inside onMounted):

import RevisionHistory from "./components/handlerbaractions/revisionhistory.vue"

// …
dbStore.state["handlerbar.actions"] = {
  // …your other actions…
  revisionhistory: RevisionHistory,
}

3. Enable it on the server module

The admin only shows the button for modules whose adminInfo requests it. Add the action name to actions and declare it as a component custom action that points at the key you registered in step 2:

from viur.core.prototypes import List
from viur.revision import RevisionModule

class Example(RevisionModule, List):
    adminInfo = {
        # …existing adminInfo…
        "actions": ["revisionhistory"],
        "customActions": {
            "revisionhistory": {
                "action": "component",
                "component": "revisionhistory",
            },
        },
    }

That's the whole wiring: actions places the button in the handler bar, customActions[...].component tells the admin which registered Vue component to render, and the component talks to the endpoints RevisionModule already exposes.

Access

Every endpoint requires the caller to hold root or <moduleName>-manage, so the buttons are only useful to users who may manage the module. Restrict who sees the action itself with the standard access key on the custom action if needed.