link

web/apps/photos/src/components/PhotoFrame.tsx

@@ -32,6 +32,7 @@ import {
     SelectedState,
     SetFilesDownloadProgressAttributesCreator,
 } from "types/gallery";
+import { downloadSingleFile } from "utils/file";
 import { handleSelectCreator } from "utils/photoFrame";
 import { PhotoList } from "./PhotoList";
 import PreviewCard from "./pages/gallery/PreviewCard";
@@ -284,6 +285,13 @@ const PhotoFrame = ({
             : undefined;
     }, [favoriteFileIDs, onMarkUnsyncedFavoriteUpdate]);
 
+    // TODO(PS): Missing dep!
+    const handleDownload = useCallback((file: EnteFile) => {
+        const setSingleFileDownloadProgress =
+            setFilesDownloadProgressAttributesCreator!(file.metadata.title);
+        void downloadSingleFile(file, setSingleFileDownloadProgress);
+    }, []);
+
     const handleDelete = useMemo(() => {
         return onMarkTempDeleted
             ? async (file: EnteFile) => {
@@ -586,6 +594,7 @@ const PhotoFrame = ({
                     isInTrashSection={activeCollectionID === TRASH_SECTION}
                     onTriggerSyncWithRemote={handleTriggerSyncWithRemote}
                     onToggleFavorite={handleToggleFavorite}
+                    onDownload={handleDownload}
                     onDelete={handleDelete}
                     onSaveEditedImageCopy={handleSaveEditedImageCopy}
                     {...{

web/packages/gallery/components/viewer/FileViewer.tsx

@@ -133,11 +133,18 @@ export type FileViewerProps = ModalVisibilityProps & {
      * See also: [Note: File viewer update and dispatch]
      */
     onToggleFavorite?: (file: EnteFile) => Promise<void>;
+    /**
+     * Called when the given {@link file} should be downloaded.
+     *
+     * If this is not provided then the download action will not be shown.
+     *
+     * See also: [Note: File viewer update and dispatch]
+     */
+    onDownload?: (file: EnteFile) => void;
     /**
      * Called when the given {@link file} should be deleted.
      *
-     * If this is not provided then the delete button will not be shown
+     * If this is not provided then the delete action will not be shown.
-     * in the file actions.
      *
      * See also: [Note: File viewer update and dispatch]
      */
@@ -177,6 +184,7 @@ const FileViewer: React.FC<FileViewerProps> = ({
     allCollectionsNameByID,
     onTriggerSyncWithRemote,
     onToggleFavorite,
+    onDownload,
     onDelete,
     onSelectCollection,
     onSelectPerson,
@@ -284,24 +292,14 @@ const FileViewer: React.FC<FileViewerProps> = ({
 
     const handleFileInfoClose = useCallback(() => setOpenFileInfo(false), []);
 
-    // The download action itself - either invoked via the download option is
-    // shown in the more menu, or via `handleDownloadBarAction` (if the
-    // download option is shown in the PhotoSwipe bar).
-    const handleDownload = useCallback(
-        (annotatedFile: FileViewerAnnotatedFile) => {
-            console.log("TODO download", annotatedFile);
-        },
-        [],
-    );
-
     // Callback invoked when the download action is triggered by activating the
     // download button in the PhotoSwipe bar.
     const handleDownloadBarAction = useCallback(
         (annotatedFile: FileViewerAnnotatedFile) => {
             setActiveAnnotatedFile(annotatedFile);
-            handleDownload(annotatedFile);
+            onDownload!(annotatedFile.file);
         },
-        [handleDownload],
+        [onDownload],
     );
 
     // Callback invoked when the download action is triggered by activating the
@@ -309,7 +307,8 @@ const FileViewer: React.FC<FileViewerProps> = ({
     //
     // Not memoized since it uses the frequently changing `activeAnnotatedFile`.
     const handleDownloadMenuAction = () => {
-        handleDownload(activeAnnotatedFile!);
+        handleMoreMenuClose();
+        onDownload!(activeAnnotatedFile!.file);
     };
 
     const handleMore = useCallback(
@@ -403,6 +402,7 @@ const FileViewer: React.FC<FileViewerProps> = ({
 
             const showDownload = (() => {
                 if (disableDownload) return undefined;
+                if (!onDownload) return undefined;
                 if (user) {
                     // Logged in users see the download option in the more menu.
                     return "menu";
@@ -431,6 +431,7 @@ const FileViewer: React.FC<FileViewerProps> = ({
             disableDownload,
             isInTrashSection,
             isInHiddenSection,
+            onDownload,
             handleEditImage,
             handleConfirmDelete,
         ],