reduce filteredData concurrency to 1

src/components/PhotoFrame.tsx

@@ -1,6 +1,6 @@
 import { GalleryContext } from 'pages/gallery';
 import PreviewCard from './pages/gallery/PreviewCard';
-import React, { useContext, useEffect, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import { EnteFile } from 'types/file';
 import { styled } from '@mui/material';
 import DownloadManager from 'services/downloadManager';
@@ -114,11 +114,22 @@ const PhotoFrame = ({
     const router = useRouter();
     const [isSourceLoaded, setIsSourceLoaded] = useState(false);
 
-    const filteredData = useMemo(() => {
+    const updateInProgress = useRef(false);
+    const updateRequired = useRef(false);
+
+    const [filteredData, setFilteredData] = useState<EnteFile[]>([]);
+
+    useEffect(() => {
+        const main = () => {
+            if (updateInProgress.current) {
+                updateRequired.current = true;
+                return;
+            }
+            updateInProgress.current = true;
             const idSet = new Set();
             const user: User = getData(LS_KEYS.USER);
 
-        return files
+            const filteredData = files
                 .map((item, index) => ({
                     ...item,
                     dataIndex: index,
@@ -161,7 +172,10 @@ const PhotoFrame = ({
                     ) {
                         return false;
                     }
-                if (activeCollection === ARCHIVE_SECTION && !IsArchived(item)) {
+                    if (
+                        activeCollection === ARCHIVE_SECTION &&
+                        !IsArchived(item)
+                    ) {
                         return false;
                     }
 
@@ -189,6 +203,16 @@ const PhotoFrame = ({
                     }
                     return false;
                 });
+            setFilteredData(filteredData);
+            updateInProgress.current = false;
+            if (updateRequired.current) {
+                updateRequired.current = false;
+                setTimeout(() => {
+                    main();
+                }, 0);
+            }
+        };
+        main();
     }, [
         files,
         deletedFileIds,