Merge pull request #399 from keycloakify/fix/usernameEditDisabled-usernameHidden

fix: usernameEditDisabled renamed to usernameHidden

src/login/kcContext/KcContext.ts

@@ -145,7 +145,7 @@ export declare namespace KcContext {
             rememberMe?: string;
             password?: string;
         };
-        usernameEditDisabled: boolean;
+        usernameHidden?: boolean;
         social: {
             displayInfo: boolean;
             providers?: {

src/login/kcContext/kcContextMocks.ts

@@ -264,7 +264,7 @@ export const kcContextMocks = [
         "social": {
             "displayInfo": true
         },
-        "usernameEditDisabled": false,
+        "usernameHidden": false,
         "login": {},
         "registrationDisabled": false
     }),

src/login/pages/Login.tsx

@@ -14,7 +14,7 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
         classes
     });
 
-    const { social, realm, url, usernameEditDisabled, login, auth, registrationDisabled } = kcContext;
+    const { social, realm, url, usernameHidden, login, auth, registrationDisabled } = kcContext;
 
     const { msg, msgStr } = i18n;
 
@@ -66,7 +66,8 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                     {realm.password && (
                         <form id="kc-form-login" onSubmit={onSubmit} action={url.loginAction} method="post">
                             <div className={getClassName("kcFormGroupClass")}>
-                                {(() => {
+                                {!usernameHidden &&
+                                    (() => {
                                         const label = !realm.loginWithEmailAllowed
                                             ? "username"
                                             : realm.registrationEmailAsUsername
@@ -90,12 +91,8 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                                                     name={autoCompleteHelper}
                                                     defaultValue={login.username ?? ""}
                                                     type="text"
-                                                {...(usernameEditDisabled
-                                                    ? { "disabled": true }
-                                                    : {
-                                                          "autoFocus": true,
-                                                          "autoComplete": "off"
-                                                      })}
+                                                    autoFocus={true}
+                                                    autoComplete="off"
                                                 />
                                             </>
                                         );
@@ -116,7 +113,7 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                             </div>
                             <div className={clsx(getClassName("kcFormGroupClass"), getClassName("kcFormSettingClass"))}>
                                 <div id="kc-form-options">
-                                    {realm.rememberMe && !usernameEditDisabled && (
+                                    {realm.rememberMe && !usernameHidden && (
                                         <div className="checkbox">
                                             <label>
                                                 <input

stories/login/pages/Login.stories.tsx

@@ -75,7 +75,7 @@ export const WithImmutablePresetUsername = () => (
     <PageStory
         kcContext={{
             login: { username: "max.mustermann@mail.com" },
-            usernameEditDisabled: true
+            usernameHidden: true
         }}
     />
 );