Provide ability to view password

Signed-off-by: Derek Ho <[email protected]>
derek-ho · May 31, 2024 · 2d4db7b · 2d4db7b
1 parent c41a480
commit 2d4db7b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/public/apps/account/password-reset-panel.tsx b/public/apps/account/password-reset-panel.tsx
@@ -123,6 +123,7 @@ export function PasswordResetPanel(props: PasswordResetPanelProps) {
                 setIsCurrentPasswordInvalid(false);
               }}
               isInvalid={isCurrentPasswordInvalid}
+              type="dual"
             />
           </FormRow>
           <EuiSpacer />
@@ -141,6 +142,7 @@ export function PasswordResetPanel(props: PasswordResetPanelProps) {
                     setIsNewPasswordInvalid(false);
                     setIsRepeatNewPasswordInvalid(repeatNewPassword !== newPassword);
                   }}
+                  type="dual"
                   isInvalid={isNewPasswordInvalid}
                 />
               </FormRow>
@@ -162,6 +164,7 @@ export function PasswordResetPanel(props: PasswordResetPanelProps) {
                 setRepeatNewPassword(value);
                 setIsRepeatNewPasswordInvalid(value !== newPassword);
               }}
+              type="dual"
             />
           </FormRow>
 

diff --git a/public/apps/configuration/utils/password-edit-panel.tsx b/public/apps/configuration/utils/password-edit-panel.tsx
@@ -15,7 +15,7 @@
 
 import React from 'react';
 import { CoreStart } from 'opensearch-dashboards/public';
-import { EuiFieldText, EuiFlexGroup, EuiFlexItem, EuiFormRow, EuiIcon } from '@elastic/eui';
+import { EuiFieldPassword, EuiFlexGroup, EuiFlexItem, EuiFormRow } from '@elastic/eui';
 import { FormRow } from './form-row';
 import { PASSWORD_INSTRUCTION } from '../../apps-constants';
 import { getDashboardsInfo } from '../../../utils/dashboards-info-utils';
@@ -65,10 +65,9 @@ export function PasswordEditPanel(props: {
       <EuiFlexGroup direction="row">
         <EuiFlexItem grow={false}>
           <FormRow headerText="Password" helpText={passwordHelpText}>
-            <EuiFieldText
+            <EuiFieldPassword
               data-test-subj="password"
-              prepend={<EuiIcon type="lock" />}
-              type="password"
+              type="dual"
               onChange={passwordChangeHandler}
             />
           </FormRow>
@@ -82,10 +81,9 @@ export function PasswordEditPanel(props: {
         headerText="Re-enter password"
         helpText="The password must be identical to what you entered above."
       >
-        <EuiFieldText
+        <EuiFieldPassword
           data-test-subj="re-enter-password"
-          prepend={<EuiIcon type="lock" />}
-          type="password"
+          type="dual"
           isInvalid={isRepeatPasswordInvalid}
           onChange={repeatPasswordChangeHandler}
         />