From c4d67f489e9845e34a313ed4930c1cd63f58396d Mon Sep 17 00:00:00 2001
From: Ashish Gupta <ashish@getcollate.io>
Date: Fri, 30 Sep 2022 18:07:29 +0530
Subject: [PATCH] Fix UI :- fix  the Password field showing in SSO login
 (#7811)

* Fix the Password field showing in SSO login

* changes as per comments
---
 .../CreateUser/CreateUser.component.tsx       | 198 ++++++++++--------
 1 file changed, 105 insertions(+), 93 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/CreateUser/CreateUser.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/CreateUser/CreateUser.component.tsx
index 5845fac8bad..369e7c76892 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/CreateUser/CreateUser.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/CreateUser/CreateUser.component.tsx
@@ -26,7 +26,7 @@ import { AxiosError } from 'axios';
 import classNames from 'classnames';
 import { isUndefined } from 'lodash';
 import { EditorContentRef } from 'Models';
-import React, { useRef, useState } from 'react';
+import React, { useMemo, useRef, useState } from 'react';
 import { useAuthContext } from '../../authentication/auth-provider/AuthProvider';
 import { generateRandomPwd } from '../../axiosAPIs/auth-API';
 import { getBotsPagePath, getUsersPagePath } from '../../constants/constants';
@@ -36,6 +36,7 @@ import {
   validEmailRegEx,
 } from '../../constants/regex.constants';
 import { PageLayoutType } from '../../enums/layout.enum';
+import { AuthTypes } from '../../enums/signin.enum';
 import { CreatePasswordGenerator } from '../../enums/user.enum';
 import {
   CreatePasswordType,
@@ -109,6 +110,11 @@ const CreateUser = ({
     {} as SSOClientConfig
   );
 
+  const isAuthProviderBasic = useMemo(
+    () => authConfig?.provider === AuthTypes.BASIC,
+    [authConfig]
+  );
+
   const slashedBreadcrumbList = [
     {
       name: forceBot ? 'Bots' : 'Users',
@@ -775,101 +781,107 @@ const CreateUser = ({
             <RichTextEditor initialValue={description} ref={markdownRef} />
           </Form.Item>
 
-          <Radio.Group
-            name="passwordGenerator"
-            value={passwordGenerator}
-            onChange={handleOnChange}>
-            <Radio value={CreatePasswordGenerator.AutomatciGenerate}>
-              Automatic Generate
-            </Radio>
-            <Radio value={CreatePasswordGenerator.CreatePassword}>
-              Create Password
-            </Radio>
-          </Radio.Group>
+          {isAuthProviderBasic && (
+            <>
+              <Radio.Group
+                name="passwordGenerator"
+                value={passwordGenerator}
+                onChange={handleOnChange}>
+                <Radio value={CreatePasswordGenerator.AutomatciGenerate}>
+                  Automatic Generate
+                </Radio>
+                <Radio value={CreatePasswordGenerator.CreatePassword}>
+                  Create Password
+                </Radio>
+              </Radio.Group>
 
-          {passwordGenerator === CreatePasswordGenerator.CreatePassword ? (
-            <div className="m-t-sm">
-              <Form.Item
-                label="Password"
-                name="password"
-                rules={[
-                  {
-                    required: true,
-                  },
-                  {
-                    pattern: passwordRegex,
-                    message: passwordErrorMessage,
-                  },
-                ]}>
-                <Input.Password
-                  name="password"
-                  placeholder="Enter a Password"
-                  value={password}
-                  onChange={handleOnChange}
-                />
-              </Form.Item>
+              {passwordGenerator === CreatePasswordGenerator.CreatePassword ? (
+                <div className="m-t-sm">
+                  <Form.Item
+                    label="Password"
+                    name="password"
+                    rules={[
+                      {
+                        required: true,
+                      },
+                      {
+                        pattern: passwordRegex,
+                        message: passwordErrorMessage,
+                      },
+                    ]}>
+                    <Input.Password
+                      name="password"
+                      placeholder="Enter a Password"
+                      value={password}
+                      onChange={handleOnChange}
+                    />
+                  </Form.Item>
 
-              <Form.Item
-                label="Confirm Password"
-                name="confirmPassword"
-                rules={[
-                  {
-                    validator: (_, value) => {
-                      if (value !== password) {
-                        return Promise.reject("Password doesn't match");
+                  <Form.Item
+                    label="Confirm Password"
+                    name="confirmPassword"
+                    rules={[
+                      {
+                        validator: (_, value) => {
+                          if (value !== password) {
+                            return Promise.reject("Password doesn't match");
+                          }
+
+                          return Promise.resolve();
+                        },
+                      },
+                    ]}>
+                    <Input.Password
+                      name="confirmPassword"
+                      placeholder="Confirm Password"
+                      value={confirmPassword}
+                      onChange={handleOnChange}
+                    />
+                  </Form.Item>
+                </div>
+              ) : (
+                <div className="m-t-sm">
+                  <Form.Item
+                    label="Generated Password"
+                    name="generatedPassword"
+                    rules={[
+                      {
+                        required: true,
+                      },
+                    ]}>
+                    <Input
+                      readOnly
+                      addonAfter={
+                        <div className="flex-center w-16">
+                          <div
+                            className="w-8 h-7 flex-center cursor-pointer"
+                            data-testid="password-generator"
+                            onClick={generateRandomPassword}>
+                            {isPasswordGenerating ? (
+                              <Loader size="small" type="default" />
+                            ) : (
+                              <SVGIcons
+                                alt="generate"
+                                icon={Icons.SYNC}
+                                width="16"
+                              />
+                            )}
+                          </div>
+
+                          <div className="w-8 h-7 flex-center">
+                            <CopyToClipboardButton
+                              copyText={generatedPassword}
+                            />
+                          </div>
+                        </div>
                       }
-
-                      return Promise.resolve();
-                    },
-                  },
-                ]}>
-                <Input.Password
-                  name="confirmPassword"
-                  placeholder="Confirm Password"
-                  value={confirmPassword}
-                  onChange={handleOnChange}
-                />
-              </Form.Item>
-            </div>
-          ) : (
-            <div className="m-t-sm">
-              <Form.Item
-                label="Generated Password"
-                name="generatedPassword"
-                rules={[
-                  {
-                    required: true,
-                  },
-                ]}>
-                <Input
-                  readOnly
-                  addonAfter={
-                    <div className="flex-center w-16">
-                      <div
-                        className="w-8 h-7 flex-center cursor-pointer"
-                        data-testid="password-generator"
-                        onClick={generateRandomPassword}>
-                        {isPasswordGenerating ? (
-                          <Loader size="small" type="default" />
-                        ) : (
-                          <SVGIcons
-                            alt="generate"
-                            icon={Icons.SYNC}
-                            width="16"
-                          />
-                        )}
-                      </div>
-
-                      <div className="w-8 h-7 flex-center">
-                        <CopyToClipboardButton copyText={generatedPassword} />
-                      </div>
-                    </div>
-                  }
-                  name="generatedPassword"
-                  value={generatedPassword}
-                />
-              </Form.Item>
-            </div>
+                      name="generatedPassword"
+                      value={generatedPassword}
+                    />
+                  </Form.Item>
+                </div>
+              )}
+            </>
           )}
 
           {!forceBot && (