Fin

web/apps/photos/src/components/pages/gallery/SelectedFileOptions.tsx

@@ -1,5 +1,6 @@
 import { SelectionBar } from "@/base/components/Navbar";
 import type { Collection } from "@/media/collection";
+import type { CollectionSelectorAttributes } from "@/new/photos/components/CollectionSelector";
 import type { GalleryBarMode } from "@/new/photos/components/Gallery/BarImpl";
 import { FluidContainer } from "@ente/shared/components/Container";
 import ClockIcon from "@mui/icons-material/AccessTime";
@@ -18,7 +19,6 @@ import { Box, IconButton, Stack, Tooltip } from "@mui/material";
 import { t } from "i18next";
 import { AppContext } from "pages/_app";
 import { useContext } from "react";
-import { SetCollectionSelectorAttributes } from "types/gallery";
 import {
     ALL_SECTION,
     ARCHIVE_SECTION,
@@ -35,7 +35,15 @@ interface Props {
     ) => (...args: any[]) => void;
     handleFileOps: (opsType: FILE_OPS_TYPE) => (...args: any[]) => void;
     showCreateCollectionModal: (opsType: COLLECTION_OPS_TYPE) => () => void;
-    setCollectionSelectorAttributes: SetCollectionSelectorAttributes;
+    /**
+     * Callback to open a dialog where the user can choose a collection.
+     *
+     * The reason for opening the dialog and other properties are passed as the
+     * {@link attributes} argument.
+     */
+    onOpenCollectionSelector: (
+        attributes: CollectionSelectorAttributes,
+    ) => void;
     count: number;
     ownCount: number;
     clearSelection: () => void;
@@ -51,7 +59,7 @@ interface Props {
 
 const SelectedFileOptions = ({
     showCreateCollectionModal,
-    setCollectionSelectorAttributes,
+    onOpenCollectionSelector,
     handleCollectionOps,
     handleFileOps,
     selectedCollection,
@@ -71,12 +79,14 @@ const SelectedFileOptions = ({
     const peopleMode = barMode == "people";
 
     const addToCollection = () =>
-        setCollectionSelectorAttributes({
+        onOpenCollectionSelector({
             action: "add",
-            callback: handleCollectionOps(COLLECTION_OPS_TYPE.ADD),
-            showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.ADD),
-            fromCollection:
-                !isInSearchMode && !peopleMode ? activeCollectionID : undefined,
+            onSelectCollection: handleCollectionOps(COLLECTION_OPS_TYPE.ADD),
+            onCreateCollection: showCreateCollectionModal(
+                COLLECTION_OPS_TYPE.ADD,
+            ),
+            ignoredCollectionID:
+                isInSearchMode || peopleMode ? undefined : activeCollectionID,
         });
 
     const trashHandler = () =>
@@ -97,10 +107,12 @@ const SelectedFileOptions = ({
         });
 
     const restoreHandler = () =>
-        setCollectionSelectorAttributes({
+        onOpenCollectionSelector({
             action: "restore",
-            callback: handleCollectionOps(COLLECTION_OPS_TYPE.RESTORE),
-            showNextModal: showCreateCollectionModal(
+            onSelectCollection: handleCollectionOps(
+                COLLECTION_OPS_TYPE.RESTORE,
+            ),
+            onCreateCollection: showCreateCollectionModal(
                 COLLECTION_OPS_TYPE.RESTORE,
             ),
         });
@@ -140,20 +152,22 @@ const SelectedFileOptions = ({
     };
 
     const moveToCollection = () => {
-        setCollectionSelectorAttributes({
+        onOpenCollectionSelector({
             action: "move",
-            callback: handleCollectionOps(COLLECTION_OPS_TYPE.MOVE),
-            showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.MOVE),
-            fromCollection:
-                !isInSearchMode && !peopleMode ? activeCollectionID : undefined,
+            onSelectCollection: handleCollectionOps(COLLECTION_OPS_TYPE.MOVE),
+            onCreateCollection: showCreateCollectionModal(
+                COLLECTION_OPS_TYPE.MOVE,
+            ),
+            ignoredCollectionID:
+                isInSearchMode || peopleMode ? undefined : activeCollectionID,
         });
     };
 
     const unhideToCollection = () => {
-        setCollectionSelectorAttributes({
+        onOpenCollectionSelector({
             action: "unhide",
-            callback: handleCollectionOps(COLLECTION_OPS_TYPE.UNHIDE),
-            showNextModal: showCreateCollectionModal(
+            onSelectCollection: handleCollectionOps(COLLECTION_OPS_TYPE.UNHIDE),
+            onCreateCollection: showCreateCollectionModal(
                 COLLECTION_OPS_TYPE.UNHIDE,
             ),
         });

web/apps/photos/src/pages/gallery.tsx

@@ -1244,19 +1244,14 @@ export default function Gallery() {
                 <Uploader
                     activeCollection={activeCollection}
                     syncWithRemote={syncWithRemote}
-                    showCollectionSelector={setOpenCollectionSelectionDialog.bind(
-                        null,
-                        true,
-                    )}
                     closeUploadTypeSelector={setUploadTypeSelectorView.bind(
                         null,
                         false,
                     )}
-                    onOpenCollectionSelection={handleOpenCollectionSelection}
-                    closeCollectionSelector={setOpenCollectionSelectionDialog.bind(
-                        null,
-                        false,
-                    )}
+                    onOpenCollectionSelector={handleOpenCollectionSelector}
+                    onCloseCollectionSelector={() =>
+                        setOpenCollectionSelector(false)
+                    }
                     setLoading={setBlockingLoad}
                     setCollectionNamerAttributes={setCollectionNamerAttributes}
                     setShouldDisableDropzone={setShouldDisableDropzone}
@@ -1334,8 +1329,8 @@ export default function Gallery() {
                             showCreateCollectionModal={
                                 showCreateCollectionModal
                             }
-                            setCollectionSelectorAttributes={
-                                setCollectionSelectorAttributes
+                            onOpenCollectionSelector={
+                                handleOpenCollectionSelector
                             }
                             count={selected.count}
                             ownCount={selected.ownCount}

web/apps/photos/src/types/gallery/index.ts

@@ -1,5 +1,4 @@
 import type { Collection } from "@/media/collection";
-import { CollectionSelectorAttributes } from "@/new/photos/components/CollectionSelectionDialog";
 import { type SelectionContext } from "@/new/photos/components/Gallery";
 import { EnteFile } from "@/new/photos/types/file";
 import type { User } from "@ente/shared/user/types";
@@ -24,9 +23,6 @@ export type SetSelectedState = React.Dispatch<
 export type SetFiles = React.Dispatch<React.SetStateAction<EnteFile[]>>;
 export type SetCollections = React.Dispatch<React.SetStateAction<Collection[]>>;
 export type SetLoading = React.Dispatch<React.SetStateAction<boolean>>;
-export type SetCollectionSelectorAttributes = React.Dispatch<
-    React.SetStateAction<CollectionSelectorAttributes>
->;
 export type SetFilesDownloadProgressAttributes = (
     value:
         | Partial<FilesDownloadProgressAttributes>

web/packages/new/photos/components/CollectionSelector.tsx

@@ -61,7 +61,7 @@ export interface CollectionSelectorAttributes {
      * {@link ignoredCollectionID} to omit showing them again in the list of
      * collections.
      */
-    ignoredCollectionID?: number;
+    ignoredCollectionID?: number | undefined;
 }
 
 type CollectionSelectorProps = DialogVisibilityProps & {