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

MediaViewer: iterate on design #3979

Merged
merged 13 commits into from
Dec 3, 2024
Merged

MediaViewer: iterate on design #3979

merged 13 commits into from
Dec 3, 2024

Conversation

bmarty
Copy link
Member

@bmarty bmarty commented Dec 2, 2024

Content

Media Viewer: design iteration.
Show the caption and change the design according to https://www.figma.com/design/Ni6Ii8YKtmXCKYNE90cC67/Timeline-(new)?node-id=1732-79703

image

Motivation and context

Screenshots / GIFs

Tests

  • There should be no behavior change, only UI change.

Tested devices

  • Physical
  • Emulator
  • OS version(s):

Checklist

  • Changes have been tested on an Android device or Android emulator with API 23
  • UI change has been tested on both light and dark themes
  • Accessibility has been taken into account. See https://github.com/element-hq/element-x-android/blob/develop/CONTRIBUTING.md#accessibility
  • Pull request is based on the develop branch
  • Pull request title will be used in the release note, it clearly define what will change for the user
  • Pull request includes screenshots or videos if containing UI changes
  • Pull request includes a sign off
  • You've made a self review of your PR

@bmarty bmarty added Record-Screenshots Runs the 'Record Screenshots' CI job and adds a commit with any new screenshots found. PR-Misc For other changes labels Dec 2, 2024
@bmarty bmarty requested a review from a team as a code owner December 2, 2024 13:51
@bmarty bmarty requested review from ganfra and removed request for a team December 2, 2024 13:51
@github-actions github-actions bot removed the Record-Screenshots Runs the 'Record Screenshots' CI job and adds a commit with any new screenshots found. label Dec 2, 2024
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 2, 2024 •
edited
Loading

📱 Scan the QR code below to install the build (arm64 only) for this PR.
QR code
If you can't scan the QR code you can install the build via this link: https://i.diawi.com/69piEY

@codecov Codecov
Copy link

codecov bot commented Dec 2, 2024 •
edited
Loading

Codecov Report

Attention: Patch coverage is 93.33333% with 15 lines in your changes missing coverage. Please review.

Project coverage is 83.12%. Comparing base (c926697) to head (5e92739).
Report is 29 commits behind head on develop.

Files with missing lines Patch % Lines
...braries/mediaviewer/impl/viewer/MediaViewerView.kt 93.42% 0 Missing and 5 partials ⚠️
...ent/android/libraries/mediaviewer/api/MediaInfo.kt 90.32% 3 Missing ⚠️
...s/mediaviewer/impl/DefaultMediaViewerEntryPoint.kt 0.00% 3 Missing ⚠️
...mediaviewer/impl/local/AndroidLocalMediaFactory.kt 71.42% 2 Missing ⚠️
...ctories/event/TimelineItemContentMessageFactory.kt 75.00% 0 Missing and 1 partial ⚠️
...ediaviewer/impl/local/DefaultLocalMediaRenderer.kt 0.00% 1 Missing ⚠️
Additional details and impacted files 
@@             Coverage Diff             @@
##           develop    #3979      +/-   ##
===========================================
+ Coverage    83.10%   83.12%   +0.02%     
===========================================
  Files         1806     1806              
  Lines        45703    45841     +138     
  Branches      5381     5390       +9     
===========================================
+ Hits         37983    38107     +124     
- Misses        5832     5841       +9     
- Partials      1888     1893       +5

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

bmarty
bmarty commented Dec 2, 2024
View reviewed changes
...uitests/src/test/snapshots/images/libraries.mediaviewer.impl.viewer_MediaViewerView_4_en.png Outdated
Copy link
Member Author

Choose a reason for hiding this comment

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

Note: there is an overlap here, but this is a preview issue. In prod bottomPaddingInPixels will be updated and the rendering will be OK.

@bmarty bmarty force-pushed the feature/bma/mediaCaption branch from b56b61d to 89aee04 Compare December 2, 2024 16:39
@bmarty bmarty added the Record-Screenshots Runs the 'Record Screenshots' CI job and adds a commit with any new screenshots found. label Dec 2, 2024
@github-actions github-actions bot removed the Record-Screenshots Runs the 'Record Screenshots' CI job and adds a commit with any new screenshots found. label Dec 2, 2024
ganfra
ganfra reviewed Dec 3, 2024
View reviewed changes
Copy link
Member

@ganfra ganfra left a comment

Choose a reason for hiding this comment

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

Some remarks/questions

.../messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesFlowNode.kt Outdated
@@ -337,7 +337,9 @@ class MessagesFlowNode @AssistedInject constructor(
caption = event.content.caption,
mimeType = event.content.mimeType,
formattedFileSize = event.content.formattedFileSize,
fileExtension = event.content.fileExtension
fileExtension = event.content.fileExtension,
Copy link
Member

Choose a reason for hiding this comment

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

Maybe we should start extracting those methods?

Copy link
Member Author

@bmarty bmarty Dec 3, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

dbb062f

...impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/viewer/MediaViewerView.kt Outdated
canShare = state.canShare,
mimeType = state.mediaInfo.mimeType,
caption = state.mediaInfo.caption,
onHeightChanged = { bottomPaddingInPixels = it },
Copy link
Member

@ganfra ganfra Dec 3, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

why do we need this padding computation? If I understand the design, the TopBar and BottomBar are just placed above the image?

Edit : Ok I get it, it's for the VideoPlayerController?

Copy link
Member Author

Choose a reason for hiding this comment

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

Yes

...uitests/src/test/snapshots/images/libraries.mediaviewer.impl.viewer_MediaViewerView_3_en.png Outdated
Copy link
Member

Choose a reason for hiding this comment

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

This look weird to have the title centered and so big, have you raised the point it's not really "androidish"?

Copy link
Member Author

Choose a reason for hiding this comment

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

I raised the point, design team (@americanrefugee ) is not against it. My idea is to implement what has been designed first.

@sonarqubecloud SonarQubeCloud
Copy link

sonarqubecloud bot commented Dec 3, 2024

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@bmarty bmarty added the Run-Maestro Starts a Maestro Cloud session to run integration tests label Dec 3, 2024
@github-actions github-actions bot removed the Run-Maestro Starts a Maestro Cloud session to run integration tests label Dec 3, 2024
ganfra
ganfra approved these changes Dec 3, 2024
View reviewed changes
Copy link
Member

@ganfra ganfra left a comment

Choose a reason for hiding this comment

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

Thanks!

@bmarty bmarty merged commit 71e0ff7 into develop Dec 3, 2024
30 checks passed
@bmarty bmarty deleted the feature/bma/mediaCaption branch December 3, 2024 12:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ganfra ganfra ganfra approved these changes

Assignees
No one assigned
Labels
PR-Misc For other changes
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@bmarty @ganfra @ElementBot