diff --git a/kafka-ui-react-app/src/components/Topics/New/CustomParams/CustomParams.tsx b/kafka-ui-react-app/src/components/Topics/New/CustomParams/CustomParams.tsx index 8fe22db036..64bb686605 100644 --- a/kafka-ui-react-app/src/components/Topics/New/CustomParams/CustomParams.tsx +++ b/kafka-ui-react-app/src/components/Topics/New/CustomParams/CustomParams.tsx @@ -26,7 +26,7 @@ const CustomParams: React.FC = ({ const onAdd = (event: React.MouseEvent) => { event.preventDefault(); - const newIndex = `${INDEX_PREFIX}.${new Date().getTime()}`; + const newIndex = `${INDEX_PREFIX}.${new Date().getTime()}ts`; setFormCustomParams({ ...formCustomParams, diff --git a/kafka-ui-react-app/src/redux/api/topics.ts b/kafka-ui-react-app/src/redux/api/topics.ts index 160c392c9b..544d41136c 100644 --- a/kafka-ui-react-app/src/redux/api/topics.ts +++ b/kafka-ui-react-app/src/redux/api/topics.ts @@ -1,3 +1,4 @@ +import { reduce } from 'lodash'; import { TopicName, Topic, @@ -5,6 +6,7 @@ import { TopicDetails, TopicConfig, TopicFormData, + TopicFormCustomParam, } from 'redux/interfaces'; import { BASE_URL, @@ -23,6 +25,10 @@ export const getTopics = (clusterName: ClusterName): Promise => fetch(`${BASE_URL}/clusters/${clusterName}/topics`, { ...BASE_PARAMS }) .then(res => res.json()); +interface Result { + [index: string]: string, +} + export const postTopic = (clusterName: ClusterName, form: TopicFormData): Promise => { const { name, @@ -34,6 +40,12 @@ export const postTopic = (clusterName: ClusterName, form: TopicFormData): Promis maxMessageBytes, minInSyncReplicas, } = form; + + const customParams = reduce(Object.values(form.customParams), (result: Result, customParam: TopicFormCustomParam) => { + result[customParam.name] = customParam.value; + return result; + }, {}); + const body = JSON.stringify({ name, partitions, @@ -44,8 +56,10 @@ export const postTopic = (clusterName: ClusterName, form: TopicFormData): Promis 'retention.bytes': retentionBytes, 'max.message.bytes': maxMessageBytes, 'min.insync.replicas': minInSyncReplicas, + ...customParams, } }); + return fetch(`${BASE_URL}/clusters/${clusterName}/topics`, { ...BASE_PARAMS, method: 'POST',