Skip to main content



Refreshes React metadata card content.


// The dashboard variable here points to instance of IDashboard
await dashboard.UpdateCustomData(customData);


customDataanyThe dashboard object's custom data.

Return type

Promise < void >Method does not return a value


The UpdateCustomData method can be used to send new custom data to an existing dashboard, without the dashboard needing to be completely reinitialized.

For this to work your dashboard must listen for the CustomDataChanged event:

function OnNewDashboard(dashboard) {
dashboard.Events.Register( MFiles.Event.CustomDataChanged, data => {
// Render the "timeNow" property from the custom data.
// Will be called automatically when the dashboard first renders, then
// every time the CustomDataChanged event is fired.
document.body.innerHTML = `<h1>${data.timeNow}</h1>`;

This event can then be raised from within another part of your code, for example from within a module:

"use strict";
async function OnNewShellUI(shellUI) {

// Wait for shell frames to be created.
await shellUI.Events.Register(MFiles.Event.NewNormalShellFrame, OnNewNormalShellFrame);

// Handler for shell frame created event.
async function OnNewNormalShellFrame(shellFrame)
await shellFrame.Events.Register(MFiles.Event.Started, OnStarted);
async function OnStarted()
const myTab = await shellFrame.RightPane.AddTab("my-test-tab", "My Dashboard", "_last");
const myDashboard = await myTab.ShowDashboard("mydb",
timeNow: "INITIAL_DATA, 5 second refresh interval!"

// Every 5 seconds call the UpdateCustomData method
// to raise the event that the dashboard subscribes to.
setInterval( () => {
timeNow: ( new Date() ).toISOString() // Pass the current time.
}, 5000)