History Widget

The History Widget is an authenticated widget in DataGuard CPM that displays a Citizen's own audit trail history in a simplified way. It is designed to be used on a "My Account" page, alongside the Manage Widget, it provides users with additional transparency by allowing them to review the changes they've made to their permissions over time. This widget enhances trust by offering a clear and accessible record of the user's consent history, ensuring they have full visibility into how their data preferences have evolved.

Insert the Script

To add the Sign Up Widget to your page, insert the following script tag in your HTML:

<script src="<scripts-url>/history-widget.min.js" async=""></script>

Make sure to replace <scripts-url> with the correct URL for your environment. You can find the appropriate URL by checking the Environments page.

Load the Widget

Once the script is added, you need to call the widget load function. Ensure this is done inside a "load" event to make sure the widget code script has fully loaded before running the widget load function:

<script>
    window.addEventListener('load', () => {
        HistoryWidget.load({ ... });
    });
</script>

Replace the ... with your desired configuration. Below are the configuration options:

Required Properties

id: Set this to the id of the div where the widget should be rendered, e.g., <div id="dataguard"></div>. This should always be an empty div as the widget will replace any existing content.
token: Like Manage widgets, the History widget also requires a token that identifies and authorises a Citizen. Refer to the Citizen Token documentation for more information.

Optional Properties

pageSize: The history widget is paginated to support cases where a Citizen has a long history. The pageSize property defines the maximum size of each page.

Display Configuration

The display section controls how the widget is rendered on the page:

display.location: Specifies where the widget is rendered on the page. The default is centre, which renders the widget in a pop-up. Often you will want to override the default to inside instead to render it the flow of a form. Options include: inside, top-left, top-right, bottom-left, bottom-right, centre.

Styling

The widget look and feel is completely customisable using CSS. For more information on styling the widget, visit the Customise Widget Styling page