Merge pull request #4233 from influxdata/wizard-bug/hostname

Add hostname syncing between source url, and kapacitor

ui/src/reusable_ui/components/wizard/WizardTextInput.tsx

@@ -13,6 +13,7 @@ interface Props {
   isDisabled?: boolean
   onChange: (value: string) => void
   valueModifier?: (value: string) => string
+  onSubmit?: (value: string) => void
   placeholder?: string
   autoFocus?: boolean
   type?: string
@@ -34,6 +35,7 @@ class WizardTextInput extends PureComponent<Props, State> {
     valueModifier: x => x,
     autoFocus: false,
     type: 'text',
+    onSubmit: () => null,
   }
 
   constructor(props) {
@@ -105,8 +107,9 @@ class WizardTextInput extends PureComponent<Props, State> {
   }
 
   private submit = incomingValue => {
-    const {onChange, value, valueModifier} = this.props
+    const {onChange, value, valueModifier, onSubmit} = this.props
     const newValue = valueModifier(incomingValue)
+    onSubmit(newValue)
 
     if (value !== newValue) {
       onChange(newValue)

ui/src/sources/components/KapacitorStep.tsx

@@ -57,6 +57,18 @@ const getActiveKapacitor = (source: Source, sources: Source[]): Kapacitor => {
   return activeKapacitor
 }
 
+const syncHostnames = (source: Source, kapacitor: Kapacitor) => {
+  if (source && source.url) {
+    const sourceURL = new URL(source.url)
+    const kapacitorURL = new URL(kapacitor.url)
+    if (sourceURL.hostname) {
+      kapacitorURL.hostname = sourceURL.hostname
+      return {...kapacitor, url: kapacitorURL.href}
+    }
+  }
+  return kapacitor
+}
+
 @ErrorHandling
 class KapacitorStep extends Component<Props, State> {
   public static defaultProps: Partial<Props> = {
@@ -66,13 +78,15 @@ class KapacitorStep extends Component<Props, State> {
   constructor(props: Props) {
     super(props)
 
-    const kapacitor = props.showNewKapacitor
-      ? DEFAULT_KAPACITOR
-      : getActiveKapacitor(props.source, props.sources) || DEFAULT_KAPACITOR
+    let kapacitor = getActiveKapacitor(props.source, props.sources)
 
-    this.state = {
-      kapacitor,
+    if (!kapacitor || props.showNewKapacitor) {
+      kapacitor = DEFAULT_KAPACITOR
     }
+
+    kapacitor = syncHostnames(props.source, kapacitor)
+
+    this.state = {kapacitor}
   }
 
   public next = async () => {

ui/src/sources/components/SourceStep.tsx

@@ -107,6 +107,7 @@ class SourceStep extends PureComponent<Props, State> {
           label="Connection URL"
           onChange={this.onChangeInput('url')}
           valueModifier={this.URLModifier}
+          onSubmit={this.syncHostnames}
         />
         <WizardTextInput
           value={source.name}
@@ -206,6 +207,20 @@ class SourceStep extends PureComponent<Props, State> {
     setError(false)
   }
 
+  private syncHostnames = (sourceURLstring: string) => {
+    if (this.isEnterprise) {
+      if (sourceURLstring) {
+        const sourceURL = new URL(sourceURLstring)
+        const {source} = this.state
+        const metaserviceURL = new URL(source.metaUrl || DEFAULT_SOURCE.metaUrl)
+        if (sourceURL.hostname) {
+          metaserviceURL.hostname = sourceURL.hostname
+          this.onChangeInput('metaUrl')(metaserviceURL.href)
+        }
+      }
+    }
+  }
+
   private get isNewSource(): boolean {
     return _.isNull(this.props.source)
   }