From 463bee5d4ed00e3a5ec7f022a54aa2beb0d0b7d8 Mon Sep 17 00:00:00 2001
From: Marek Libra <marek.libra@gmail.com>
Date: Mon, 29 Jun 2020 15:19:08 +0200
Subject: [PATCH 1/3] Add example of base DNS domain

---
 src/components/ui/formik/validationSchemas.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/formik/validationSchemas.ts b/src/components/ui/formik/validationSchemas.ts
index 8efd421bf1..239bb88bcf 100644
--- a/src/components/ui/formik/validationSchemas.ts
+++ b/src/components/ui/formik/validationSchemas.ts
@@ -90,7 +90,7 @@ export const ipBlockValidationSchema = Yup.string().matches(IP_ADDRESS_BLOCK_REG
 });
 
 export const dnsNameValidationSchema = Yup.string().matches(DNS_NAME_REGEX, {
-  message: 'Value "${value}" is not valid DNS name.', // eslint-disable-line no-template-curly-in-string
+  message: 'Value "${value}" is not valid DNS name. Example: basedomain.example.com', // eslint-disable-line no-template-curly-in-string
   excludeEmptyString: true,
 });
 

From 20abc5dc919a9e75a252d09d1468011a59d335b4 Mon Sep 17 00:00:00 2001
From: Marek Libra <marek.libra@gmail.com>
Date: Tue, 30 Jun 2020 09:24:59 +0200
Subject: [PATCH 2/3] Add base DNS domain placeholder and hint

---
 .../BasicNetworkFields.tsx                     | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/clusterConfiguration/BasicNetworkFields.tsx b/src/components/clusterConfiguration/BasicNetworkFields.tsx
index f561342544..dcc711ca61 100644
--- a/src/components/clusterConfiguration/BasicNetworkFields.tsx
+++ b/src/components/clusterConfiguration/BasicNetworkFields.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { HostSubnets, ClusterConfigurationValues } from '../../types/clusters';
 import { InputField, SelectField } from '../ui/formik';
-import { useFormikContext } from 'formik';
+import { useFormikContext, useField } from 'formik';
 
 type BasicNetworkFieldsProps = {
   hostSubnets: HostSubnets;
@@ -9,12 +9,26 @@ type BasicNetworkFieldsProps = {
 
 const BasicNetworkFields: React.FC<BasicNetworkFieldsProps> = ({ hostSubnets }) => {
   const { validateField } = useFormikContext<ClusterConfigurationValues>();
+  const [clusterName] = useField({ name: 'name' });
+  const [baseDnsField] = useField({ name: 'baseDnsDomain' });
+
+  const baseDnsHelperText = (
+    <>
+      The base domain of the cluster. All DNS records must be sub-domains of this base and include
+      the cluster name. This cannot be changed later. The full cluster address will be:{' '}
+      <strong>
+        {clusterName.value || '[Cluster Name]'}.{baseDnsField.value || '[example.com]'}
+      </strong>
+    </>
+  );
+
   return (
     <>
       <InputField
         label="Base DNS Domain"
         name="baseDnsDomain"
-        helperText="The base domain of the cluster. All DNS records must be sub-domains of this base and include the cluster name."
+        helperText={baseDnsHelperText}
+        placeholder="example.com"
         isRequired
       />
       <SelectField

From 4b479761de2e60dafbb6f3a925559e9f884b7255 Mon Sep 17 00:00:00 2001
From: Marek Libra <marek.libra@gmail.com>
Date: Tue, 30 Jun 2020 09:52:17 +0200
Subject: [PATCH 3/3] Add VIP hint

---
 .../clusterConfiguration/BasicNetworkFields.tsx     | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/clusterConfiguration/BasicNetworkFields.tsx b/src/components/clusterConfiguration/BasicNetworkFields.tsx
index dcc711ca61..85e504a654 100644
--- a/src/components/clusterConfiguration/BasicNetworkFields.tsx
+++ b/src/components/clusterConfiguration/BasicNetworkFields.tsx
@@ -1,27 +1,28 @@
 import React from 'react';
 import { HostSubnets, ClusterConfigurationValues } from '../../types/clusters';
 import { InputField, SelectField } from '../ui/formik';
-import { useFormikContext, useField } from 'formik';
+import { useFormikContext } from 'formik';
 
 type BasicNetworkFieldsProps = {
   hostSubnets: HostSubnets;
 };
 
 const BasicNetworkFields: React.FC<BasicNetworkFieldsProps> = ({ hostSubnets }) => {
-  const { validateField } = useFormikContext<ClusterConfigurationValues>();
-  const [clusterName] = useField({ name: 'name' });
-  const [baseDnsField] = useField({ name: 'baseDnsDomain' });
+  const { validateField, values } = useFormikContext<ClusterConfigurationValues>();
+  const { name: clusterName, baseDnsDomain, hostSubnet } = values;
 
   const baseDnsHelperText = (
     <>
       The base domain of the cluster. All DNS records must be sub-domains of this base and include
       the cluster name. This cannot be changed later. The full cluster address will be:{' '}
       <strong>
-        {clusterName.value || '[Cluster Name]'}.{baseDnsField.value || '[example.com]'}
+        {clusterName || '[Cluster Name]'}.{baseDnsDomain || '[example.com]'}
       </strong>
     </>
   );
 
+  const subnet = hostSubnet ? ` (${hostSubnet})` : '';
+
   return (
     <>
       <InputField
@@ -57,7 +58,7 @@ const BasicNetworkFields: React.FC<BasicNetworkFieldsProps> = ({ hostSubnets })
       <InputField
         label="API Virtual IP"
         name="apiVip"
-        helperText="Virtual IP used to reach the OpenShift cluster API. Make sure that the VIP's are unique and not used by any other device on your network."
+        helperText={`Virtual IP used to reach the OpenShift cluster API. Make sure that the VIP's are unique and not used by any other device on your network${subnet}.`}
         isRequired
         isDisabled={!hostSubnets.length}
       />