Salesforce Record History in Timeline view using a custom Lightning Web Component [New Managed Package version]

As the title says, this is a new, better, managed package version of the component that I developed 1 year back. You can find all the history/details about how I came up with idea for this component in that post. This post mainly focuses on improvements, new features and upgrade options (if you are moving from Unmanaged package to this managed one).

Improvements/New Features

  • The package is now made a managed one. This makes the component easy to update with any new features, bug fixes. It also makes it easy to avoid component name conflicts.
  • The component needs no configuration by default, just drag and drop like other OOB components and you are good to go.
  • You can always customize the component by providing additional ‘Timeline Configuration’ details, more information later in the post.
  • There is a new configurable date filter which is part of the Timeline Configuration.
  • Object Reference fields like Lookup, Master-Detail now show links to the Records.
  • Currency fields now show Currency ISO Code as a prefix. For MultiCurrency orgs, it shows current Record Level Currency ISO Code.

How to configure and use?

Default Configuration

With this new version, by default there is no configuration required. You can just drag and drop the ‘historyTimeline‘ component from ‘Custom – Managed’ section and the component populates data based on pre-populated parameters. Just like the OOB Related List component, this component will show the history of the object where component is added with a pre-defined height. We will go over additional configuration in next section.

To view the default configuration, you can simply create a test record for Timeline Configuration and navigate to the History tab.

Timeline Configuration Object details

In order to understand how to configure the component in Lightning App Builder, first let’s go over some details for Timeline Configuration custom object.

You can find the Timeline Configuration tab in app launcher to create new records. All the fields have help text which provides detail about what that field does. Here are some additional points.

  • This object allows customization for various UI elements.
  • The object has a unique Config Identifier field which is a user input and acts as identifier for custom configuration for a specific component instance. It can be reused for multiple component instances.
  • The Content Format drop-down allows changing how the text shows up in timeline. While Classic shows text in Salesforce classic format, Minimal shows the text in a short format. For example, Minimal shows simple arrow to indicate field changes or strikethrough text to indicate deleted value.
  • The date filter shows up when both Visible Date Filters and Default Date filter values are provided. The list of values are part of a picklist value set ‘Date Filter Values’. You can add new values to the dropdown. Make sure they follow the SOQL date format. The selected of date filter value shows up below the Title in Filtered by section.

Lightning App Builder configuration

With this new version, the component is now available in ‘Custom – Managed’ section. Let’s go over 4 properties available for configuration.

Property NameProperty Details
Timeline TitleThe value provided here shows up as component title on top-right corner.
Height of the Timeline ContentThis value defines height of the content in timeline. The default value is 600px. The value provided here is overridden by the Timeline Configuration value when the Identifier is provided.
Timeline Config IdentifierThis value defines the Timeline Configuration to be fetched for additional customization. This value should match with ‘Config Identifier’ value on Timeline Configuration record.
API Name of the Relationship fieldThis is the only required parameter. It controls which record to use as parent to show the history. The default value is ‘Id’ which shows the history of the Record where the component is added. For example, if you wish to view Account history on Opportunity page, you should set the value to ‘AccountId’.

Upgrading from Old Unmanaged Package

This new version is updated to a managed package from previous Unmanaged one. This makes moving to this new (and future) version(s) easier. Here is what I’ll suggest you do.

  1. Install this managed package to your sandbox/production environment. Both the packages can co-exist in the same org due to their different types.
  2. Replace your already configured Unmanaged package component instances with managed ones. You don’t have to do this all at once, you can plan to do it by objects, lightning pages, etc.
  3. Once all the component instances of Unmanaged package are removed, you can safely uninstall the same.

How can I get it in my Org

Option 1:

If you are a developer or want to explore the code, you can find it here: https://github.com/kshitijlawate/timeline-component-lwc. The Repository is now updated with SFDX Folder structure.

Quick source code download option: https://github.com/kshitijlawate/timeline-component-lwc/releases/tag/1.0

Option 2:

You can use the Package link to install the component in your org. FInd the link below. Before installing the package, please make sure you have Field History Tracking enabled for Account object and Custom Domain is enabled for your org.

Package Link: https://login.salesforce.com/packaging/installPackage.apexp?p0=04t4x000000ZVx3

While trying to install via this link, you will get a warning message as seen in screenshot below. This is only because it is a managed package but not yet available in AppExchange. Rest assured, the package installs the same code available in public repo shared above.

Notable Mention

If you take a look at the source code, you can see that I have created all wrapper classes as independent classes. Initially I had them as subclasses under a primary TimelineWrappers apex class. However, while creating the managed package I realized that namespaced orgs and nested classes with @AuraEnabled properties don’t get along well. Hence, I had to separate each subclass as an independent class.

While it doesn’t look like this will be fixed, you can still upvote below idea.

https://trailblazer.salesforce.com/ideaView?id=0873A000000U3l6QAC

Finally, please log any bugs you find on the Github Repo Issues section. Let me know if you have any questions, comments or any other type of feedback. If you enjoyed this post, share it with your friends and colleagues!