** Major Change**. Removed unknown dependencies, and reset project to a new start state. See MD file for instructions.

components-old/media-cache-overlay/media-cache-overlay.component.jsx

@@ -0,0 +1,82 @@
+import { SafeAreaView } from "react-native";
+import React from "react";
+
+import ImageView from "react-native-image-viewing";
+
+export default function MediaCacheOverlay({
+  photos,
+  previewVisible,
+  setPreviewVisible,
+  imgIndex,
+  setImgIndex,
+}) {
+  //const videoRef = React.useRef(null);
+
+  return (
+    <SafeAreaView>
+      <ImageView
+        onRequestClose={() => setPreviewVisible(false)}
+        visible={previewVisible}
+        images={photos}
+        imageIndex={imgIndex}
+        // onImageIndexChange={(...props) => {
+        //  // console.log(props);
+        // }}
+      />
+    </SafeAreaView>
+  );
+
+  // return (
+  //   <Modal
+  //     onDismiss={() => setPreviewVisible(false)}
+  //     onRequestClose={() => setPreviewVisible(false)}
+  //     visible={previewVisible}
+  //     transparent={false}
+  //   >
+  //     <SafeAreaView style={{ flex: 1, backgroundColor: "black" }}>
+  //       <Gallery
+  //         initialPage={imgIndex}
+
+  //         images={photos}
+  //         onPageScroll={({ position }) => setcurrentIndex(position)}
+  //         onPageScrollStateChanged={(state) =>
+  //           state === "idle" ? setDragging(false) : setDragging(true)
+  //         }
+  //       />
+  //       <TouchableOpacity
+  //         style={{ position: "absolute" }}
+  //         onPress={() => setPreviewVisible(false)}
+  //       >
+  //         <Ionicons
+  //           name="ios-close"
+  //           size={64}
+  //           color="dodgerblue"
+  //           style={{ margin: 20 }}
+  //         />
+  //       </TouchableOpacity>
+  //       {!dragging && photos[currentIndex] && photos[currentIndex].videoUrl && (
+  //         <TouchableOpacity
+  //           style={{
+  //             position: "absolute",
+  //             left: Dimensions.get("window").width / 2 - 32,
+  //             top: Dimensions.get("window").height / 2 - 32,
+  //             justifyContent: "center",
+  //             alignItems: "center",
+  //           }}
+  //           onPress={async () => {
+  //             await videoRef.current.loadAsync(
+  //               { uri: photos[currentIndex].videoUrl },
+  //               {},
+  //               false
+  //             );
+  //             videoRef.current.presentFullscreenPlayer();
+  //           }}
+  //         >
+  //           <Ionicons name="play" size={64} color="white" />
+  //         </TouchableOpacity>
+  //       )}
+  //     </SafeAreaView>
+  //     <Video ref={videoRef} useNativeControls />
+  //   </Modal>
+  // );
+}