Fix: hide unsupported login elements (#11185)

* hide unsupported login elements

* Update src/components/structures/auth/Login.tsx

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

src/components/structures/auth/Login.tsx

@@ -392,19 +392,17 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
                     // look for a flow where we understand all of the steps.
                     const supportedFlows = flows.filter(this.isSupportedFlow);
 
-                    if (supportedFlows.length > 0) {
-                        this.setState({
-                            flows: supportedFlows,
-                        });
-                        return;
-                    }
-
-                    // we got to the end of the list without finding a suitable flow.
                     this.setState({
-                        errorText: _t(
+                        flows: supportedFlows,
-                            "This homeserver doesn't offer any login flows which are supported by this client.",
-                        ),
                     });
+
+                    if (supportedFlows.length === 0) {
+                        this.setState({
+                            errorText: _t(
+                                "This homeserver doesn't offer any login flows that are supported by this client.",
+                            ),
+                        });
+                    }
                 },
                 (err) => {
                     this.setState({

src/i18n/strings/en_EN.json

@@ -3569,7 +3569,7 @@
     "General failure": "General failure",
     "This homeserver does not support login using email address.": "This homeserver does not support login using email address.",
     "Failed to perform homeserver discovery": "Failed to perform homeserver discovery",
-    "This homeserver doesn't offer any login flows which are supported by this client.": "This homeserver doesn't offer any login flows which are supported by this client.",
+    "This homeserver doesn't offer any login flows that are supported by this client.": "This homeserver doesn't offer any login flows that are supported by this client.",
     "Syncing…": "Syncing…",
     "Signing In…": "Signing In…",
     "If you've joined lots of rooms, this might take a while": "If you've joined lots of rooms, this might take a while",

test/components/structures/auth/Login-test.tsx

@@ -216,6 +216,38 @@ describe("Login", function () {
         expect(platform.startSingleSignOn.mock.calls[1][0].baseUrl).toBe("https://server2");
     });
 
+    it("should handle updating to a server with no supported flows", async () => {
+        mockClient.loginFlows.mockResolvedValue({
+            flows: [
+                {
+                    type: "m.login.sso",
+                },
+            ],
+        });
+
+        const { container, rerender } = render(getRawComponent());
+        await waitForElementToBeRemoved(() => screen.queryAllByLabelText("Loading…"));
+
+        // update the mock for the new server with no supported flows
+        mockClient.loginFlows.mockResolvedValue({
+            flows: [
+                {
+                    type: "just something weird",
+                },
+            ],
+        });
+        // render with a new server
+        rerender(getRawComponent("https://server2"));
+        await waitForElementToBeRemoved(() => screen.queryAllByLabelText("Loading…"));
+
+        expect(
+            screen.getByText("This homeserver doesn't offer any login flows that are supported by this client."),
+        ).toBeInTheDocument();
+
+        // no sso button because server2 doesnt support sso
+        expect(container.querySelector(".mx_SSOButton")).not.toBeInTheDocument();
+    });
+
     it("should show single Continue button if OIDC MSC3824 compatibility is given by server", async () => {
         mockClient.loginFlows.mockResolvedValue({
             flows: [
@@ -289,7 +321,7 @@ describe("Login", function () {
         await waitForElementToBeRemoved(() => screen.queryAllByLabelText("Loading…"));
 
         expect(
-            screen.getByText("This homeserver doesn't offer any login flows which are supported by this client."),
+            screen.getByText("This homeserver doesn't offer any login flows that are supported by this client."),
         ).toBeInTheDocument();
     });