Ren

web/apps/photos/src/components/Upload/Uploader.tsx

@@ -6,7 +6,7 @@ import type { CollectionMapping, Electron, ZipItem } from "@/base/types/ipc";
 import type { Collection } from "@/media/collection";
 import type { EnteFile } from "@/media/file";
 import { UploaderNameInput } from "@/new/albums/components/UploaderNameInput";
-import { CollectionMappingChoiceDialog } from "@/new/photos/components/CollectionMappingChoiceDialog";
+import { CollectionMappingChoice } from "@/new/photos/components/CollectionMappingChoice";
 import type { CollectionSelectorAttributes } from "@/new/photos/components/CollectionSelector";
 import { downloadAppDialogAttributes } from "@/new/photos/components/utils/download";
 import { exportMetadataDirectoryName } from "@/new/photos/services/export";
@@ -134,7 +134,8 @@ export default function Uploader({
     const [percentComplete, setPercentComplete] = useState(0);
     const [hasLivePhotos, setHasLivePhotos] = useState(false);
 
-    const [openChoiceDialog, setOpenChoiceDialog] = useState(false);
+    const [openCollectionMappingChoice, setOpenCollectionMappingChoice] =
+        useState(false);
     const [importSuggestion, setImportSuggestion] = useState<ImportSuggestion>(
         DEFAULT_IMPORT_SUGGESTION,
     );
@@ -221,8 +222,8 @@ export default function Uploader({
 
     const closeUploadProgress = () => setUploadProgressView(false);
 
-    const handleChoiceModalClose = () => {
-        setOpenChoiceDialog(false);
+    const handleCollectionMappingChoiceClose = () => {
+        setOpenCollectionMappingChoice(false);
         uploadRunning.current = false;
     };
 
@@ -465,7 +466,7 @@ export default function Uploader({
 
             let showNextModal = () => {};
             if (importSuggestion.hasNestedFolders) {
-                showNextModal = () => setOpenChoiceDialog(true);
+                showNextModal = () => setOpenCollectionMappingChoice(true);
             } else {
                 showNextModal = () =>
                     showCollectionCreateModal(importSuggestion.rootFolderName);
@@ -740,7 +741,7 @@ export default function Uploader({
         }
     };
 
-    const didSelectCollectionMapping = (mapping: CollectionMapping) => {
+    const handleCollectionMappingSelect = (mapping: CollectionMapping) => {
         switch (mapping) {
             case "root":
                 uploadToSingleNewCollection(
@@ -781,10 +782,10 @@ export default function Uploader({
 
     return (
         <>
-            <CollectionMappingChoiceDialog
-                open={openChoiceDialog}
-                onClose={handleChoiceModalClose}
-                didSelect={didSelectCollectionMapping}
+            <CollectionMappingChoice
+                open={openCollectionMappingChoice}
+                onClose={handleCollectionMappingChoiceClose}
+                onSelect={handleCollectionMappingSelect}
             />
             <UploadTypeSelector
                 open={props.uploadTypeSelectorView}

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

@@ -6,7 +6,7 @@ import {
 import { ensureElectron } from "@/base/electron";
 import { basename, dirname } from "@/base/file-name";
 import type { CollectionMapping, FolderWatch } from "@/base/types/ipc";
-import { CollectionMappingChoiceDialog } from "@/new/photos/components/CollectionMappingChoiceDialog";
+import { CollectionMappingChoice } from "@/new/photos/components/CollectionMappingChoice";
 import { DialogCloseIconButton } from "@/new/photos/components/mui/Dialog";
 import { AppContext, useAppContext } from "@/new/photos/types/context";
 import {
@@ -141,9 +141,9 @@ export const WatchFolder: React.FC<ModalVisibilityProps> = ({
                     </Stack>
                 </DialogContent>
             </Dialog>
-            <CollectionMappingChoiceDialog
+            <CollectionMappingChoice
                 {...mappingChoiceVisibilityProps}
-                didSelect={handleCollectionMappingSelect}
+                onSelect={handleCollectionMappingSelect}
             />
         </>
     );

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

@@ -15,16 +15,21 @@ import { t } from "i18next";
 import React from "react";
 import { DialogCloseIconButton } from "./mui/Dialog";
 
-type CollectionMappingChoiceModalProps = ModalVisibilityProps & {
-    didSelect: (mapping: CollectionMapping) => void;
+type CollectionMappingChoiceProps = ModalVisibilityProps & {
+    /**
+     * Callback invoked with the mapping choice selected by the user.
+     *
+     * The dialog is automatically closed before this callback is invoked.
+     */
+    onSelect: (mapping: CollectionMapping) => void;
 };
 
 /**
  * A {@link Dialog} that allow the user to choose a collection mapping.
  */
-export const CollectionMappingChoiceDialog: React.FC<
-    CollectionMappingChoiceModalProps
-> = ({ open, onClose, didSelect }) => (
+export const CollectionMappingChoice: React.FC<
+    CollectionMappingChoiceProps
+> = ({ open, onClose, onSelect }) => (
     <Dialog
         open={open}
         onClose={onClose}
@@ -52,7 +57,7 @@ export const CollectionMappingChoiceDialog: React.FC<
                     startIcon={<FolderIcon />}
                     onClick={() => {
                         onClose();
-                        didSelect("root");
+                        onSelect("root");
                     }}
                 >
                     {t("upload_to_single_album")}
@@ -64,7 +69,7 @@ export const CollectionMappingChoiceDialog: React.FC<
                     startIcon={<FolderCopyIcon />}
                     onClick={() => {
                         onClose();
-                        didSelect("parent");
+                        onSelect("parent");
                     }}
                 >
                     {t("upload_to_album_per_folder")}