Skip to content

Prevent <ProfileHeaderHandle /> from breaking out of its parent view#6574

Merged
mozzius merged 1 commit into
bluesky-social:mainfrom
HorusGoul:issue-6569/fix-long-handles-breaking-settings-ui
Nov 20, 2024
Merged

Prevent <ProfileHeaderHandle /> from breaking out of its parent view#6574
mozzius merged 1 commit into
bluesky-social:mainfrom
HorusGoul:issue-6569/fix-long-handles-breaking-settings-ui

Conversation

@HorusGoul
Copy link
Copy Markdown
Contributor

@HorusGoul HorusGoul commented Nov 20, 2024

What changes?
Sets a max width of 100% for the ProfileHeaderHandle component to prevent it from overflowing in views like Settings.

Fixes #6569.

How to test
The easiest way is to clone the branch, replace this line with a very long handle and visualize the changes:
https://github.com/HorusGoul/bsky-social-app/blob/a7aaeaec11dba45d1c1654b2cd6c5ed344d669bc/src/screens/Profile/Header/Handle.tsx#L52

I used this handle: @verylonghandlewithsomanycharacters.thatitmightbreaktheblueskyimplementationforhandles.orletsseehowthisshowsupintheuilol.hibtwandimsosorry.therearestillsomanymorecharacterstofillidk.imightaswellgototwohundredorsomethinglikethat.bye.horus.dev

Screenshot showing the fix
The issue seems to be present on Web but not on Android. I can't check iOS at the moment.

Before (production) After (this branch, localhost)
image image
image image

Testing for both short and long handles:

Settings:
image
image

Profile:
image
image

Labeler profile:
image
image

@HorusGoul HorusGoul marked this pull request as ready for review November 20, 2024 18:42
Copy link
Copy Markdown
Member

@mozzius mozzius left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lovely, thank you!

@mozzius mozzius merged commit 6605970 into bluesky-social:main Nov 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Very long handles break the new Settings UI

2 participants