Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add follow button to feed item avatar #3560

Merged
merged 20 commits into from
May 31, 2024
Merged

Add follow button to feed item avatar #3560

merged 20 commits into from
May 31, 2024

Conversation

mozzius
Copy link
Member

@mozzius mozzius commented Apr 15, 2024

CleanShot 2024-05-29 at 16 21 12@2x
CleanShot 2024-05-29 at 16 21 30@2x

Copy link

github-actions bot commented Apr 15, 2024

Old size New size Diff
7.23 MB 7.23 MB 0 B (0.00%)

@surfdude29
Copy link
Contributor

surfdude29 commented Apr 16, 2024

Does this mean there would be a mini follow button as part of every avatar on every feed (for users that you don't already follow)? Or have I misunderstood? 🤔

If I have understood correctly, I feel like this will generate an awful lot of unintended follows when people tap or click it by mistake, without actually meaning to follow the user in question.

Also, again just my personal opinion, but I feel like this will make the Bluesky interface look rather ugly and that it will be poorly received by users 😕

@surfdude29
Copy link
Contributor

As an alternative suggestion, what about adding a bottom sheet that opens when long-pressing the user's avatar? This could show exactly the same content as the hover cards on web do.

To follow a user, you would simply long-press the pfp and then tap the Follow button.

@pfrazee
Copy link
Collaborator

pfrazee commented Apr 16, 2024

If I have understood correctly, I feel like this will generate an awful lot of unintended follows when people tap or click it by mistake, without actually meaning to follow the user in question.

We're talking about how to handle this properly. My personal preference would be an inline dropdown (even on mobile) that has "Go to profile" and "Follow" as options. We would need to cook up that UI behavior.

As an alternative suggestion, what about adding a bottom sheet that opens when long-pressing the user's avatar? This could show exactly the same content as the hover cards on web do.

Part of the goal is also to introduce a visual indicator of whether you're following the person.

@surfdude29
Copy link
Contributor

Thank you for the clarification on what's planned and some of the thinking behind it.

@pfrazee
Copy link
Collaborator

pfrazee commented Apr 16, 2024

Sure. More than happy to hear more suggestions or reactions to it. Don't want to do something folks won't be into.

@pfrazee
Copy link
Collaborator

pfrazee commented Apr 19, 2024

A couple of tweaks:

Smaller indicator Confirmation modal
CleanShot 2024-04-19 at 13 33 07@2x CleanShot 2024-04-19 at 13 34 09@2x

We're also going to put this behind a feature gate so we can test it internally and then do an experimental rollout.

Copy link

render bot commented Apr 19, 2024

@surfdude29
Copy link
Contributor

A couple of tweaks:

I think having a follow confirmation is essential, so thanks for adding that 🙏

And the smaller, less obtrusive indicator is welcome too.

We're also going to put this behind a feature gate so we can test it internally and then do an experimental rollout.

That's a good way to proceed 👍

@surfdude29
Copy link
Contributor

Your Render PR Server URL is https://social-app-pr-3560.onrender.com.

Should I be able to test this out by logging in here? When I do, it looks the same as Bluesky normally does, there's no indicator on pfps of users I don't follow.

Or maybe because it's behind a feature gate that doesn't work for this PR? 🤔

@mozzius
Copy link
Member Author

mozzius commented Apr 21, 2024

Should I be able to test this out by logging in here? When I do, it looks the same as Bluesky normally does, there's no indicator on pfps of users I don't follow.

Or maybe because it's behind a feature gate that doesn't work for this PR? 🤔

This PR is iOS/Android only

@surfdude29
Copy link
Contributor

Should I be able to test this out by logging in here? When I do, it looks the same as Bluesky normally does, there's no indicator on pfps of users I don't follow.
Or maybe because it's behind a feature gate that doesn't work for this PR? 🤔

This PR is iOS/Android only

That would explain it 😅

@mozzius mozzius marked this pull request as ready for review April 24, 2024 22:29
@mozzius
Copy link
Member Author

mozzius commented Apr 24, 2024

Also added it to post thread items - only the secondary ones, since the main one will have a big "follow" button

Threaded replies do not have it because they're too small

Simulator Screenshot - iPhone 15 - 2024-04-24 at 23 28 09

mozzius and others added 3 commits April 25, 2024 18:04
* origin/main: (392 commits)
  Remove old onboarding (#4224)
  Replace getAgent() with reading agent (#4243)
  Bump 1.85.0 (#4237)
  bump iOS target to `14.0` (#4238)
  set `onEndReachedThreshold` to `2` for notifications (#4235)
  Run intl extract (#4217)
  Updated Japanese translation (#4144)
  Updated Chinese translation (#4147)
  Update Korean localization (#4148)
  Update catalan messages.po (#4149)
  Update Indonesian translation (#4165)
  [🐴] update convo list from message bus (#4189)
  Recover from initial failed firehose state (#4211)
  Move ALT indicator right and shrink it a bit (#4213)
  Make sure failed messages enter error state (#4210)
  [🐴] Don't submit the message on return press when on a phone (web input) (#4203)
  Include feedContext in DOM as data- (#4206)
  Improve moderation behaviors: show alert/inform sources and improve UX around threads (#3677)
  Privileged app passwords (#4200)
  [🐴] Overfetch follow for default new dialog state (#4205)
  ...
},
]

return gate('show_avi_follow_button') && hasSession ? (
Copy link
Contributor

Choose a reason for hiding this comment

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

note this generally should be the other way around — we should delay calling gate until we have to make a decision. so it should be the last check

Copy link
Member

Choose a reason for hiding this comment

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

Ah ok yeah good call

@gaearon gaearon merged commit 8569e2e into main May 31, 2024
5 of 6 checks passed
@gaearon gaearon deleted the samuel/pfp-follow-btn branch May 31, 2024 04:05
estrattonbailey added a commit that referenced this pull request May 31, 2024
* origin/main: (51 commits)
  [🐴] Option to share via chat in post dropdown (#4231)
  [🐴] Record message (#4230)
  [🐴] send record via link in text (Record DMs - base PR) (#4227)
  Use new icons on notifications screen (#4299)
  Composer - fix modals, and other tweaks (#4298)
  Shadows (#4265)
  Change many border widths from `1` to `hairlineWidth` (#4294)
  Add follow button to feed item avatar (#3560)
  Disable non-deterministic flaky test (#4295)
  Don't log downsample warning when unnecessary (#4291)
  [Statsig] Sample noisy events (#4288)
  Bump FontAwesome (#4285)
  Fix scrolling for labeler profiles (#4286)
  Reduce Threadgate button size (#4287)
  put dropdown in fullscreenoverlay on iOS (#4284)
  play haptics before closing modal (#4283)
  match loadmore position to fab (#4280)
  Composer - Use sheet presentation on iOS (#4278)
  don't maintain position whenever there are no parents (#4277)
  Fix native translations on iOS 17.5.1 (#4282)
  ...
estrattonbailey added a commit that referenced this pull request May 31, 2024
* origin/main: (37 commits)
  fix accessibility label in notifications (#4305)
  [🐴] add emoji multiplier prop to RichText and bump it up for DMs (#4229)
  Tweak avi follow button styles (#4304)
  [🐴] Embed backwards compat (#4302)
  [🐴] Add labels to chats (#4293)
  [🐴] Option to share via chat in post dropdown (#4231)
  [🐴] Record message (#4230)
  [🐴] send record via link in text (Record DMs - base PR) (#4227)
  Use new icons on notifications screen (#4299)
  Composer - fix modals, and other tweaks (#4298)
  Shadows (#4265)
  Change many border widths from `1` to `hairlineWidth` (#4294)
  Add follow button to feed item avatar (#3560)
  Disable non-deterministic flaky test (#4295)
  Don't log downsample warning when unnecessary (#4291)
  [Statsig] Sample noisy events (#4288)
  Bump FontAwesome (#4285)
  Fix scrolling for labeler profiles (#4286)
  Reduce Threadgate button size (#4287)
  put dropdown in fullscreenoverlay on iOS (#4284)
  ...
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.

5 participants