diff --git a/web/apps/photos/src/components/Upload/Uploader.tsx b/web/apps/photos/src/components/Upload/Uploader.tsx index bb3d4fd9d..20f6358a9 100644 --- a/web/apps/photos/src/components/Upload/Uploader.tsx +++ b/web/apps/photos/src/components/Upload/Uploader.tsx @@ -8,7 +8,7 @@ import { DEFAULT_IMPORT_SUGGESTION, PICKED_UPLOAD_TYPE, UPLOAD_STAGES, - UPLOAD_STRATEGY, + type CollectionMapping, } from "constants/upload"; import { t } from "i18next"; import isElectron from "is-electron"; @@ -391,7 +391,7 @@ export default function Uploader(props: Props) { }; const uploadFilesToNewCollections = async ( - strategy: UPLOAD_STRATEGY, + strategy: CollectionMapping, collectionName?: string, ) => { try { @@ -405,7 +405,7 @@ export default function Uploader(props: Props) { string, (File | ElectronFile)[] >(); - if (strategy === UPLOAD_STRATEGY.SINGLE_COLLECTION) { + if (strategy == "root") { collectionNameToFilesMap.set( collectionName, toUploadFiles.current, @@ -605,10 +605,7 @@ export default function Uploader(props: Props) { } const uploadToSingleNewCollection = (collectionName: string) => { - uploadFilesToNewCollections( - UPLOAD_STRATEGY.SINGLE_COLLECTION, - collectionName, - ); + uploadFilesToNewCollections("root", collectionName); }; const showCollectionCreateModal = (suggestedName: string) => { @@ -647,7 +644,7 @@ export default function Uploader(props: Props) { `upload pending files to collection - ${pendingDesktopUploadCollectionName.current}`, ); uploadFilesToNewCollections( - UPLOAD_STRATEGY.SINGLE_COLLECTION, + "root", pendingDesktopUploadCollectionName.current, ); pendingDesktopUploadCollectionName.current = null; @@ -655,17 +652,13 @@ export default function Uploader(props: Props) { log.info( `pending upload - strategy - "multiple collections" `, ); - uploadFilesToNewCollections( - UPLOAD_STRATEGY.COLLECTION_PER_FOLDER, - ); + uploadFilesToNewCollections("leaf"); } return; } if (isElectron() && pickedUploadType === PICKED_UPLOAD_TYPE.ZIPS) { log.info("uploading zip files"); - uploadFilesToNewCollections( - UPLOAD_STRATEGY.COLLECTION_PER_FOLDER, - ); + uploadFilesToNewCollections("leaf"); return; } if (isFirstUpload && !importSuggestion.rootFolderName) { @@ -784,7 +777,7 @@ export default function Uploader(props: Props) { ); return; } - uploadFilesToNewCollections(UPLOAD_STRATEGY.COLLECTION_PER_FOLDER); + uploadFilesToNewCollections("leaf"); }; return ( diff --git a/web/apps/photos/src/components/WatchFolder.tsx b/web/apps/photos/src/components/WatchFolder.tsx index 49ad16e0d..ed8774b9e 100644 --- a/web/apps/photos/src/components/WatchFolder.tsx +++ b/web/apps/photos/src/components/WatchFolder.tsx @@ -1,5 +1,6 @@ import { ensureElectron } from "@/next/electron"; -import { FolderWatch } from "@/next/types/ipc"; +import type { CollectionMapping, FolderWatch } from "@/next/types/ipc"; +import { ensure } from "@/utils/ensure"; import { FlexWrapper, HorizontalFlex, @@ -26,7 +27,7 @@ import { } from "@mui/material"; import { styled } from "@mui/material/styles"; import UploadStrategyChoiceModal from "components/Upload/UploadStrategyChoiceModal"; -import { PICKED_UPLOAD_TYPE, UPLOAD_STRATEGY } from "constants/upload"; +import { PICKED_UPLOAD_TYPE } from "constants/upload"; import { t } from "i18next"; import { AppContext } from "pages/_app"; import React, { useContext, useEffect, useState } from "react"; @@ -44,11 +45,17 @@ interface WatchFolderProps { * This is the screen that controls that "watch folder" feature in the app. */ export const WatchFolder: React.FC = ({ open, onClose }) => { + // The folders we are watching const [watches, setWatches] = useState(); - const [inputFolderPath, setInputFolderPath] = useState< + // Temporarily stash the folder path while we show a choice dialog to the + // user to select the collection mapping. + const [savedFolderPath, setSavedFolderPath] = useState< string | undefined >(); + // True when we're showing the choice dialog to ask the user to set the + // collection mapping. const [choiceModalOpen, setChoiceModalOpen] = useState(false); + const appContext = useContext(AppContext); useEffect(() => { @@ -70,43 +77,34 @@ export const WatchFolder: React.FC = ({ open, onClose }) => { const folder: any = folders[i]; const path = (folder.path as string).replace(/\\/g, "/"); if (await watcher.isFolder(path)) { - await addFolderForWatching(path); + await selectCollectionMappingAndAddWatch(path); } } }; - const addFolderForWatching = async (path: string) => { - setInputFolderPath(path); + const selectCollectionMappingAndAddWatch = async (path: string) => { const files = await ensureElectron().getDirFiles(path); const analysisResult = getImportSuggestion( PICKED_UPLOAD_TYPE.FOLDERS, files, ); if (analysisResult.hasNestedFolders) { + setSavedFolderPath(path); setChoiceModalOpen(true); } else { - addWatchWithStrategy(UPLOAD_STRATEGY.SINGLE_COLLECTION, path); + addWatch(path, "root"); } }; - const addWatchWithStrategy = async ( - uploadStrategy: UPLOAD_STRATEGY, - folderPath?: string, - ) => { - folderPath = folderPath || inputFolderPath; - await watcher.addWatchMapping( - folderPath.substring(folderPath.lastIndexOf("/") + 1), - folderPath, - uploadStrategy, - ); - setInputFolderPath(""); + const addWatch = async (folderPath: string, mapping: CollectionMapping) => { + await watcher.addWatch(folderPath, mapping); setWatches(await watcher.getWatchMappings()); }; - const addWatch = async () => { + const addNewWatch = async () => { const folderPath = await watcher.selectFolder(); if (folderPath) { - await addFolderForWatching(folderPath); + await selectCollectionMappingAndAddWatch(folderPath); } }; @@ -117,14 +115,10 @@ export const WatchFolder: React.FC = ({ open, onClose }) => { const closeChoiceModal = () => setChoiceModalOpen(false); - const uploadToSingleCollection = () => { + const addWatchWithMapping = (mapping: CollectionMapping) => { closeChoiceModal(); - addWatchWithStrategy(UPLOAD_STRATEGY.SINGLE_COLLECTION); - }; - - const uploadToMultipleCollection = () => { - closeChoiceModal(); - addWatchWithStrategy(UPLOAD_STRATEGY.COLLECTION_PER_FOLDER); + setSavedFolderPath(undefined); + addWatch(ensure(savedFolderPath), mapping); }; return ( @@ -143,7 +137,7 @@ export const WatchFolder: React.FC = ({ open, onClose }) => { -