0ct0pu5/kafka-ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix topic messages offset filter bug (#1849)

Browse source 
* fix topic messages offset filter bug

* refactor function to improve readability

* fix infinite fetching bug

Co-authored-by: Roman Zabaluev <rzabaluev@provectus.com>
This commit is contained in:
Arsen Simonyan 2022-04-22 10:41:40 +04:00 • committed by GitHub
parent 3a9e1d12f4
commit f6e98ec5f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 34 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/Filters.tsx
View file

@ -182,48 +182,37 @@ const Filters: React.FC<FiltersProps> = ({
);
};
const handleFiltersSubmit = React.useCallback(() => {
setAttempt(attempt + 1);
const handleFiltersSubmit = React.useCallback(
(currentOffset: string) => {
setAttempt(attempt + 1);
if (isSeekTypeControlVisible) {
props.seekType = isLive ? SeekType.LATEST : currentSeekType;
props.seekTo = selectedPartitions.map(({ value }) => {
let seekToOffset;
if (isSeekTypeControlVisible) {
props.seekType = isLive ? SeekType.LATEST : currentSeekType;
props.seekTo = selectedPartitions.map(({ value }) => {
const offsetProperty =
seekDirection === SeekDirection.FORWARD ? 'offsetMin' : 'offsetMax';
const offsetBasedSeekTo =
currentOffset || partitionMap[value][offsetProperty];
const seekToOffset =
currentSeekType === SeekType.OFFSET
? offsetBasedSeekTo
: timestamp?.getTime();
if (currentSeekType === SeekType.OFFSET) {
if (offset) {
seekToOffset = offset;
} else {
seekToOffset =
seekDirection === SeekDirection.FORWARD
? partitionMap[value].offsetMin
: partitionMap[value].offsetMax;
}
} else if (timestamp) {
seekToOffset = timestamp.getTime();
}
return `${value}::${seekToOffset || '0'}`;
});
}
return `${value}::${seekToOffset || '0'}`;
const newProps = omitBy(props, (v) => v === undefined || v === '');
const qs = Object.keys(newProps)
.map((key) => `${key}=${newProps[key]}`)
.join('&');
history.push({
search: `?${qs}`,
});
}
const newProps = omitBy(props, (v) => v === undefined || v === '');
const qs = Object.keys(newProps)
.map((key) => `${key}=${newProps[key]}`)
.join('&');
history.push({
search: `?${qs}`,
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
seekDirection,
queryType,
activeFilter,
currentSeekType,
timestamp,
query,
]);
},
[seekDirection, queryType, activeFilter, currentSeekType, timestamp, query]
);
const handleSSECancel = () => {
if (!source.current) return;
@ -313,7 +302,10 @@ const Filters: React.FC<FiltersProps> = ({
}
break;
case TopicMessageEventTypeEnum.PHASE:
if (phase?.name) updatePhase(phase.name);
if (phase?.name) {
updatePhase(phase.name);
setIsFetching(false);
}
break;
case TopicMessageEventTypeEnum.CONSUMING:
if (consuming) updateMeta(consuming);
@ -345,11 +337,11 @@ const Filters: React.FC<FiltersProps> = ({
]);
React.useEffect(() => {
if (location.search?.length === 0) {
handleFiltersSubmit();
handleFiltersSubmit(offset);
}
}, [handleFiltersSubmit, location]);
React.useEffect(() => {
handleFiltersSubmit();
handleFiltersSubmit(offset);
}, [handleFiltersSubmit, seekDirection]);
return (
@ -429,7 +421,7 @@ const Filters: React.FC<FiltersProps> = ({
buttonType="secondary"
buttonSize="M"
disabled={isSubmitDisabled}
onClick={handleFiltersSubmit}
onClick={() => handleFiltersSubmit(offset)}
style={{ fontWeight: 500 }}
>
Submit