OtelTraceTable

API reference and demos for OtelTraceTable.

Source

Import

import { OtelTraceTable } from "@flanksource/clicky-ui/data";

Demos

Default · Open in Storybook

Empty · Open in Storybook

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Props

Prop	Type	Default	Description
cellFilters	Record<string, Record<string, CellFilterMode>>	—	Current modes for native server-backed cell filters.
externalFilters	FilterBarFilter[]	—	Extra filter pills supplied by the caller (e.g., operation query parameters surfaced via parametersToFormConfig) that should appear in the FilterBar alongside the column-derived filters. Rendered before the column filters so the caller's natural ordering wins.
externalSearch	FilterBarSearchProps	—	Caller-owned search input rendered in the FilterBar's search slot. Unlike `globalFilter`, this does NOT filter rows client-side — it is a controlled input the caller wires to a server-side query (e.g., an operation's `q` parameter). Takes precedence over the built-in global filter input.
externalTimeRange	FilterBarRangeProps	—	Caller-owned time-range control rendered in the FilterBar. Like `externalSearch`/`externalFilters`, it does NOT filter rows client-side — the caller wires it to a server-side query (e.g. an operation's `time-from`/`time-to` parameters). Takes precedence over any column-derived time range.
infinite	DataTableInfinite	—	Server-driven infinite scroll. The caller owns the accumulated rows; this only says when to ask for more. Combines with `pagination` — see DataTableInfinite.
listing	{ rows: Record<string, unknown>[]; columns: DataTableColumn<Record<string, unknown>>[]; linkRows?: boolean; }	—	—
loading	boolean	—	Shows skeleton/loading rows instead of data rows.
manualSort	boolean	—	When true, header sorting updates state but does not reorder `data`.
menuActions	DataTableMenuAction[]	—	Extra actions rendered in the table preferences menu.
onCellFilterChange	(…) => void	—	Called when a cell's include/exclude hover action changes.
onSelectSpan*	(…) => void	—	—
onSelectTrace*	(…) => void	—	—
onSortChange	(…) => void	—	Called when a sortable header changes the controlled sort state.
pagination	DataTablePagination	—	Server-side pagination footer. When provided, a small page-size / prev / next strip is rendered below the table; the DataTable does NOT slice `data` itself, callers are expected to refetch when `onPageChange` or `onPageSizeChange` fires.
renderTraceTitle	(…) => ReactNode	—	Places the open trace's title elsewhere (e.g. a breadcrumb in the app shell's top bar), replacing the inline "Back to traces" link.
selectedSpanId	string	—	—
selectedTraceId	string	—	—
serverTiming	readonly ServerTimingMetric[]	—	The listing response's Server-Timing metrics, shown as a badge in the listing's filter bar.
sort	SortState | null	—	Controlled sort state, for server-backed tables.
spans*	readonly Span[]	—	—
traceHref*	(…) => string	—	—