Merge pull request #23331 from letsgoawaydev/ui-login-spacing-fix

Update login overlay appearance to match new designs

osu.Game.Tests/Visual/Menus/TestSceneLoginOverlay.cs

@@ -0,0 +1,89 @@
+// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
+// See the LICENCE file in the repository root for full licence text.
+
+using System.Linq;
+using NUnit.Framework;
+using osu.Framework.Allocation;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Testing;
+using osu.Game.Graphics.UserInterface;
+using osu.Game.Online.API;
+using osu.Game.Overlays;
+using osu.Game.Users.Drawables;
+using osuTK.Input;
+
+namespace osu.Game.Tests.Visual.Menus
+{
+    [TestFixture]
+    public partial class TestSceneLoginOverlay : OsuManualInputManagerTestScene
+    {
+        private LoginOverlay loginOverlay = null!;
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            Child = loginOverlay = new LoginOverlay
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+            };
+        }
+
+        [SetUpSteps]
+        public void SetUpSteps()
+        {
+            AddStep("show login overlay", () => loginOverlay.Show());
+        }
+
+        [Test]
+        public void TestLoginSuccess()
+        {
+            AddStep("logout", () => API.Logout());
+
+            AddStep("enter password", () => loginOverlay.ChildrenOfType<OsuPasswordTextBox>().First().Text = "password");
+            AddStep("submit", () => loginOverlay.ChildrenOfType<OsuButton>().First(b => b.Text.ToString() == "Sign in").TriggerClick());
+        }
+
+        [Test]
+        public void TestLoginFailure()
+        {
+            AddStep("logout", () =>
+            {
+                API.Logout();
+                ((DummyAPIAccess)API).FailNextLogin();
+            });
+
+            AddStep("enter password", () => loginOverlay.ChildrenOfType<OsuPasswordTextBox>().First().Text = "password");
+            AddStep("submit", () => loginOverlay.ChildrenOfType<OsuButton>().First(b => b.Text.ToString() == "Sign in").TriggerClick());
+        }
+
+        [Test]
+        public void TestLoginConnecting()
+        {
+            AddStep("logout", () =>
+            {
+                API.Logout();
+                ((DummyAPIAccess)API).PauseOnConnectingNextLogin();
+            });
+
+            AddStep("enter password", () => loginOverlay.ChildrenOfType<OsuPasswordTextBox>().First().Text = "password");
+            AddStep("submit", () => loginOverlay.ChildrenOfType<OsuButton>().First(b => b.Text.ToString() == "Sign in").TriggerClick());
+        }
+
+        [Test]
+        public void TestClickingOnFlagClosesOverlay()
+        {
+            AddStep("logout", () => API.Logout());
+            AddStep("enter password", () => loginOverlay.ChildrenOfType<OsuPasswordTextBox>().First().Text = "password");
+            AddStep("submit", () => loginOverlay.ChildrenOfType<OsuButton>().First(b => b.Text.ToString() == "Sign in").TriggerClick());
+
+            AddStep("click on flag", () =>
+            {
+                InputManager.MoveMouseTo(loginOverlay.ChildrenOfType<UpdateableFlag>().First());
+                InputManager.Click(MouseButton.Left);
+            });
+            AddAssert("login overlay is hidden", () => loginOverlay.State.Value == Visibility.Hidden);
+        }
+    }
+}

osu.Game/Online/API/DummyAPIAccess.cs

@@ -1,8 +1,6 @@
 // Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
 // See the LICENCE file in the repository root for full licence text.
 
-#nullable disable
-
 using System;
 using System.Threading;
 using System.Threading.Tasks;
@@ -45,17 +43,18 @@ public partial class DummyAPIAccess : Component, IAPIProvider
 
         public int APIVersion => int.Parse(DateTime.Now.ToString("yyyyMMdd"));
 
-        public Exception LastLoginError { get; private set; }
+        public Exception? LastLoginError { get; private set; }
 
         /// <summary>
         /// Provide handling logic for an arbitrary API request.
         /// Should return true is a request was handled. If null or false return, the request will be failed with a <see cref="NotSupportedException"/>.
         /// </summary>
-        public Func<APIRequest, bool> HandleRequest;
+        public Func<APIRequest, bool>? HandleRequest;
 
         private readonly Bindable<APIState> state = new Bindable<APIState>(APIState.Online);
 
         private bool shouldFailNextLogin;
+        private bool stayConnectingNextLogin;
 
         /// <summary>
         /// The current connectivity state of the API.
@@ -94,6 +93,12 @@ public void Login(string username, string password)
         {
             state.Value = APIState.Connecting;
 
+            if (stayConnectingNextLogin)
+            {
+                stayConnectingNextLogin = false;
+                return;
+            }
+
             if (shouldFailNextLogin)
             {
                 LastLoginError = new APIException("Not powerful enough to login.", new ArgumentException(nameof(shouldFailNextLogin)));
@@ -121,11 +126,11 @@ public void Logout()
             LocalUser.Value = new GuestUser();
         }
 
-        public IHubClientConnector GetHubConnector(string clientName, string endpoint, bool preferMessagePack) => null;
+        public IHubClientConnector? GetHubConnector(string clientName, string endpoint, bool preferMessagePack) => null;
 
         public NotificationsClientConnector GetNotificationsConnector() => new PollingNotificationsClientConnector(this);
 
-        public RegistrationRequest.RegistrationRequestErrors CreateAccount(string email, string username, string password)
+        public RegistrationRequest.RegistrationRequestErrors? CreateAccount(string email, string username, string password)
         {
             Thread.Sleep(200);
             return null;
@@ -137,8 +142,16 @@ public RegistrationRequest.RegistrationRequestErrors CreateAccount(string email,
         IBindableList<APIUser> IAPIProvider.Friends => Friends;
         IBindable<UserActivity> IAPIProvider.Activity => Activity;
 
+        /// <summary>
+        /// During the next simulated login, the process will fail immediately.
+        /// </summary>
         public void FailNextLogin() => shouldFailNextLogin = true;
 
+        /// <summary>
+        /// During the next simulated login, the process will pause indefinitely at "connecting".
+        /// </summary>
+        public void PauseOnConnectingNextLogin() => stayConnectingNextLogin = true;
+
         protected override void Dispose(bool isDisposing)
         {
             base.Dispose(isDisposing);

osu.Game/Overlays/Login/LoginForm.cs

@@ -11,6 +11,7 @@
 using osu.Game.Configuration;
 using osu.Game.Graphics;
 using osu.Game.Graphics.Containers;
+using osu.Game.Graphics.Sprites;
 using osu.Game.Graphics.UserInterface;
 using osu.Game.Online.API;
 using osu.Game.Overlays.Settings;
@@ -42,33 +43,50 @@ private void performLogin()
         [BackgroundDependencyLoader(permitNulls: true)]
         private void load(OsuConfigManager config, AccountCreationOverlay accountCreation)
         {
-            Direction = FillDirection.Vertical;
-            Spacing = new Vector2(0, 5);
-            AutoSizeAxes = Axes.Y;
             RelativeSizeAxes = Axes.X;
+            AutoSizeAxes = Axes.Y;
+            Direction = FillDirection.Vertical;
+            Spacing = new Vector2(0, SettingsSection.ITEM_SPACING);
 
             ErrorTextFlowContainer errorText;
             LinkFlowContainer forgottenPasswordLink;
 
             Children = new Drawable[]
             {
-                username = new OsuTextBox
-                {
-                    PlaceholderText = UsersStrings.LoginUsername.ToLower(),
-                    RelativeSizeAxes = Axes.X,
-                    Text = api.ProvidedUsername,
-                    TabbableContentContainer = this
-                },
-                password = new OsuPasswordTextBox
-                {
-                    PlaceholderText = UsersStrings.LoginPassword.ToLower(),
-                    RelativeSizeAxes = Axes.X,
-                    TabbableContentContainer = this,
-                },
-                errorText = new ErrorTextFlowContainer
+                new FillFlowContainer
                 {
                     RelativeSizeAxes = Axes.X,
                     AutoSizeAxes = Axes.Y,
+                    Padding = new MarginPadding { Horizontal = SettingsPanel.CONTENT_MARGINS },
+                    Direction = FillDirection.Vertical,
+                    Spacing = new Vector2(0f, SettingsSection.ITEM_SPACING),
+                    Children = new Drawable[]
+                    {
+                        new OsuSpriteText
+                        {
+                            Text = LoginPanelStrings.Account.ToUpper(),
+                            Font = OsuFont.GetFont(weight: FontWeight.Bold),
+                        },
+                        username = new OsuTextBox
+                        {
+                            PlaceholderText = UsersStrings.LoginUsername.ToLower(),
+                            RelativeSizeAxes = Axes.X,
+                            Text = api.ProvidedUsername,
+                            TabbableContentContainer = this
+                        },
+                        password = new OsuPasswordTextBox
+                        {
+                            PlaceholderText = UsersStrings.LoginPassword.ToLower(),
+                            RelativeSizeAxes = Axes.X,
+                            TabbableContentContainer = this,
+                        },
+                        errorText = new ErrorTextFlowContainer
+                        {
+                            RelativeSizeAxes = Axes.X,
+                            AutoSizeAxes = Axes.Y,
+                            Alpha = 0,
+                        },
+                    },
                 },
                 new SettingsCheckbox
                 {
@@ -82,7 +100,7 @@ private void load(OsuConfigManager config, AccountCreationOverlay accountCreatio
                 },
                 forgottenPasswordLink = new LinkFlowContainer
                 {
-                    Padding = new MarginPadding { Left = SettingsPanel.CONTENT_MARGINS },
+                    Padding = new MarginPadding { Horizontal = SettingsPanel.CONTENT_MARGINS },
                     RelativeSizeAxes = Axes.X,
                     AutoSizeAxes = Axes.Y,
                 },
@@ -120,7 +138,10 @@ private void load(OsuConfigManager config, AccountCreationOverlay accountCreatio
             password.OnCommit += (_, _) => performLogin();
 
             if (api.LastLoginError?.Message is string error)
+            {
+                errorText.Alpha = 1;
                 errorText.AddErrors(new[] { error });
+            }
         }
 
         public override bool AcceptsFocus => true;