Implementation:Apache Druid CompactionConfigDialog
| Knowledge Sources | |
|---|---|
| Domains | Web_Console, Compaction |
| Last Updated | 2026-02-10 10:00 GMT |
Overview
A React dialog component for creating and editing per-datasource compaction configurations in the Druid web console.
Description
CompactionConfigDialog is a memoized React component that renders a Blueprint.js Dialog providing both a form-based and a JSON-based editor for compaction configurations. It uses AutoForm with COMPACTION_CONFIG_FIELDS for structured editing and JsonInput with COMPACTION_CONFIG_COMPLETIONS for raw JSON editing. The dialog includes a toggle for concurrent append-and-replace locks, a warning callout for the legacy inputSegmentSizeBytes setting, buttons to view compaction history (via CompactionHistoryDialog), delete the config, and submit changes. Form/JSON tab switching is managed by FormJsonSelector.
Usage
This dialog is opened from the datasources view when a user wants to configure or modify automatic compaction settings for a specific datasource.
Code Reference
Source Location
- Repository: Apache Druid
- File: web-console/src/dialogs/compaction-config-dialog/compaction-config-dialog.tsx
- Lines: 1-187
Signature
export interface CompactionConfigDialogProps {
onClose: () => void;
onSave: (compactionConfig: CompactionConfig) => void | Promise<void>;
onDelete: () => void;
datasource: string;
compactionConfig: CompactionConfig | undefined;
}
export const CompactionConfigDialog = React.memo(function CompactionConfigDialog(
props: CompactionConfigDialogProps,
): JSX.Element)
Import
import { CompactionConfigDialog } from '../../dialogs/compaction-config-dialog/compaction-config-dialog';
I/O Contract
Inputs
| Name | Type | Required | Description |
|---|---|---|---|
| onClose | () => void |
Yes | Callback invoked when the dialog is closed without saving |
| onSave | (compactionConfig: CompactionConfig) => void | Promise<void> |
Yes | Callback invoked with the updated compaction config when the user clicks Submit |
| onDelete | () => void |
Yes | Callback invoked when the user clicks Delete to remove the compaction config |
| datasource | string |
Yes | Name of the datasource being configured |
| compactionConfig | CompactionConfig | undefined |
No | Existing compaction config to edit, or undefined when creating a new config |
Outputs
| Name | Type | Description |
|---|---|---|
| JSX.Element | React element | Renders a dialog with form/JSON tabs, legacy setting warning, concurrent lock toggle, and Submit/Delete/Close/History action buttons |
Usage Examples
Opening the compaction config dialog
<CompactionConfigDialog
datasource="wikipedia"
compactionConfig={existingConfig}
onSave={(config) => saveCompactionConfig(config)}
onDelete={() => deleteCompactionConfig()}
onClose={() => setDialogOpen(false)}
/>