Skip to content

[AND-442] [AND-107] Improve the image loading #5724

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

Merged
merged 43 commits into from
Apr 21, 2025

Conversation

andremion
Copy link
Contributor

@andremion andremion commented Apr 10, 2025

🎯 Goal

Fix the loading glitches of image components.

🛠 Implementation details

  • Skip the empty state of the first rememberAsyncImagePainter emission, so that we reduce the number of transitions between loading and loaded states.
  • Give time for login activity to start before disconnecting the user so we prevent showing disconnected states on Compose sample.
  • Replace StreamImage with StreamAsyncImage.
  • Remove unused landscapist dependencies.
  • Deprecate landscapist image functions in favor of Coil ones.
  • Create snapshot tests for the affected components (Except for the MediaGalleryPreviewActivity components, which require a big refactor first)

🎨 UI Changes

Avatar components

Before After
avatar.before.webm
avatar.after.webm

Media components

Before After
media.attach.before.webm
Screen_recording_20250414_085345.webm

🧪 Testing

Explore every screen that shows images such as the channel list, message list, attachment picker, and gallery screens.

🎉 GIF

gif

@andremion andremion added the compose Jetpack Compose label Apr 10, 2025
Copy link
Contributor

github-actions bot commented Apr 10, 2025

SDK Size Comparison 📏

SDK Before After Difference Status
stream-chat-android-client 3.16 MB 3.16 MB 0.00 MB 🟢
stream-chat-android-offline 3.38 MB 3.38 MB 0.00 MB 🟢
stream-chat-android-ui-components 7.89 MB 7.89 MB 0.00 MB 🟢
stream-chat-android-compose 9.90 MB 9.91 MB 0.00 MB 🟢

@andremion andremion changed the title [AND-442] Fix image loading glitches [AND-442] [AND-107] Fix image loading glitches Apr 11, 2025
@andremion andremion force-pushed the AND-442-fix-image-loading-glitches branch from 42707ff to c3f4939 Compare April 11, 2025 09:15
@andremion andremion added the enhancement New feature or request label Apr 11, 2025
@andremion andremion changed the title [AND-442] [AND-107] Fix image loading glitches [AND-442] [AND-107] Improve the image loading Apr 11, 2025
@andremion andremion force-pushed the AND-442-fix-image-loading-glitches branch 5 times, most recently from b6ad0df to a703060 Compare April 14, 2025 14:09
@andremion andremion marked this pull request as ready for review April 14, 2025 15:12
@andremion andremion requested a review from a team as a code owner April 14, 2025 15:12
- Removes `darkMode` parameters from preview functions.
- Applies `ChatTheme` to preview functions to simplify the code and ensure consistent theming.
- Removes unnecessary `darkMode` parameters from snapshot tests, as the theme is now handled correctly.
The changes consistently apply `ContentScale.Crop` to preview images in various components:

-   `ComposerLinkPreview`: Sets `ContentScale.Crop` for link preview images.
-   `MediaAttachmentPreviewContent`: Sets `ContentScale.Crop` for media attachment previews.
-   `ImagesPicker`: Sets `ContentScale.Crop` for images in the image picker.
-   `ImageAttachmentPreviewContent`: Sets `ContentScale.Crop` for image attachment previews.
-   `MediaAttachmentQuotedContent`: Sets `ContentScale.Crop` for media attachment previews in quoted messages.
- Remove commented out code from FilesPicker
@andremion andremion force-pushed the AND-442-fix-image-loading-glitches branch from 9d99fa8 to 1da7c46 Compare April 17, 2025 12:49
Adds preview functions for `ImagesPicker` with different states.
Creates new snapshot tests for `ImagesPicker` to ensure visual consistency.
@andremion andremion requested a review from VelikovPetar April 17, 2025 13:45
@andremion andremion requested a review from VelikovPetar April 17, 2025 15:13
Copy link

Quality Gate Failed Quality Gate failed

Failed conditions
47.9% Coverage on New Code (required ≥ 80%)

See analysis details on SonarQube Cloud

@andremion andremion merged commit 8814954 into develop Apr 21, 2025
13 of 14 checks passed
@andremion andremion deleted the AND-442-fix-image-loading-glitches branch April 21, 2025 06:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
compose Jetpack Compose enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants