Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions src/containers/Tenant/Diagnostics/TopicData/TopicData.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -199,6 +199,14 @@ export function TopicData({scrollContainerRef, path, database}: TopicDataProps)
}
}, [handleSelectedOffsetChange, handleStartTimestampChange, topicDataFilter]);

const handlePartitionChange = React.useCallback(
(value: string[]) => {
handleSelectedPartitionChange(value[0]);
resetFilters();
},
[handleSelectedPartitionChange, resetFilters],
);

const scrollToOffset = React.useCallback(
(newOffset: number) => {
const scrollTop = (newOffset - (baseOffset ?? 0)) * DEFAULT_TABLE_ROW_HEIGHT;
Expand Down Expand Up @@ -241,6 +249,7 @@ export function TopicData({scrollContainerRef, path, database}: TopicDataProps)
key={controlsKey}
columnsToSelect={columnsToSelect}
handleSelectedColumnsUpdate={setColumns}
handlePartitionChange={handlePartitionChange}
partitions={partitions}
partitionsLoading={partitionsLoading}
partitionsError={partitionsError}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,11 +41,13 @@ interface TopicDataControlsProps {
endOffset?: number;
truncatedData?: boolean;
scrollToOffset: (offset: number) => void;
handlePartitionChange?: (value: string[]) => void;
}

export function TopicDataControls({
columnsToSelect,
handleSelectedColumnsUpdate,
handlePartitionChange,

startOffset,
endOffset,
Expand All @@ -55,39 +57,21 @@ export function TopicDataControls({
scrollToOffset,
truncatedData,
}: TopicDataControlsProps) {
const {
selectedPartition,
handleSelectedPartitionChange: handleSelectedPartitionParamChange,
handleSelectedOffsetChange,
handleStartTimestampChange,
} = useTopicDataQueryParams();
const {selectedPartition} = useTopicDataQueryParams();

const partitionsToSelect = partitions?.map(({partitionId}) => ({
content: String(partitionId),
value: String(partitionId),
}));

const handleSelectedPartitionChange = React.useCallback(
(value: string[]) => {
handleSelectedPartitionParamChange(value[0]);
handleSelectedOffsetChange(undefined);
handleStartTimestampChange(undefined);
},
[
handleSelectedPartitionParamChange,
handleStartTimestampChange,
handleSelectedOffsetChange,
],
);

return (
<React.Fragment>
<Select
className={b('partition-select')}
label={i18n('label_partition-id')}
options={partitionsToSelect}
value={selectedPartition ? [selectedPartition] : undefined}
onUpdate={handleSelectedPartitionChange}
onUpdate={handlePartitionChange}
filterable={partitions && partitions.length > 5}
disabled={!partitions || !partitions.length}
errorPlacement="inside"
Expand Down
Loading