From 3ff645cab1b4e9fba0c42ed99e7c3fac7b0ed0ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ferenc=20S=C3=A1rai?= <sarai.ferenc@gmail.com>
Date: Thu, 5 Mar 2026 16:51:09 +0100
Subject: [PATCH] feat: add image opening functionality to DownloadActionBar
 (#725)

* feat: add image opening functionality to DownloadActionBar and Share components

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 src/pages/files/DownloadActionBar.tsx | 7 +++++++
 src/pages/files/Share.tsx             | 3 ++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/pages/files/DownloadActionBar.tsx b/src/pages/files/DownloadActionBar.tsx
index b047a89..0bc2532 100644
--- a/src/pages/files/DownloadActionBar.tsx
+++ b/src/pages/files/DownloadActionBar.tsx
@@ -14,6 +14,7 @@ interface Props {
   onDownload: () => void
   onUpdateFeed: () => void
   hasIndexDocument: boolean
+  isImage: boolean
   loading: boolean
 }
 
@@ -23,6 +24,7 @@ export function DownloadActionBar({
   onDownload,
   onUpdateFeed,
   hasIndexDocument,
+  isImage,
   loading,
 }: Props): ReactElement {
   return (
@@ -33,6 +35,11 @@ export function DownloadActionBar({
             View Website
           </SwarmButton>
         )}
+        {isImage && (
+          <SwarmButton onClick={onOpen} iconType={Link} disabled={loading}>
+            Open Image
+          </SwarmButton>
+        )}
         <SwarmButton onClick={onDownload} iconType={Download} disabled={loading} loading={loading}>
           Download
         </SwarmButton>
diff --git a/src/pages/files/Share.tsx b/src/pages/files/Share.tsx
index 0adb44a..09d878c 100644
--- a/src/pages/files/Share.tsx
+++ b/src/pages/files/Share.tsx
@@ -104,7 +104,7 @@ export function Share(): ReactElement {
   }
 
   function onOpen() {
-    window.open(`${apiUrl}/bzz/${hash}/`, '_blank')
+    window.open(`${apiUrl}/bzz/${hash}/`, '_blank', 'noopener,noreferrer')
   }
 
   function onClose() {
@@ -239,6 +239,7 @@ export function Share(): ReactElement {
         onDownload={onDownload}
         onUpdateFeed={onUpdateFeed}
         hasIndexDocument={Boolean(metadata?.isWebsite)}
+        isImage={Boolean(metadata?.isImage)}
         loading={downloading}
       />
     </>