Skip to content

Introduce FileTypeIcon#6092

Merged
gpunto merged 2 commits intov7from
redesign/filetype-icon
Jan 22, 2026
Merged

Introduce FileTypeIcon#6092
gpunto merged 2 commits intov7from
redesign/filetype-icon

Conversation

@gpunto
Copy link
Contributor

@gpunto gpunto commented Jan 20, 2026

🎯 Goal

AND-1020: Update filetype icon/component

The filetype icon label is now dynamic, i.e. we overlay the text in code instead of having N variant where the only thing that changes is the text.

🛠 Implementation details

  • Create component
  • Replace usages
  • Add new vector drawables

🎨 UI Changes

Add relevant screenshots

Before After
Screenshot_20260120_181733 Screenshot_20260120_181006
Screenshot_20260122_131548 Screenshot_20260122_131449

🧪 Testing

You can run the sample and check how the file icons look, e.g. in the message list, attachment picker.

☑️Contributor Checklist

General

  • I have signed the Stream CLA (required)
  • Assigned a person / code owner group (required)
  • Thread with the PR link started in a respective Slack channel (#android-chat-core or #android-chat-ui) (required)
  • PR is linked to the GitHub issue it resolves

Code & documentation

  • Changelog is updated with client-facing changes
  • New code is covered by unit tests
  • Comparison screenshots added for visual changes
  • Affected documentation updated (KDocs, docusaurus, tutorial)

☑️Reviewer Checklist

  • UI Components sample runs & works
  • Compose sample runs & works
  • UI Changes correct (before & after images)
  • Bugs validated (bugfixes)
  • New feature tested and works
  • Release notes and docs clearly describe changes
  • All code we touched has new or updated KDocs
  • Check the SDK Size Comparison table in the CI logs

🎉 GIF

Please provide a suitable gif that describes your work on this pull request

Summary by CodeRabbit

  • Visual Updates
    • Updated file attachment icon designs for improved visual consistency
    • Enhanced file type indicator display in messages and file selection interfaces

✏️ Tip: You can customize this high-level summary in your review settings.

@github-actions
Copy link
Contributor

github-actions bot commented Jan 20, 2026

SDK Size Comparison 📏

SDK Before After Difference Status
stream-chat-android-client 5.25 MB 5.25 MB 0.00 MB 🟢
stream-chat-android-offline 5.48 MB 5.48 MB 0.00 MB 🟢
stream-chat-android-ui-components 10.62 MB 10.61 MB -0.01 MB 🚀
stream-chat-android-compose 12.84 MB 11.63 MB -1.21 MB 🚀

@gpunto gpunto force-pushed the redesign/filetype-icon branch from 22a35ac to d62445b Compare January 21, 2026 10:17
@gpunto gpunto marked this pull request as ready for review January 21, 2026 10:17
@gpunto gpunto requested a review from a team as a code owner January 21, 2026 10:17
@gpunto
Copy link
Contributor Author

gpunto commented Jan 21, 2026

@coderabbitai review

@coderabbitai
Copy link

coderabbitai bot commented Jan 21, 2026

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@coderabbitai
Copy link

coderabbitai bot commented Jan 21, 2026

Walkthrough

This PR consolidates file type icon handling by introducing a FileIconData enum that combines drawable resource IDs with type names, replacing scattered drawable ID references across the codebase. Multiple old icon drawables are removed and replaced with redesigned versions, while UI components are updated to use the new FileTypeIcon composable and icon data structure.

Changes

Cohort / File(s) Summary
Core Icon Infrastructure
MimeTypeIconProvider.kt, FileTypeIcon.kt
Refactored MimeTypeIconProvider.getIconRes() to getIcon() returning FileIconData enum instead of drawable resource IDs. New FileTypeIcon composable renders icon with optional bottom-centered text label using FileIconData containing both resource ID and type name.
UI Components - Icon Handling
FileAttachmentContent.kt, FilesPickerItemImage.kt
Updated to use FileTypeIcon component and FileIconData from MimeTypeIconProvider.getIcon(). Refactored fallback logic to branch on imagePreviewData presence rather than mixed data sources. Simplified modifier and content scale handling.
Quoted Message Components
QuotedMessage.kt, QuotedMessageBodyBuilder.kt
Changed QuotedMessageBody.previewIcon from Int? to FileIconData? and updated to render via FileTypeIcon instead of Image. Updated builder to call MimeTypeIconProvider.getIcon() instead of getIconRes().
Theme Configuration
AudioRecordingAttachmentTheme.kt
Updated icon drawable reference from stream_compose_ic_file_aac to stream_compose_ic_file_audio.
Drawable Resources - Deletions
stream_compose_ic_file_7z.xml, stream_compose_ic_file_aac.xml, stream_compose_ic_file_audio_generic.xml, stream_compose_ic_file_csv.xml, stream_compose_ic_file_docx.xml, stream_compose_ic_file_html.xml, stream_compose_ic_file_m4a.xml, stream_compose_ic_file_md.xml, stream_compose_ic_file_mov.xml, stream_compose_ic_file_mp3.xml, stream_compose_ic_file_mp4.xml, stream_compose_ic_file_odt.xml, stream_compose_ic_file_ppt.xml, stream_compose_ic_file_pptx.xml, stream_compose_ic_file_rar.xml, stream_compose_ic_file_rtf.xml, stream_compose_ic_file_tar.xml, stream_compose_ic_file_tar_gz.xml, stream_compose_ic_file_txt.xml, stream_compose_ic_file_video_generic.xml, stream_compose_ic_file_xls.xml, stream_compose_ic_file_xlsx.xml, stream_compose_ic_file_zip.xml
Removed 23 legacy icon drawable files as part of icon consolidation and redesign.
Drawable Resources - Updates
stream_compose_ic_file_audio.xml, stream_compose_ic_file_doc.xml, stream_compose_ic_file_generic.xml, stream_compose_ic_file_pdf.xml
Updated canvas dimensions from 34x40 to 40x48 dp and redesigned path definitions with new stroke/fill attributes and simplified geometry.
Drawable Resources - Additions
stream_compose_ic_file_code.xml, stream_compose_ic_file_compression.xml, stream_compose_ic_file_presentation.xml, stream_compose_ic_file_spreadsheet.xml
Added four new vector drawable resources with 40x48 dp canvas and redesigned icon compositions using updated styling.
Tests
QuotedMessageBodyBuilderTest.kt
Updated test expectations to use FileIconData.Pdf, FileIconData.Generic constants instead of drawable resource IDs. Added import for FileIconData.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

Possibly related PRs

  • GetStream/stream-chat-android#6084 — Implements quoted-message redesign touching the same code paths (QuotedMessage, MimeTypeIconProvider refactoring, FileTypeIcon/FileAttachmentContent integration)

Suggested reviewers

  • VelikovPetar
  • andremion

Poem

🐰 Hop, hop! New icons spring to life,
FileIconData ends the strife,
Drawables redesigned with care so fine,
At 40x48, they perfectly align!
FileTypeIcon hops into view,
A cleaner way for me and you! 🎨✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 37.50% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title 'Introduce FileTypeIcon' directly and clearly summarizes the main change in the pull request, which is the introduction of a new FileTypeIcon component.
Linked Issues check ✅ Passed The PR implements the FileTypeIcon component per AND-1020 requirements: creates a new dynamic component, replaces usages, and adds vector drawables. The design-system alignment requirement is addressed through the component implementation and visual changes.
Out of Scope Changes check ✅ Passed All changes are scope-aligned: new FileTypeIcon component, refactored file attachment content rendering, updated MimeTypeIconProvider, replaced vector drawables per design, and updated tests. No unrelated changes detected.
Description check ✅ Passed The PR description follows the template with all key sections completed: goal with linked issue, implementation details, UI changes with before/after screenshots, testing instructions, and contributor/reviewer checklists.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
  • 📝 Generate docstrings

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 3

🤖 Fix all issues with AI agents
In
`@stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/attachments/content/FileAttachmentContent.kt`:
- Line 51: The current FileAttachmentContent rendering always shows
StreamAsyncImage when imagePreviewData exists, ignoring
ChatTheme.videoThumbnailsEnabled; update the rendering logic in
FileAttachmentContent so StreamAsyncImage is used only if the attachment is an
image OR it's a video and ChatTheme.videoThumbnailsEnabled is true, otherwise
render FileTypeIcon; apply the same conditional fix to the other occurrence
around the 274-297 block to ensure video thumbnails are toggled off correctly
(refer to StreamAsyncImage, FileTypeIcon, ChatTheme.videoThumbnailsEnabled, and
the attachment's imagePreviewData/isVideo/isImage properties).

In
`@stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/util/MimeTypeIconProvider.kt`:
- Around line 28-32: Update the KDoc for the getIcon function in
MimeTypeIconProvider to reflect that it returns a FileIconData instance instead
of a drawable resource: change wording like "Returns a drawable resource for the
given MIME type" and the `@return` description to say it returns FileIconData
(include what fields/meaning are returned if relevant), and update the `@param`
description if needed to reference the MIME type format; ensure references to
drawable resource are removed or replaced with FileIconData throughout the KDoc.

In
`@stream-chat-android-compose/src/main/res/drawable/stream_compose_ic_file_code.xml`:
- Around line 22-25: Replace the hardcoded fill color in
stream_compose_ic_file_code.xml (the <path> element with android:pathData
"M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48
0,46.209 0,44V4Z") with a neutral placeholder color (e.g., black/#000000 or
`@android`:color/black) so runtime tinting in composables works correctly; locate
the android:fillColor attribute on that path and swap the hex `#00ACA1` to the
placeholder color, ensuring the drawable relies on the runtime tint rather than
a hardcoded brand color.

Comment on lines +22 to +25
<path
android:pathData="M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48 0,46.209 0,44V4Z"
android:fillColor="#00ACA1"/>
<path
Copy link

@coderabbitai coderabbitai bot Jan 21, 2026

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🟡 Minor

Use placeholder fill color to preserve runtime tinting.

These stream_compose_ic_* icons are tinted at runtime, so hardcoding #00ACA1 can break theme-aware coloring. Consider switching to a placeholder (e.g., black) and rely on the tint in composables. Based on learnings, use placeholder colors in drawable XMLs for this module.

♻️ Proposed change
-  <path
-      android:pathData="M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48 0,46.209 0,44V4Z"
-      android:fillColor="#00ACA1"/>
+  <path
+      android:pathData="M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48 0,46.209 0,44V4Z"
+      android:fillColor="#000000"/>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<path
android:pathData="M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48 0,46.209 0,44V4Z"
android:fillColor="#00ACA1"/>
<path
<path
android:pathData="M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48 0,46.209 0,44V4Z"
android:fillColor="#000000"/>
<path
🤖 Prompt for AI Agents
In
`@stream-chat-android-compose/src/main/res/drawable/stream_compose_ic_file_code.xml`
around lines 22 - 25, Replace the hardcoded fill color in
stream_compose_ic_file_code.xml (the <path> element with android:pathData
"M0,4C0,1.791 1.791,0 4,0H28L40,12V44C40,46.209 38.209,48 36,48H4C1.791,48
0,46.209 0,44V4Z") with a neutral placeholder color (e.g., black/#000000 or
`@android`:color/black) so runtime tinting in composables works correctly; locate
the android:fillColor attribute on that path and swap the hex `#00ACA1` to the
placeholder color, ensuring the drawable relies on the runtime tint rather than
a hardcoded brand color.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

The color of these specific file type icons is theme independent

Copy link

Choose a reason for hiding this comment

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

@gpunto, thank you for the clarification! I understand now that these file type icons (stream_compose_ic_file_*) are designed with specific, intentional colors that remain consistent regardless of theme, unlike other icons in the module that rely on runtime tinting. This makes sense for maintaining visual consistency and recognition of different file types.

    /)_/)
   (^.^)
   (> <)  Got it!

✏️ Learnings added
Learnt from: gpunto
Repo: GetStream/stream-chat-android PR: 6092
File: stream-chat-android-compose/src/main/res/drawable/stream_compose_ic_file_code.xml:22-25
Timestamp: 2026-01-21T11:30:52.069Z
Learning: In stream-chat-android-compose, file type icon drawables (stream_compose_ic_file_*.xml) use intentional, theme-independent colors specific to each file type (e.g., PDF is red, spreadsheet is green, code is teal) and do not rely on runtime tinting like other icons in the module.

Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.


🧠 Learnings used
Learnt from: gpunto
Repo: GetStream/stream-chat-android PR: 6084
File: stream-chat-android-compose/src/main/res/drawable/stream_compose_ic_camera.xml:27-28
Timestamp: 2026-01-15T13:09:56.922Z
Learning: In stream-chat-android-compose, drawable XML icon files (e.g., stream_compose_ic_*.xml) use hardcoded placeholder colors because tint is applied programmatically when the icons are used in composables, ensuring theme-aware coloring at runtime.

Learnt from: CR
Repo: GetStream/stream-chat-android PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-17T15:00:07.506Z
Learning: Applies to **/stream-chat-android-compose/**/*.kt : Compose previews should use `StreamPreview` helpers

Learnt from: CR
Repo: GetStream/stream-chat-android PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-17T15:00:07.506Z
Learning: Applies to **/stream-chat-android-compose/**/*Test.kt : Add Paparazzi snapshots for Compose UI regressions and run `verifyPaparazziDebug`

Learnt from: CR
Repo: GetStream/stream-chat-android PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-17T15:00:07.506Z
Learning: Applies to **/stream-chat-android-ui-components/**/*Test.kt : Record Shot baselines when behaviour changes in XML kit UI tests

@gpunto gpunto marked this pull request as draft January 21, 2026 10:33
@gpunto gpunto force-pushed the redesign/filetype-icon branch from d62445b to a53eb30 Compare January 21, 2026 11:30
@gpunto gpunto marked this pull request as ready for review January 21, 2026 11:32
@gpunto gpunto force-pushed the redesign/filetype-icon branch from a53eb30 to 34ccaa8 Compare January 22, 2026 12:13
@gpunto gpunto force-pushed the redesign/filetype-icon branch from 34ccaa8 to e2eb2d4 Compare January 22, 2026 12:20
@gpunto gpunto force-pushed the redesign/filetype-icon branch from 6d6a06c to 6220090 Compare January 22, 2026 14:28
@sonarqubecloud
Copy link

Quality Gate Failed Quality Gate failed

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

See analysis details on SonarQube Cloud

@gpunto gpunto merged commit ef5026a into v7 Jan 22, 2026
19 of 22 checks passed
@gpunto gpunto deleted the redesign/filetype-icon branch January 22, 2026 15:16
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.

2 participants