wip checkpoint

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

@@ -843,7 +843,9 @@ export default function Gallery() {
                 collections,
                 hiddenCollections,
             });
-            await syncFiles("normal", collections, setFiles);
+            await syncFiles("normal", collections, (files) =>
+                dispatch({ type: "fetchFiles", files }),
+            );
             await syncFiles("hidden", hiddenCollections, setHiddenFiles);
             await syncTrash(allCollections, setTrashedFiles);
             // syncWithRemote is called with the force flag set to true before

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

@@ -11,6 +11,7 @@ import {
     mergeMetadata,
     TrashRequest,
 } from "@/media/file";
+import { getLatestVersionFiles } from "@/new/photos/services/file";
 import {
     clearCachedThumbnailsIfChanged,
     getLocalFiles,
@@ -21,8 +22,7 @@ import { batch } from "@/utils/array";
 import HTTPService from "@ente/shared/network/HTTPService";
 import { getToken } from "@ente/shared/storage/localStorage/helpers";
 import exportService from "services/export";
-import { SetFiles } from "types/gallery";
-import { decryptFile, getLatestVersionFiles } from "utils/file";
+import { decryptFile } from "utils/file";
 import {
     getCollectionLastSyncTime,
     REQUEST_BATCH_SIZE,
@@ -34,13 +34,13 @@ import {
  * {@link collections}, from remote and update our local database.
  *
  * In addition to updating the local database, it also calls the provided
- * {@link setFiles} callback with the latest decrypted files after each batch
- * the new and/or updated files are received from remote.
+ * {@link onFetchFiles} callback with the latest decrypted files after each
+ * batch the new and/or updated files are received from remote.
  */
 export const syncFiles = async (
     type: "normal" | "hidden",
     collections: Collection[],
-    setFiles: SetFiles,
+    onFetchFiles: (fs: EnteFile[]) => void,
 ) => {
     const localFiles = await getLocalFiles(type);
     let files = await removeDeletedCollectionFiles(collections, localFiles);
@@ -59,7 +59,7 @@ export const syncFiles = async (
             continue;
         }
 
-        const newFiles = await getFiles(collection, lastSyncTime, setFiles);
+        const newFiles = await getFiles(collection, lastSyncTime, onFetchFiles);
         await clearCachedThumbnailsIfChanged(localFiles, newFiles);
         files = getLatestVersionFiles([...files, ...newFiles]);
         await setLocalFiles(type, files);
@@ -72,7 +72,7 @@ export const syncFiles = async (
 export const getFiles = async (
     collection: Collection,
     sinceTime: number,
-    setFiles: SetFiles,
+    onFetchFiles: (fs: EnteFile[]) => void,
 ): Promise<EnteFile[]> => {
     try {
         let decryptedFiles: EnteFile[] = [];
@@ -105,16 +105,7 @@ export const getFiles = async (
             );
             decryptedFiles = [...decryptedFiles, ...newDecryptedFilesBatch];
 
-            setFiles((files) =>
-                sortFiles(
-                    mergeMetadata(
-                        getLatestVersionFiles([
-                            ...(files || []),
-                            ...decryptedFiles,
-                        ]),
-                    ),
-                ),
-            );
+            onFetchFiles(decryptedFiles);
             if (resp.data.diff.length) {
                 time = resp.data.diff.slice(-1)[0].updationTime;
             }

web/apps/photos/src/utils/file/index.ts

@@ -497,22 +497,6 @@ export const copyFileToClipboard = async (fileURL: string) => {
     await navigator.clipboard.write([new ClipboardItem({ "image/png": blob })]);
 };
 
-export function getLatestVersionFiles(files: EnteFile[]) {
-    const latestVersionFiles = new Map<string, EnteFile>();
-    files.forEach((file) => {
-        const uid = `${file.collectionID}-${file.id}`;
-        if (
-            !latestVersionFiles.has(uid) ||
-            latestVersionFiles.get(uid).updationTime < file.updationTime
-        ) {
-            latestVersionFiles.set(uid, file);
-        }
-    });
-    return Array.from(latestVersionFiles.values()).filter(
-        (file) => !file.isDeleted,
-    );
-}
-
 export function getPersonalFiles(
     files: EnteFile[],
     user: User,

web/packages/new/photos/components/gallery/reducer.ts

@@ -4,6 +4,7 @@ import {
     type Collection,
 } from "@/media/collection";
 import type { EnteFile } from "@/media/file";
+import { mergeMetadata } from "@/media/file";
 import { isHiddenCollection } from "@/new/photos/services/collection";
 import { splitByPredicate } from "@/utils/array";
 import type { User } from "@ente/shared/user/types";
@@ -24,7 +25,10 @@ import type {
     CollectionSummary,
     CollectionSummaryType,
 } from "../../services/collection/ui";
-import { groupFilesBasedOnCollectionID } from "../../services/file";
+import {
+    getLatestVersionFiles,
+    groupFilesBasedOnCollectionID,
+} from "../../services/file";
 import { sortFiles } from "../../services/files";
 import {
     isArchivedCollection,
@@ -122,6 +126,7 @@ export type GalleryAction =
           collections: Collection[];
           hiddenCollections: Collection[];
       }
+    | { type: "fetchFiles"; files: EnteFile[] }
     | { type: "uploadFile"; file: EnteFile }
     | { type: "setFiles"; files: EnteFile[] }
     | { type: "setHiddenFiles"; hiddenFiles: EnteFile[] }
@@ -189,6 +194,18 @@ const galleryReducer: React.Reducer<GalleryState, GalleryAction> = (
                 collections: action.collections,
                 hiddenCollections: action.hiddenCollections,
             };
+        case "fetchFiles":
+            return {
+                ...state,
+                files: sortFiles(
+                    mergeMetadata(
+                        getLatestVersionFiles([
+                            ...state.files,
+                            ...action.files,
+                        ]),
+                    ),
+                ),
+            };
         case "uploadFile":
             return {
                 ...state,

web/packages/new/photos/services/file.ts

@@ -14,3 +14,23 @@ export const groupFilesBasedOnCollectionID = (files: EnteFile[]) => {
     }
     return result;
 };
+
+export function getLatestVersionFiles(files: EnteFile[]) {
+    const latestVersionFiles = new Map<string, EnteFile>();
+    files.forEach((file) => {
+        const uid = `${file.collectionID}-${file.id}`;
+        if (
+            !latestVersionFiles.has(uid) ||
+            // See: [Note: strict mode migration]
+            //
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            latestVersionFiles.get(uid).updationTime < file.updationTime
+        ) {
+            latestVersionFiles.set(uid, file);
+        }
+    });
+    return Array.from(latestVersionFiles.values()).filter(
+        (file) => !file.isDeleted,
+    );
+}