[Fleet][Kafka] Headers and topics changes trigger hasChanged (#166062)

https://github.com/elastic/kibana/issues/165976

Proper onChange function for headers and topics fields that now
correctly triggers `hasChanged` property resulting in activating `Save`
button as soon as any change is made.



935aee94-d4c3-424e-9481-32103eeb5b04
This commit is contained in:
Konrad Szwarc 2023-09-14 16:32:02 +02:00 committed by GitHub
parent 26ba212c44
commit 9578950404
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 13 deletions

View file

@ -38,8 +38,15 @@ export const OutputFormKafkaHeaders: React.FunctionComponent<{ inputs: OutputFor
const handleKeyValuePairChange = useCallback(
(index: number, field: 'key' | 'value', value: string) => {
const updatedPairs = [...keyValuePairs];
updatedPairs[index][field] = value;
const updatedPairs = keyValuePairs.map((pair, i) => {
if (i === index) {
return {
...pair,
[field]: value,
};
}
return pair;
});
onChange(updatedPairs);
},
[keyValuePairs, onChange]

View file

@ -94,17 +94,29 @@ export const OutputFormKafkaTopics: React.FunctionComponent<{ inputs: OutputForm
const handleTopicProcessorChange = useCallback(
(index: number, field: 'topic' | 'condition' | 'type', value: string) => {
const updatedPairs = [...topics];
if (field === 'topic') {
updatedPairs[index].topic = value;
} else {
updatedPairs[index].when = {
...(updatedPairs[index].when || {}),
...((field === 'condition' ? { condition: value } : {}) as { condition?: string }),
...((field === 'type' ? { type: value } : {}) as { type?: ValueOf<KafkaTopicWhenType> }),
};
}
onChange(updatedPairs);
const updatedTopics = topics.map((topic, i) => {
if (i === index) {
if (field === 'topic') {
return {
...topic,
topic: value,
};
} else {
return {
...topic,
when: {
...(topic.when || {}),
...((field === 'condition' ? { condition: value } : {}) as { condition?: string }),
...((field === 'type' ? { type: value } : {}) as {
type?: ValueOf<KafkaTopicWhenType>;
}),
},
};
}
}
return topic;
});
onChange(updatedTopics);
},
[topics, onChange]
);