More renaming - wip

web/apps/photos/src/components/Upload/UploadStrategyChoiceModal.tsx → web/apps/photos/src/components/Upload/CollectionMappingChoiceModal.tsx

@@ -1,3 +1,4 @@
+import type { CollectionMapping } from "@/next/types/ipc";
 import {
     CenteredFlex,
     SpaceBetweenFlex,
@@ -8,23 +9,19 @@ import DialogTitleWithCloseButton, {
 import { Button, Dialog, DialogContent, Typography } from "@mui/material";
 import { t } from "i18next";
 
-interface Props {
-    uploadToMultipleCollection: () => void;
+interface CollectionMappingChoiceModalProps {
     open: boolean;
     onClose: () => void;
-    uploadToSingleCollection: () => void;
+    didSelect: (mapping: CollectionMapping) => void;
 }
-function UploadStrategyChoiceModal({
-    uploadToMultipleCollection,
-    uploadToSingleCollection,
-    ...props
-}: Props) {
-    const handleClose = dialogCloseHandler({
-        onClose: props.onClose,
-    });
+
+export const CollectionMappingChoiceModal: React.FC<
+    CollectionMappingChoiceModalProps
+> = ({ open, onClose, didSelect }) => {
+    const handleClose = dialogCloseHandler({ onClose });
 
     return (
-        <Dialog open={props.open} onClose={handleClose}>
+        <Dialog open={open} onClose={handleClose}>
             <DialogTitleWithCloseButton onClose={handleClose}>
                 {t("MULTI_FOLDER_UPLOAD")}
             </DialogTitleWithCloseButton>
@@ -39,8 +36,8 @@ function UploadStrategyChoiceModal({
                         size="medium"
                         color="accent"
                         onClick={() => {
-                            props.onClose();
-                            uploadToSingleCollection();
+                            onClose();
+                            didSelect("root");
                         }}
                     >
                         {t("UPLOAD_STRATEGY_SINGLE_COLLECTION")}
@@ -52,8 +49,8 @@ function UploadStrategyChoiceModal({
                         size="medium"
                         color="accent"
                         onClick={() => {
-                            props.onClose();
-                            uploadToMultipleCollection();
+                            onClose();
+                            didSelect("parent");
                         }}
                     >
                         {t("UPLOAD_STRATEGY_COLLECTION_PER_FOLDER")}
@@ -62,5 +59,4 @@ function UploadStrategyChoiceModal({
             </DialogContent>
         </Dialog>
     );
-}
-export default UploadStrategyChoiceModal;
+};

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

@@ -58,8 +58,8 @@ import {
     groupFilesBasedOnParentFolder,
 } from "utils/upload";
 import { SetCollectionNamerAttributes } from "../Collections/CollectionNamer";
+import { CollectionMappingChoiceModal } from "./CollectionMappingChoiceModal";
 import UploadProgress from "./UploadProgress";
-import UploadStrategyChoiceModal from "./UploadStrategyChoiceModal";
 import UploadTypeSelector from "./UploadTypeSelector";
 
 const FIRST_ALBUM_NAME = "My First Album";
@@ -780,13 +780,23 @@ export default function Uploader(props: Props) {
         uploadFilesToNewCollections("leaf");
     };
 
+    const didSelectCollectionMapping = (mapping: CollectionMapping) => {
+        switch (mapping) {
+            case "root":
+                handleUploadToSingleCollection();
+                break;
+            case "parent":
+                handleUploadToMultipleCollections();
+                break;
+        }
+    };
+
     return (
         <>
-            <UploadStrategyChoiceModal
+            <CollectionMappingChoiceModal
                 open={choiceModalView}
                 onClose={handleChoiceModalClose}
-                uploadToSingleCollection={handleUploadToSingleCollection}
-                uploadToMultipleCollection={handleUploadToMultipleCollections}
+                didSelect={didSelectCollectionMapping}
             />
             <UploadTypeSelector
                 show={props.uploadTypeSelectorView}

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

@@ -26,7 +26,7 @@ import {
     Typography,
 } from "@mui/material";
 import { styled } from "@mui/material/styles";
-import UploadStrategyChoiceModal from "components/Upload/UploadStrategyChoiceModal";
+import { CollectionMappingChoiceModal } from "components/Upload/CollectionMappingChoiceModal";
 import { PICKED_UPLOAD_TYPE } from "constants/upload";
 import { t } from "i18next";
 import { AppContext } from "pages/_app";
@@ -149,11 +149,10 @@ export const WatchFolder: React.FC<WatchFolderProps> = ({ open, onClose }) => {
                     </Stack>
                 </DialogContent>
             </Dialog>
-            <UploadStrategyChoiceModal
+            <CollectionMappingChoiceModal
                 open={choiceModalOpen}
                 onClose={closeChoiceModal}
-                uploadToSingleCollection={() => addWatchWithMapping("root")}
-                uploadToMultipleCollection={() => addWatchWithMapping("parent")}
+                didSelect={addWatchWithMapping}
             />
         </>
     );
@@ -263,7 +262,7 @@ const WatchEntry: React.FC<WatchEntryProps> = ({ watch, removeWatch }) => {
     return (
         <SpaceBetweenFlex>
             <HorizontalFlex>
-                {watch.uploadStrategy === "root" ? (
+                {watch.collectionMapping === "root" ? (
                     <Tooltip title={t("UPLOADED_TO_SINGLE_COLLECTION")}>
                         <FolderOpenIcon />
                     </Tooltip>

web/apps/photos/src/services/watch.ts

@@ -7,7 +7,7 @@ import { ensureElectron } from "@/next/electron";
 import { nameAndExtension } from "@/next/file";
 import log from "@/next/log";
 import type { CollectionMapping, FolderWatch } from "@/next/types/ipc";
-import { UPLOAD_RESULT, UPLOAD_STRATEGY } from "constants/upload";
+import { UPLOAD_RESULT } from "constants/upload";
 import debounce from "debounce";
 import uploadManager from "services/upload/uploadManager";
 import { Collection } from "types/collection";
@@ -202,7 +202,7 @@ class WatchFolderService {
                 throw Error("no Mapping found for event");
             }
             log.info(
-                `mapping for event rootFolder: ${mapping.rootFolderName} folderPath: ${mapping.folderPath} uploadStrategy: ${mapping.uploadStrategy} syncedFilesCount: ${mapping.syncedFiles.length} ignoredFilesCount ${mapping.ignoredFiles.length}`,
+                `mapping for event rootFolder: ${mapping.rootFolderName} folderPath: ${mapping.folderPath} colelctionMapping: ${mapping.collectionMapping} syncedFilesCount: ${mapping.syncedFiles.length} ignoredFilesCount ${mapping.ignoredFiles.length}`,
             );
             if (event.type === "upload") {
                 event.files = getValidFilesToUpload(event.files, mapping);
@@ -740,9 +740,9 @@ const isSyncedOrIgnoredPath = (path: string, watch: FolderWatch) =>
     watch.syncedFiles.find((f) => f.path === path);
 
 const collectionNameForPath = (filePath: string, watch: FolderWatch) =>
-    watch.uploadStrategy === UPLOAD_STRATEGY.COLLECTION_PER_FOLDER
-        ? parentDirectoryName(filePath)
-        : watch.rootFolderName;
+    watch.collectionMapping == "root"
+        ? watch.rootFolderName
+        : parentDirectoryName(filePath);
 
 const parentDirectoryName = (filePath: string) => {
     const components = filePath.split("/");

web/packages/next/types/ipc.ts

@@ -385,12 +385,21 @@ export interface Electron {
  */
 export interface FolderWatch {
     rootFolderName: string;
-    uploadStrategy: number;
+    /**
+     * Specify if nested files should all be mapped to the same single root
+     * collection, or if there should be a collection per directory that has
+     * files. @see {@link CollectionMapping}.
+     */
+    collectionMapping: CollectionMapping;
     folderPath: string;
     syncedFiles: FolderWatchSyncedFile[];
     ignoredFiles: string[];
 }
 
+/**
+ * The ways in which we can map nested files to collections when uploading or
+ * watching directories from the user's local file system.
+ */
 export type CollectionMapping =
     /** Map everything to a single collection corresponding to the root directory */
     | "root"