Merge pull request #24782 from ItsShamed/overlays/profile/previous-usernames

Integrate past usernames tooltip to user profile overlay

osu.Game.Tests/Visual/Online/TestSceneUserProfileHeader.cs

@@ -110,5 +110,31 @@ namespace osu.Game.Tests.Visual.Online
                 }
             }, new OsuRuleset().RulesetInfo));
         }
+
+        [Test]
+        public void TestPreviousUsernames()
+        {
+            AddStep("Show user w/ previous usernames", () => header.User.Value = new UserProfileData(new APIUser
+            {
+                Id = 727,
+                Username = "SomeoneIndecisive",
+                CoverUrl = @"https://osu.ppy.sh/images/headers/profile-covers/c1.jpg",
+                Groups = new[]
+                {
+                    new APIUserGroup { Colour = "#EB47D0", ShortName = "DEV", Name = "Developers" },
+                },
+                Statistics = new UserStatistics
+                {
+                    IsRanked = false,
+                    // web will sometimes return non-empty rank history even for unranked users.
+                    RankHistory = new APIRankHistory
+                    {
+                        Mode = @"osu",
+                        Data = Enumerable.Range(2345, 85).ToArray()
+                    },
+                },
+                PreviousUsernames = new[] { "tsrk.", "quoicoubeh", "apagnan", "epita" }
+            }, new OsuRuleset().RulesetInfo));
+        }
     }
 }

osu.Game.Tests/Visual/Online/TestSceneUserProfilePreviousUsernamesDisplay.cs

@@ -5,20 +5,29 @@ using System;
 using NUnit.Framework;
 using osu.Framework.Graphics;
 using osu.Game.Online.API.Requests.Responses;
+using osu.Game.Overlays;
 using osu.Game.Overlays.Profile.Header.Components;
 
 namespace osu.Game.Tests.Visual.Online
 {
     [TestFixture]
-    public partial class TestSceneUserProfilePreviousUsernames : OsuTestScene
+    public partial class TestSceneUserProfilePreviousUsernamesDisplay : OsuTestScene
     {
-        private PreviousUsernames container = null!;
+        private PreviousUsernamesDisplay container = null!;
+        private OverlayColourProvider colourProvider = null!;
 
         [SetUp]
         public void SetUp() => Schedule(() =>
         {
-            Child = container = new PreviousUsernames
+            colourProvider = new OverlayColourProvider(OverlayColourScheme.Pink);
+            Child = new DependencyProvidingContainer
             {
+                Child = container = new PreviousUsernamesDisplay
+                {
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
+                },
+                CachedDependencies = new (Type, object)[] { (typeof(OverlayColourProvider), colourProvider) },
                 Anchor = Anchor.Centre,
                 Origin = Anchor.Centre,
             };

osu.Game/Overlays/Profile/Header/Components/PreviousUsernamesDisplay.cs

@@ -18,12 +18,13 @@ using osuTK;
 
 namespace osu.Game.Overlays.Profile.Header.Components
 {
-    public partial class PreviousUsernames : CompositeDrawable
+    public partial class PreviousUsernamesDisplay : CompositeDrawable
     {
         private const int duration = 200;
         private const int margin = 10;
-        private const int width = 310;
+        private const int width = 300;
         private const int move_offset = 15;
+        private const int base_y_offset = -3; // eye balled to make it look good
 
         public readonly Bindable<APIUser?> User = new Bindable<APIUser?>();
 
@@ -31,14 +32,15 @@ namespace osu.Game.Overlays.Profile.Header.Components
         private readonly Box background;
         private readonly SpriteText header;
 
-        public PreviousUsernames()
+        public PreviousUsernamesDisplay()
         {
             HoverIconContainer hoverIcon;
 
             AutoSizeAxes = Axes.Y;
             Width = width;
             Masking = true;
-            CornerRadius = 5;
+            CornerRadius = 6;
+            Y = base_y_offset;
 
             AddRangeInternal(new Drawable[]
             {
@@ -84,6 +86,9 @@ namespace osu.Game.Overlays.Profile.Header.Components
                                 RelativeSizeAxes = Axes.X,
                                 AutoSizeAxes = Axes.Y,
                                 Direction = FillDirection.Full,
+                                // Prevents the tooltip of having a sudden size reduction and flickering when the text is being faded out.
+                                // Also prevents a potential OnHover/HoverLost feedback loop.
+                                AlwaysPresent = true,
                                 Margin = new MarginPadding { Bottom = margin, Top = margin / 2f }
                             }
                         }
@@ -96,9 +101,9 @@ namespace osu.Game.Overlays.Profile.Header.Components
         }
 
         [BackgroundDependencyLoader]
-        private void load(OsuColour colours)
+        private void load(OverlayColourProvider colours)
         {
-            background.Colour = colours.GreySeaFoamDarker;
+            background.Colour = colours.Background6;
         }
 
         protected override void LoadComplete()
@@ -134,7 +139,7 @@ namespace osu.Game.Overlays.Profile.Header.Components
             text.FadeIn(duration, Easing.OutQuint);
             header.FadeIn(duration, Easing.OutQuint);
             background.FadeIn(duration, Easing.OutQuint);
-            this.MoveToY(-move_offset, duration, Easing.OutQuint);
+            this.MoveToY(base_y_offset - move_offset, duration, Easing.OutQuint);
         }
 
         private void hideContent()
@@ -142,7 +147,7 @@ namespace osu.Game.Overlays.Profile.Header.Components
             text.FadeOut(duration, Easing.OutQuint);
             header.FadeOut(duration, Easing.OutQuint);
             background.FadeOut(duration, Easing.OutQuint);
-            this.MoveToY(0, duration, Easing.OutQuint);
+            this.MoveToY(base_y_offset, duration, Easing.OutQuint);
         }
 
         private partial class HoverIconContainer : Container
@@ -156,7 +161,7 @@ namespace osu.Game.Overlays.Profile.Header.Components
                 {
                     Margin = new MarginPadding { Top = 6, Left = margin, Right = margin * 2 },
                     Size = new Vector2(15),
-                    Icon = FontAwesome.Solid.IdCard,
+                    Icon = FontAwesome.Solid.AddressCard,
                 };
             }
 

osu.Game/Overlays/Profile/Header/TopHeaderContainer.cs

@@ -46,6 +46,7 @@ namespace osu.Game.Overlays.Profile.Header
         private OsuSpriteText userCountryText = null!;
         private GroupBadgeFlow groupBadgeFlow = null!;
         private ToggleCoverButton coverToggle = null!;
+        private PreviousUsernamesDisplay previousUsernamesDisplay = null!;
 
         private Bindable<bool> coverExpanded = null!;
 
@@ -143,6 +144,11 @@ namespace osu.Game.Overlays.Profile.Header
                                                             Anchor = Anchor.CentreLeft,
                                                             Origin = Anchor.CentreLeft,
                                                         },
+                                                        new Container
+                                                        {
+                                                            // Intentionally use a zero-size container, else the fill flow will adjust to (and cancel) the upwards animation.
+                                                            Child = previousUsernamesDisplay = new PreviousUsernamesDisplay(),
+                                                        }
                                                     }
                                                 },
                                                 titleText = new OsuSpriteText
@@ -216,6 +222,7 @@ namespace osu.Game.Overlays.Profile.Header
             titleText.Text = user?.Title ?? string.Empty;
             titleText.Colour = Color4Extensions.FromHex(user?.Colour ?? "fff");
             groupBadgeFlow.User.Value = user;
+            previousUsernamesDisplay.User.Value = user;
         }
 
         private void updateCoverState()