message: everything is a component
diff: @@ -9,10 +9,10 @@ import { VMSettingsField } from '../../types';
  import { getPlaceholder } from '../../utils/renderable-field-utils';
  import { iGet } from '../../../../utils/immutable';
  -export const ProvisionSourceComponent: React.FC<ProvisionSourceComponentProps> = React.memo(
  - ({ provisionSourceField, onChange, goToStorageStep, goToNetworkingStep }) => {
  - const provisionSourceValue = iGetFieldValue(provisionSourceField);
  - const sources = iGet(provisionSourceField, 'sources');
  +const ProvisionSourceDiskHelpMsg: React.FC<ProvisionSourceDiskHelpMsgProps> = ({
  + provisionSourceValue,
  + goToStorageStep,
  +}) => {
  const storageBtn = (
  <Button
  isDisabled={!goToStorageStep}
  @@ -23,16 +23,6 @@ export const ProvisionSourceComponent: React.FC<ProvisionSourceComponentProps> =
  <strong>Storage</strong>
  </Button>
  );
  - const networkBtn = (
  - <Button
  - isDisabled={!goToNetworkingStep}
  - isInline
  - onClick={goToNetworkingStep}
  - variant={ButtonVariant.link}
  - >
  - <strong>Networking</strong>
  - </Button>
  - );
  const getStorageMsg = React.useCallback(() => {
  switch (provisionSourceValue) {
  case ProvisionSource.URL.toString():
  @@ -46,16 +36,38 @@ export const ProvisionSourceComponent: React.FC<ProvisionSourceComponentProps> =
  }
  }, [provisionSourceValue, storageBtn]);
  - const provisionSourceDiskHelpMsg = (
  + return (
  <div className="pf-c-form__helper-text" aria-live="polite">
  {getStorageMsg()}
  </div>
  );
  - const provisionSourceNetHelpMsg = (
  +};
  +
  +const ProvisionSourceNetHelpMsg: React.FC<ProvisionSourceNetHelpMsgProps> = ({
  + goToNetworkingStep,
  +}) => {
  + const networkBtn = (
  + <Button
  + isDisabled={!goToNetworkingStep}
  + isInline
  + onClick={goToNetworkingStep}
  + variant={ButtonVariant.link}
  + >
  + <strong>Networking</strong>
  + </Button>
  + );
  +
  + return (
  <div className="pf-c-form__helper-text" aria-live="polite">
  Add a network interface in the {networkBtn} step
  </div>
  );
  +};
  +
  +export const ProvisionSourceComponent: React.FC<ProvisionSourceComponentProps> = React.memo(
  + ({ provisionSourceField, onChange, goToStorageStep, goToNetworkingStep }) => {
  + const provisionSourceValue = iGetFieldValue(provisionSourceField);
  + const sources = iGet(provisionSourceField, 'sources');
  return (
  <FormFieldRow field={provisionSourceField} fieldType={FormFieldType.SELECT}>
  @@ -74,14 +86,29 @@ export const ProvisionSourceComponent: React.FC<ProvisionSourceComponentProps> =
  ProvisionSource.URL.toString(),
  ProvisionSource.CONTAINER.toString(),
  ProvisionSource.DISK.toString(),
  - ].includes(provisionSourceValue) && provisionSourceDiskHelpMsg}
  - {[ProvisionSource.PXE.toString()].includes(provisionSourceValue) &&
  - provisionSourceNetHelpMsg}
  + ].includes(provisionSourceValue) && (
  + <ProvisionSourceDiskHelpMsg
  + provisionSourceValue={provisionSourceValue}
  + goToStorageStep={goToStorageStep}
  + />
  + )}
  + {[ProvisionSource.PXE.toString()].includes(provisionSourceValue) && (
  + <ProvisionSourceNetHelpMsg goToNetworkingStep={goToNetworkingStep} />
  + )}
  </FormFieldRow>
  );
  },
  );
  +type ProvisionSourceDiskHelpMsgProps = {
  + provisionSourceValue: string;
  + goToStorageStep: () => void;
  +};
  +
  +type ProvisionSourceNetHelpMsgProps = {
  + goToNetworkingStep: () => void;
  +};
  +
  type ProvisionSourceComponentProps = {
  provisionSourceField: any;
  onChange: (key: string, value: string | boolean) => void;
  