Merge pull request #6714 from skateman/helper-password

Implement helperText on the PasswordField component
ManageIQ · Feb 26, 2020 · 24fc2be · 24fc2be
2 parents 6c1f3bc + 73b2bcd
commit 24fc2be
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/app/javascript/components/async-credentials/password-field.jsx b/app/javascript/components/async-credentials/password-field.jsx
@@ -1,4 +1,5 @@
 import React, { useState, useContext, Fragment } from 'react';
+import { HelpBlock } from 'patternfly-react';
 import PropTypes from 'prop-types';
 import {
   Button,
@@ -19,6 +20,7 @@ const PasswordField = ({
   validate,
   cancelEditLabel,
   changeEditLabel,
+  helperText,
   ...rest
 }) => {
   const { name: secretKey, edit } = useContext(PasswordContext);
@@ -62,6 +64,7 @@ const PasswordField = ({
               <Button type="button" onClick={() => setEditMode(editMode => !editMode)}>{changeEditLabel}</Button>
             </InputGroup.Button>
           </InputGroup>
+          { helperText && <HelpBlock>{ helperText }</HelpBlock> }
         </FormGroup>
       )}
       {!edit && formOptions.renderForm([secretField], formOptions)}
@@ -78,13 +81,15 @@ PasswordField.propTypes = {
   changeEditLabel: PropTypes.string,
   isDisabled: PropTypes.bool,
   validate: PropTypes.func,
+  helperText: PropTypes.string,
 };
 
 PasswordField.defaultProps = {
   cancelEditLabel: __('Cancel'),
   changeEditLabel: __('Change'),
   isDisabled: false,
   validate: undefined,
+  helperText: undefined,
 };
 
 export default PasswordField;