Ensure elements on Login page are disabled when in-flight (#12895)

Signed-off-by: Michael Telatynski <[email protected]>

Author: t3chguy

src/components/structures/auth/Login.tsx

@@ -485,6 +485,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
                 fragmentAfterLogin={this.props.fragmentAfterLogin}
                 primary={!this.state.flows?.find((flow) => flow.type === "m.login.password")}
                 action={SSOAction.LOGIN}
+                disabled={this.isBusy()}
             />
         );
     };
@@ -558,6 +559,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
                     <ServerPicker
                         serverConfig={this.props.serverConfig}
                         onServerConfigChange={this.props.onServerConfigChange}
+                        disabled={this.isBusy()}
                     />
                     {this.renderLoginComponentForFlows()}
                     {footer}

src/components/views/elements/SSOButtons.tsx

@@ -151,11 +151,20 @@ interface IProps {
     fragmentAfterLogin?: string;
     primary?: boolean;
     action?: SSOAction;
+    disabled?: boolean;
 }
 
 const MAX_PER_ROW = 6;
 
-const SSOButtons: React.FC<IProps> = ({ matrixClient, flow, loginType, fragmentAfterLogin, primary, action }) => {
+const SSOButtons: React.FC<IProps> = ({
+    matrixClient,
+    flow,
+    loginType,
+    fragmentAfterLogin,
+    primary,
+    action,
+    disabled,
+}) => {
     const providers = flow.identity_providers || [];
     if (providers.length < 2) {
         return (
@@ -168,6 +177,7 @@ const SSOButtons: React.FC<IProps> = ({ matrixClient, flow, loginType, fragmentA
                     primary={primary}
                     action={action}
                     flow={flow}
+                    disabled={disabled}
                 />
             </div>
         );

src/components/views/elements/ServerPicker.tsx

@@ -29,6 +29,7 @@ interface IProps {
     title?: string;
     dialogTitle?: string;
     serverConfig: ValidatedServerConfig;
+    disabled?: boolean;
     onServerConfigChange?(config: ValidatedServerConfig): void;
 }
 
@@ -55,7 +56,7 @@ const onHelpClick = (): void => {
     );
 };
 
-const ServerPicker: React.FC<IProps> = ({ title, dialogTitle, serverConfig, onServerConfigChange }) => {
+const ServerPicker: React.FC<IProps> = ({ title, dialogTitle, serverConfig, onServerConfigChange, disabled }) => {
     const disableCustomUrls = SdkConfig.get("disable_custom_urls");
 
     let editBtn;
@@ -68,7 +69,7 @@ const ServerPicker: React.FC<IProps> = ({ title, dialogTitle, serverConfig, onSe
             });
         };
         editBtn = (
-            <AccessibleButton className="mx_ServerPicker_change" kind="link" onClick={onClick}>
+            <AccessibleButton className="mx_ServerPicker_change" kind="link" onClick={onClick} disabled={disabled}>
                 {_t("action|edit")}
             </AccessibleButton>
         );