Implementation:Apache Druid HistoryDialog

Knowledge Sources	Apache_Druid
Domains	Web_Console, Audit_History
Last Updated	2026-02-10 10:00 GMT

Overview

HistoryDialog is a React dialog component that displays a tabbed view of audit history records with the ability to diff between versions.

Description

The HistoryDialog component renders a BlueprintJS Dialog with vertical tabs representing each audit history entry. Each tab shows the normalized JSON payload of that record using the ShowValue component and provides a "diff with previous" action. When a diff is requested, the dialog transitions to display a DiffDialog with all versions available for comparison. Payloads are normalized by parsing and re-serializing JSON to ensure consistent formatting.

Usage

Used to display the change history of configurations such as retention rules, overlord dynamic config, and coordinator dynamic config, allowing users to review and compare past changes.

Code Reference

Source Location

• Repository: Apache Druid
• File: web-console/src/dialogs/history-dialog/history-dialog.tsx
• Lines: 1-122

Signature

interface HistoryRecord {
  auditInfo: {
    author?: string;
    comment?: string;
    ip?: string;
  };
  auditTime: string;
  payload: string;
}

interface HistoryDialogProps {
  className?: string;
  title: string;
  historyRecords: HistoryRecord[];
  onBack(): void;
}

export const HistoryDialog = React.memo(function HistoryDialog(props: HistoryDialogProps): JSX.Element;

Import

import { HistoryDialog } from 'web-console/src/dialogs/history-dialog/history-dialog';

I/O Contract

Inputs

Name	Type	Required	Description
className	string	No	Additional CSS class name for the dialog
title	string	Yes	Dialog title text
historyRecords	HistoryRecord[]	Yes	Array of audit history records to display
onBack	() => void	Yes	Callback invoked when the Back button is clicked to return to the previous view

Outputs

Name	Type	Description
rendered dialog	JSX.Element	A BlueprintJS Dialog with vertical tabs for each history record and optional DiffDialog overlay for comparing versions

Usage Examples

Displaying Retention Rule History

<HistoryDialog
  title="Retention rules history"
  historyRecords={historyRecords}
  onBack={() => setShowHistory(false)}
/>

Related Pages

• Environment:Apache_Druid_Web_Console_Development