fix: adding 2 pipeline processors with same name should not break the UI (#3943)

* fix: ensure pipeline processor ids derived from name are unique

* fix: update snapshots to get jest passing

* chore: use uuid for processor ids
This commit is contained in:
Raj Kamal Singh 2023-11-13 15:29:36 +05:30 committed by GitHub
parent 5a9f626da5
commit f86fc03fd6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 8 deletions

View File

@ -7,6 +7,7 @@ import {
PipelineData, PipelineData,
ProcessorData, ProcessorData,
} from 'types/api/pipeline/def'; } from 'types/api/pipeline/def';
import { v4 } from 'uuid';
import { ModalButtonWrapper, ModalTitle } from '../styles'; import { ModalButtonWrapper, ModalTitle } from '../styles';
import { getEditedDataSource, getRecordIndex } from '../utils'; import { getEditedDataSource, getRecordIndex } from '../utils';
@ -59,7 +60,7 @@ function AddNewProcessor({
const totalDataLength = expandedPipelineData?.config?.length || 0; const totalDataLength = expandedPipelineData?.config?.length || 0;
const newProcessorData = { const newProcessorData = {
id: values.name.replace(/\s/g, ''), id: v4(),
orderId: Number(totalDataLength || 0) + 1, orderId: Number(totalDataLength || 0) + 1,
type: processorType, type: processorType,
enabled: true, enabled: true,
@ -73,12 +74,14 @@ function AddNewProcessor({
'id', 'id',
); );
const processorData = expandedPipelineData?.config?.[findRecordIndex];
const updatedProcessorData = { const updatedProcessorData = {
id: values.name.replace(/\s/g, ''), id: processorData?.id || v4(),
orderId: expandedPipelineData?.config?.[findRecordIndex].orderId, orderId: processorData?.orderId,
type: processorType, type: processorType,
enabled: expandedPipelineData?.config?.[findRecordIndex].enabled, enabled: processorData?.enabled,
output: expandedPipelineData?.config?.[findRecordIndex].output, output: processorData?.output,
...values, ...values,
}; };

View File

@ -239,7 +239,7 @@ function PipelineExpandView({
isDarkMode={isDarkMode} isDarkMode={isDarkMode}
showHeader={false} showHeader={false}
columns={columns} columns={columns}
rowKey="name" rowKey="id"
size="small" size="small"
components={tableComponents} components={tableComponents}
dataSource={processorData} dataSource={processorData}

View File

@ -66,7 +66,7 @@ exports[`PipelinePage should render PipelineExpandView section 1`] = `
> >
<tr <tr
class="ant-table-row ant-table-row-level-0" class="ant-table-row ant-table-row-level-0"
data-row-key="grok use common asd" data-row-key="grokusecommon"
draggable="true" draggable="true"
> >
<td <td
@ -97,7 +97,7 @@ exports[`PipelinePage should render PipelineExpandView section 1`] = `
</tr> </tr>
<tr <tr
class="ant-table-row ant-table-row-level-0" class="ant-table-row ant-table-row-level-0"
data-row-key="rename auth" data-row-key="renameauth"
draggable="true" draggable="true"
> >
<td <td