[PM-25654] Add image attachment preview by amrg101 · Pull Request #5864 · bitwarden/android

amrg101 · 2025-09-10T18:48:45Z

🎟️ Tracking

https://community.bitwarden.com/t/view-attachments-without-downloading/52/19

📔 Objective

Viewing image attachments is a hassle since you have to download, save, and open them in another app.
This adds a built-in preview for images, Ideally, we’d have a full file manager that supports all types, but since images are the ones most often needing quick viewing, I think this is okay for now.

The implementation:

Downloads the file temporarily.
Loads and displays the image with zoom and pan support.
Automatically deletes the file once it has been loaded.

📸 Screenshots

Screen_Recording_20250910_170903_Bitwarden.Dev.mp4

⏰ Reminders before review

Contributor guidelines followed
All formatters and local linters executed and passed
Written new unit and / or integration tests where applicable
Protected functional changes with optionality (feature flags)
Used internationalization (i18n) for all UI strings
CI builds passed
Communicated to DevOps any deployment requirements
Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team

🦮 Reviewer guidelines

👍 (:+1:) or similar for great changes
📝 (:memo:) or ℹ️ (:information_source:) for notes or general info
❓ (:question:) for questions
🤔 (:thinking:) or 💭 (:thought_balloon:) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
🎨 (:art:) for suggestions / improvements
❌ (:x:) or ⚠️ (:warning:) for more significant problems or concerns needing attention
🌱 (:seedling:) or ♻️ (:recycle:) for future improvements or indications of technical debt
⛏ (:pick:) for minor or nitpick changes

bitwarden-bot · 2025-09-10T20:08:53Z

Thank you for your contribution! We've added this to our internal tracking system for review.
ID: PM-25654
Link: https://bitwarden.atlassian.net/browse/PM-25654

Details on our contribution process can be found here: https://contributing.bitwarden.com/contributing/pull-requests/community-pr-process.

SaintPatrck · 2025-09-11T14:23:18Z

Hi @amrg101!

Thank you for submitting this awesome new feature. I've passed it along to the appropriate teams for product review. We'll provide status updates as they become available.

speedy1804 · 2025-10-13T18:31:45Z

wow this looks great, would love to see that on iOS too

speedy1804 · 2026-01-12T19:45:19Z

@SaintPatrck are there any new information for this PR?

SaintPatrck

Hi @amrg101

Apologies for the delay. This feature has been approved. If you are still willing to make the suggested changes, we can move the pull request forward. If you do not have the time, let us know and we can take it from here.

Overall, the changes look good. We will need tests for all of this new functionality. I've also left a few comments that need to be addressed.

SaintPatrck · 2026-02-26T13:57:32Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+            }
+        }
+    }
+}


All files must end in a newline.

Suggested change

}

}

SaintPatrck · 2026-02-26T14:42:35Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+
+/**
+ * Displays a secure, temporary image attachment in a full-screen dialog with zoom and pan
+ * capabilities. The dialog can be dismissed by clicking the close button or pressing the back button.


Max line length is 100.

Suggested change

* capabilities. The dialog can be dismissed by clicking the close button or pressing the back button.

* capabilities. The dialog can be dismissed by clicking the close button or pressing the back

* button.

SaintPatrck · 2026-02-26T15:03:16Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+        LaunchedEffect(attachmentFile) {
+            val loadedPainter = withContext(Dispatchers.IO) {
+                try {
+                    val bitmap = BitmapFactory.decodeFile(attachmentFile.path)


🎨 It might be worth downsampling the image to prevent OOM exceptions for large files since we support attachments up to 500MB.

SaintPatrck · 2026-02-26T15:40:27Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemAttachmentContent.kt

+                        shouldShowPremiumWarningDialog = true
+                        return@BitwardenStandardIconButton
+                    }
+                    onAttachmentPreviewClick(attachmentItem)


We also need a large file warning here, like the download button has.

SaintPatrck · 2026-02-26T16:08:11Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemLoginContent.kt

-                )
+                    onAttachmentPreviewClick = vaultCommonItemTypeHandlers
+                        .onAttachmentPreviewClick,
+                    )


I don't think this indention is correct. Can you run the formatter here?

SaintPatrck · 2026-02-26T16:09:08Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemScreen.kt

+            AttachmentPreviewDialog(
+                attachmentFile = dialog.file,
+                onDismissRequest = onDismissRequest,
+                onLoaded = onPreviewLoaded


Missing a trailing comma

Suggested change

onLoaded = onPreviewLoaded

onLoaded = onPreviewLoaded,

SaintPatrck · 2026-02-26T16:09:22Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemViewModel.kt

                    VaultItemAction.Internal.AttachmentDecryptReceive(
                        result = result,
                        fileName = action.attachment.title,
+                        isPreview = false


Missing trailing comma

Suggested change

isPreview = false

isPreview = false,

SaintPatrck · 2026-02-26T16:09:36Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemViewModel.kt

+                    VaultItemAction.Internal.AttachmentDecryptReceive(
+                        result = result,
+                        fileName = action.attachment.title,
+                        isPreview = true


Missing trailing comma

Suggested change

isPreview = true

isPreview = true,

SaintPatrck · 2026-02-26T16:28:30Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/VaultItemAttachmentContent.kt

        modifier = modifier
            .defaultMinSize(minHeight = 60.dp)
-            .cardStyle(cardStyle = cardStyle, paddingStart = 16.dp)
+            .cardStyle(cardStyle = cardStyle, paddingStart = 16.dp, paddingEnd = 8.dp)


🤔 The seems off. I think we need to take an approach similar to BitwardenTextRow and use an outer container (Box) and SpaceBetween. @david-livefront thoughts on this?

@SaintPatrck is correct, we should not be adding the additional paddingEnd as that will break alignment with other rows.

SaintPatrck · 2026-02-26T16:54:20Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+        var showContent by remember { mutableStateOf(false) }
+
+        LaunchedEffect(attachmentFile) {
+            val loadedPainter = withContext(Dispatchers.IO) {


♻️ Not a huge fan of this explicit Dispatchers.IO use, but considering the alternatives it may be the cleanest way. 😢

Nothing to change here, for now.

david-livefront · 2026-02-26T17:01:20Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+                        .background(Color.Black.copy(alpha = 0.5f))
+                ) {
+                    Icon(
+                        imageVector = Icons.Filled.Close,


Please use our icons.

This one should be painter = rememberVectorPainter(id = BitwardenDrawable.ic_close),

david-livefront · 2026-02-26T17:02:01Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+                        .fillMaxSize()
+                        .pointerInput(Unit) {
+                            detectTransformGestures { _, pan, zoom, _ ->
+                                scale = (scale * zoom).coerceIn(1f, 5f)


Can you make some constants for this. 5f is a magic number.

david-livefront · 2026-02-26T17:05:02Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+                        BitmapPainter(bitmap.asImageBitmap())
+                    } else {
+                        null
+                    }


Can we simplify this too:

BitmapFactory .decodeFile(attachmentFile.path) ?.let { BitmapPainter(it.asImageBitmap()) }

david-livefront · 2026-02-26T17:16:50Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+                        .align(Alignment.TopEnd)
+                        .padding(16.dp)
+                        .clip(CircleShape)
+                        .background(Color.Black.copy(alpha = 0.5f))


We should be using our Bitwarden components to ensure that adhere to our style guide.

Something like this should do the trick:

BitwardenTonalIconButton( vectorIconRes = BitwardenDrawable.ic_close, contentDescription = stringResource(id = BitwardenString.close), onClick = onDismissRequest, modifier = Modifier .padding(top = 8.dp, end = 24.dp) .align(Alignment.TopEnd), )

david-livefront · 2026-02-26T17:24:25Z

...c/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/component/AttachmentPreviewDialog.kt

+            }
+        }
+
+        if (showContent && painter != null) {


I don't think we need this showContent at all.

Can we just base it on whether the image is loaded:

painter?.let { Box( modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center, ) { Image( painter = it, contentDescription = stringResource(id = BitwardenString.preview),

david-livefront · 2026-02-26T17:29:50Z

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/item/util/CipherViewExtensions.kt

    }
 }

+private fun isImageFile(fileName: String?): Boolean {


The file name will never be null, right?

amrg101 · 2026-02-27T00:21:24Z

@SaintPatrck @david-livefront Thanks for the review! I've addressed the feedback in the latest commit.

Add image attachment preview

46ffb06

amrg101 requested review from a team, brian-livefront and david-livefront as code owners September 10, 2025 18:48

amrg101 changed the title ~~Add image attachment preview~~ Add image attachment preview feature Sep 10, 2025

SaintPatrck added the community-pr label Sep 10, 2025

bitwarden-bot changed the title ~~Add image attachment preview feature~~ [PM-25654] Add image attachment preview Sep 10, 2025

SaintPatrck added app:password-manager Bitwarden Password Manager app context t:new-feature labels Sep 11, 2025

SaintPatrck requested a review from maxkpower September 11, 2025 14:23

vvolkgang removed the t:new-feature label Jan 13, 2026

SaintPatrck requested changes Feb 26, 2026

View reviewed changes

SaintPatrck reviewed Feb 26, 2026

View reviewed changes

Merge branch 'bitwarden:main' into main

55f7799

david-livefront reviewed Feb 26, 2026

View reviewed changes

UI fixes, downsampling, and formatting

18a9c19

+                          }
+                      }
+                  }
+              }

                
                    No newline at end of file

	* capabilities. The dialog can be dismissed by clicking the close button or pressing the back button.
	* capabilities. The dialog can be dismissed by clicking the close button or pressing the back
	* button.

Conversation

amrg101 commented Sep 10, 2025

🎟️ Tracking

📔 Objective

📸 Screenshots

⏰ Reminders before review

🦮 Reviewer guidelines

Uh oh!

bitwarden-bot commented Sep 10, 2025

Uh oh!

SaintPatrck commented Sep 11, 2025

Uh oh!

speedy1804 commented Oct 13, 2025

Uh oh!

speedy1804 commented Jan 12, 2026

Uh oh!

SaintPatrck left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

david-livefront Feb 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

amrg101 commented Feb 27, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

david-livefront Feb 26, 2026 •

edited

Loading