From a49426b77de1af78fbde257566d863afca0f62eb Mon Sep 17 00:00:00 2001
From: BFlat <bombayapirat@gmail.com>
Date: Thu, 23 Jul 2026 20:37:40 +0700
Subject: [PATCH] Webapp/desktop: multi-select batch download on the
 create-image page (#1806)

- Multi-select and batch download also enabled on the create-image page
(webapp + desktop); zip renamed to artcraft-media-*.zip
---
 .../apps/artcraft-webapp/src/components/topbar/topbar.tsx     | 4 ++--
 frontend/apps/artcraft-webapp/src/lib/download-media-zip.ts   | 2 +-
 .../artcraft-webapp/src/pages/create-image/create-image.tsx   | 3 +++
 .../artcraft/app/src/components/signaled/TopBar/TopBar.tsx    | 3 ++-
 .../apps/artcraft/app/src/pages/PageImage/TextToImage.tsx     | 2 ++
 5 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/artcraft-webapp/src/components/topbar/topbar.tsx b/frontend/apps/artcraft-webapp/src/components/topbar/topbar.tsx
index 701402e363..b9091faf18 100644
--- a/frontend/apps/artcraft-webapp/src/components/topbar/topbar.tsx
+++ b/frontend/apps/artcraft-webapp/src/components/topbar/topbar.tsx
@@ -20,8 +20,8 @@ export function TopBar() {
   const showViewToggle = !isMobile && GALLERY_VIEW_ROUTES.has(pathname);
   // Playing/still video previews only matter where the feed has videos.
   const showAutoplayToggle = showViewToggle && pathname === "/create-video";
-  // Multi-select + batch download is wired up on the video feed only for now.
-  const showSelectToggle = showViewToggle && pathname === "/create-video";
+  // Multi-select + batch download on the create feeds (image + video).
+  const showSelectToggle = showViewToggle;
 
   return (
     <header className="sticky top-0 z-20 flex items-center gap-3 border-b border-white/[0.06] bg-[#121212]/80 backdrop-blur-md px-3 pb-4 pt-3 sm:pt-6">
diff --git a/frontend/apps/artcraft-webapp/src/lib/download-media-zip.ts b/frontend/apps/artcraft-webapp/src/lib/download-media-zip.ts
index 1c729c415a..3ece00884d 100644
--- a/frontend/apps/artcraft-webapp/src/lib/download-media-zip.ts
+++ b/frontend/apps/artcraft-webapp/src/lib/download-media-zip.ts
@@ -68,7 +68,7 @@ export async function downloadItemsAsZip(
   if (succeeded > 0) {
     // Media files are already compressed — STORE skips pointless deflate work.
     const blob = await zip.generateAsync({ type: "blob", compression: "STORE" });
-    saveBlob(blob, `artcraft-videos-${Date.now()}.zip`);
+    saveBlob(blob, `artcraft-media-${Date.now()}.zip`);
   }
 
   return { succeeded, failed };
diff --git a/frontend/apps/artcraft-webapp/src/pages/create-image/create-image.tsx b/frontend/apps/artcraft-webapp/src/pages/create-image/create-image.tsx
index abfbda6f4b..ad33091cb5 100644
--- a/frontend/apps/artcraft-webapp/src/pages/create-image/create-image.tsx
+++ b/frontend/apps/artcraft-webapp/src/pages/create-image/create-image.tsx
@@ -611,6 +611,7 @@ export default function CreateImage() {
       description="Generate stunning AI images with ArtCraft"
       authChecked={authChecked}
       hasContent={hasContent}
+      showSelectToggle
       emptyStateTitle="Create Image"
       emptyStateSubtitle="Describe anything. See it in seconds."
       emptyStateCta={
@@ -643,6 +644,8 @@ export default function CreateImage() {
           onLoadMore={gallery.loadMore}
           onGalleryItemClick={lightbox.handleGalleryItemClick}
           enableMakeVideo
+          selectable
+          selectionBarBottomOffset={promptHeight + 24}
         />
       }
       promptBox={
diff --git a/frontend/apps/artcraft/app/src/components/signaled/TopBar/TopBar.tsx b/frontend/apps/artcraft/app/src/components/signaled/TopBar/TopBar.tsx
index 9a68995a11..9ff0a48325 100644
--- a/frontend/apps/artcraft/app/src/components/signaled/TopBar/TopBar.tsx
+++ b/frontend/apps/artcraft/app/src/components/signaled/TopBar/TopBar.tsx
@@ -515,7 +515,8 @@ export const TopBar = ({ pageName }: Props) => {
 
           <div className="flex justify-end gap-2" data-tauri-drag-region>
             <div className="no-drag flex items-center gap-1.5">
-              {tabStore.activeTabId === "VIDEO" && <GallerySelectToggle />}
+              {(tabStore.activeTabId === "IMAGE" ||
+                tabStore.activeTabId === "VIDEO") && <GallerySelectToggle />}
               {tabStore.activeTabId === "VIDEO" && <GalleryAutoplayToggle />}
               {(tabStore.activeTabId === "IMAGE" ||
                 tabStore.activeTabId === "VIDEO" ||
diff --git a/frontend/apps/artcraft/app/src/pages/PageImage/TextToImage.tsx b/frontend/apps/artcraft/app/src/pages/PageImage/TextToImage.tsx
index c645297783..b65c88ab25 100644
--- a/frontend/apps/artcraft/app/src/pages/PageImage/TextToImage.tsx
+++ b/frontend/apps/artcraft/app/src/pages/PageImage/TextToImage.tsx
@@ -170,6 +170,8 @@ const TextToImage = ({ imageMediaId, imageUrl }: TextToImageProps) => {
           onLoadMore={gallery.loadMore}
           onGalleryItemClick={openInLightbox}
           enableMakeVideo
+          selectable
+          selectionBarBottomOffset={promptHeight + 32}
         />
       }
       promptBox={