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.

Sign up for GitHub

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

Jump to bottom

Update Reactions component #5370

Closed
2 tasks
daniellekirkwood opened this issue Jan 11, 2022 · 11 comments · Fixed by #6244
Closed
2 tasks

Update Reactions component #5370

daniellekirkwood opened this issue Jan 11, 2022 · 11 comments · Fixed by #6244
Assignees
@gileluard @amshakal
Labels
A-Message-Bubbles Message Bubbles appearance in the Timeline A-Reactions parity-with-android parity-with-web T-Enhancement New features, changes in functionality, performance boosts, user-facing improvements X-Needs-Design May require input from the design team Z-WTF WTF issues: High impact, Low Effort

Comments

@daniellekirkwood
Copy link
Contributor

daniellekirkwood commented Jan 11, 2022 •
edited
Loading

We'd like to improve the reactions component on iOS to be inline with the changes on Android and Web.

Verify or Build in iOS the ability to...

  • Add a reaction from the Reaction row (emoji smiley with plus symbol, see comments)
  • Add "Show all" when there's more than the maximum amount of emojis on a message that opens the bottom sheet

Related Android issues:

figma link

Screenshot 2022-03-08 at 17 04 25
@daniellekirkwood daniellekirkwood added T-Enhancement New features, changes in functionality, performance boosts, user-facing improvements X-Needs-Design May require input from the design team A-Reactions A-Message-Bubbles Message Bubbles appearance in the Timeline labels Jan 11, 2022
@daniellekirkwood daniellekirkwood mentioned this issue Jan 11, 2022
Closed
@daniellekirkwood daniellekirkwood added parity-with-android parity-with-web Z-WTF WTF issues: High impact, Low Effort labels Jan 11, 2022
@pixlwave
Copy link
Member

First one is there:
IMG_CAA68682A6F4-1

Second one exists but expands the visible emoji rather than opening the reactions sheet:
IMG_807F8BA2B626-1 IMG_357B8C6AEEAD-1

@daniellekirkwood
Copy link
Contributor Author

Do we want to expand the emoji or open the action sheet? (This decision would apply to both platforms)

@pixlwave
Copy link
Member

Possibly helpful context: long pressing any reaction will present the reactions history sheet on iOS.

@amshakal
Copy link

Yeah, I think a 'show all' button like you have above will suffice in that case to open up the history sheet. It provides more information than all the emojis listed on the timeline itself.

@daniellekirkwood
Copy link
Contributor Author

Great, so we'll have the history sheet show on clicking Show all.

Also, @pixlwave WRT "the first one", that is only available on long-press and I think the idea is to have a permanently showing [ :) +] when there's more than 1 reaction on a message. Right, @amshakal ?

@pixlwave
Copy link
Member

pixlwave commented Feb 3, 2022

Ooooo sounds good! I clearly didn't have the full context when posting those screenshots 🤐

@daniellekirkwood
Copy link
Contributor Author

This will be kept by the App team

@amshakal
Copy link

amshakal commented Feb 10, 2022 •
edited
Loading

For parity: we are moving to this interaction on Android. element-hq/element-android#4674

@daniellekirkwood
Copy link
Contributor Author

@amshakal I think this is designed and ready to go? Can you link the figma designs and I will update the issue content :)

@amshakal
Copy link

amshakal commented Mar 2, 2022

We have designs for Android Happy to create them for iOS if needed. :)

@daniellekirkwood
Copy link
Contributor Author

I'm going to mark this issue as "ready to build" and whoever is available to take this on will reach out to you if they need iOS designs :)

@gileluard gileluard mentioned this issue Jun 3, 2022
Merged
@gileluard gileluard self-assigned this Jun 9, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@gileluard gileluard

@amshakal amshakal

Labels
A-Message-Bubbles Message Bubbles appearance in the Timeline A-Reactions parity-with-android parity-with-web T-Enhancement New features, changes in functionality, performance boosts, user-facing improvements X-Needs-Design May require input from the design team Z-WTF WTF issues: High impact, Low Effort
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Update Reactions component element-hq/element-ios
4 participants
@pixlwave @gileluard @amshakal @daniellekirkwood