feat(sub): validate against duplicate field and tag names (#6079)

Author: Gene Hynson

src/types/subscriptions.ts

@@ -6,6 +6,12 @@ export enum BrokerAuthTypes {
   Certificate = 'certificate',
 }
 
+export enum DataFormatTypes {
+  LineProtocol = 'lineprotocol',
+  JSON = 'json',
+  String = 'string',
+}
+
 export interface Subscription {
   id?: string
   name?: string

src/writeData/subscriptions/components/BrokerForm.scss

@@ -97,3 +97,6 @@
     margin-bottom: 30px;
   }
 }
+.cf-status-indicator {
+  top: unset;
+}

src/writeData/subscriptions/components/JsonPathInput.tsx

@@ -31,6 +31,7 @@ import {
   sanitizeType,
   dataTypeList,
   handleAvroValidation,
+  handleDuplicateFieldTagName,
 } from 'src/writeData/subscriptions/utils/form'
 import {event} from 'src/cloud/utils/reporting'
 import ValidationInputWithTooltip from './ValidationInputWithTooltip'
@@ -110,7 +111,8 @@ const JsonPathInput: FC<Props> = ({
                 : formContent.jsonFieldKeys[itemNum].name
               return (
                 handleValidation(name, value) ??
-                handleAvroValidation(name, value)
+                handleAvroValidation(name, value) ??
+                handleDuplicateFieldTagName(value, formContent)
               )
             }}
             placeholder={`${name}_name`.toLowerCase()}

src/writeData/subscriptions/components/ParsingForm.tsx

@@ -16,7 +16,7 @@ import JsonParsingForm from 'src/writeData/subscriptions/components/JsonParsingF
 import LineProtocolForm from 'src/writeData/subscriptions/components/LineProtocolForm'
 
 // Types
-import {Subscription} from 'src/types/subscriptions'
+import {DataFormatTypes, Subscription} from 'src/types/subscriptions'
 
 // Styles
 import 'src/writeData/subscriptions/components/ParsingForm.scss'
@@ -63,20 +63,20 @@ const ParsingForm: FC<Props> = ({
                 updateForm={updateForm}
                 className="create"
               />
-              {formContent.dataFormat === 'lineprotocol' && (
+              {formContent.dataFormat === DataFormatTypes.LineProtocol && (
                 <LineProtocolForm
                   edit={showUpgradeButton ? false : true}
                   formContent={formContent}
                 />
               )}
-              {formContent.dataFormat === 'json' && (
+              {formContent.dataFormat === DataFormatTypes.JSON && (
                 <JsonParsingForm
                   formContent={formContent}
                   updateForm={updateForm}
                   edit={showUpgradeButton ? false : true}
                 />
               )}
-              {formContent.dataFormat === 'string' && (
+              {formContent.dataFormat === DataFormatTypes.String && (
                 <StringParsingForm
                   formContent={formContent}
                   updateForm={updateForm}

src/writeData/subscriptions/components/StringPatternInput.tsx

@@ -21,6 +21,7 @@ import {Subscription} from 'src/types/subscriptions'
 import {
   handleRegexValidation,
   handleValidation,
+  handleDuplicateFieldTagName,
   REGEX_TOOLTIP,
 } from 'src/writeData/subscriptions/utils/form'
 import {event} from 'src/cloud/utils/reporting'
@@ -90,14 +91,15 @@ const StringPatternInput: FC<Props> = ({
           tooltip={`This will become the the ${
             tagType ? 'tag' : 'field'
           }'s key`}
-          validationFunc={() =>
-            handleValidation(
-              `${name}`,
-              tagType
-                ? formContent.stringTags[itemNum].name
-                : formContent.stringFields[itemNum].name
+          validationFunc={() => {
+            const value = tagType
+              ? formContent.stringTags[itemNum].name
+              : formContent.stringFields[itemNum].name
+            return (
+              handleValidation(`${name}`, value) ??
+              handleDuplicateFieldTagName(value, formContent)
             )
-          }
+          }}
           placeholder={`${name}_name`.toLowerCase()}
           onChange={e => {
             let newArr

src/writeData/subscriptions/utils/form.ts

@@ -6,6 +6,7 @@ import {
   Steps,
   SubscriptionNavigationModel,
   BrokerAuthTypes,
+  DataFormatTypes,
 } from 'src/types/subscriptions'
 import jsonpath from 'jsonpath'
 import {IconFont} from '@influxdata/clockface'
@@ -74,6 +75,41 @@ export const handleValidation = (
   return null
 }
 
+export const handleDuplicateFieldTagName = (
+  formVal: string,
+  form: Subscription
+) => {
+  switch (form.dataFormat) {
+    case DataFormatTypes.LineProtocol: {
+      return null
+    }
+    case DataFormatTypes.JSON: {
+      const numMatchingFieldNames = form.jsonFieldKeys.filter(
+        k => k.name === formVal
+      ).length
+      const numMatchingTagNames = form.jsonTagKeys.filter(
+        k => k.name === formVal
+      ).length
+      // formVal already exists in form so expect there to be exactly one
+      return numMatchingFieldNames + numMatchingTagNames > 1
+        ? `'${formVal}' name has already been used, unique column names are required`
+        : null
+    }
+    case DataFormatTypes.String: {
+      const numMatchingFieldNames = form.stringFields.filter(
+        k => k.name === formVal
+      ).length
+      const numMatchingTagNames = form.stringTags.filter(
+        k => k.name === formVal
+      ).length
+      // formVal already exists in form so expect there to be exactly one
+      return numMatchingFieldNames + numMatchingTagNames > 1
+        ? `'${formVal}' name has already been used, unique column names are required`
+        : null
+    }
+  }
+}
+
 export const handleJsonPathValidation = (formVal: string): string | null => {
   if (!validateJsonPath(formVal)) {
     return `${formVal} is not a valid JSON Path expression`