feat: fixes and formatter

src/screens/Playbacks/Playbacks.js

@@ -1,83 +1,82 @@
-import { useIsFocused, useRoute } from "@react-navigation/native";
-import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { View } from "react-native";
-import Carousel from "react-native-reanimated-carousel";
-import { responsiveHeight } from "react-native-responsive-dimensions";
-import { projectsRef } from "../../config/firebase";
-import useDataFromRef from "../../hooks/useDataFromRef";
-import PlaybackItem from "./components/PlaybackItem";
+import { useIsFocused, useRoute } from '@react-navigation/native'
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { View } from 'react-native'
+import Carousel from 'react-native-reanimated-carousel'
+import { responsiveHeight } from 'react-native-responsive-dimensions'
+import { projectsRef } from '../../config/firebase'
+import useDataFromRef from '../../hooks/useDataFromRef'
+import PlaybackItem from './components/PlaybackItem'
 
 const Playbacks = () => {
-  const [activeIndex, setActiveIndex] = useState(0);
-  const userCache = useRef(new Map());
-  const isFocused = useIsFocused();
-  const route = useRoute();
-  const focusProjectId =
-    route?.params?.projectId || route?.params?.focusId || null;
+  const [activeIndex, setActiveIndex] = useState(0)
+  const userCache = useRef(new Map())
+  const isFocused = useIsFocused()
+  const route = useRoute()
+  const focusProjectId = route?.params?.projectId || route?.params?.focusId || null
   const { data: rawPlaybacks = [], loadMore } = useDataFromRef({
-    ref: projectsRef.where("playbackUrl", "!=", null),
+    ref: projectsRef.where('playbackUrl', '!=', null),
     simpleRef: false,
     listener: false,
     usePagination: true,
     batchSize: 6,
-  });
+  })
   const focusIndex = useMemo(() => {
-    if (!focusProjectId) return -1;
-    return rawPlaybacks.findIndex((p) => p?.id === focusProjectId);
-  }, [focusProjectId, rawPlaybacks]);
+    if (!focusProjectId) return -1
+    return rawPlaybacks.findIndex((p) => p?.id === focusProjectId)
+  }, [focusProjectId, rawPlaybacks])
 
   const playbacks = useMemo(() => {
-    if (focusIndex < 0) return rawPlaybacks;
-    const target = rawPlaybacks[focusIndex];
-    const before = rawPlaybacks.slice(0, focusIndex);
-    const after = rawPlaybacks.slice(focusIndex + 1);
-    return [target, ...after, ...before];
-  }, [focusIndex, rawPlaybacks]);
+    if (focusIndex < 0) return rawPlaybacks
+    const target = rawPlaybacks[focusIndex]
+    const before = rawPlaybacks.slice(0, focusIndex)
+    const after = rawPlaybacks.slice(focusIndex + 1)
+    return [target, ...after, ...before]
+  }, [focusIndex, rawPlaybacks])
 
   const onSnap = useCallback(
     (index) => {
-      setActiveIndex(index);
+      setActiveIndex(index)
       if (index >= (playbacks?.length || 0) - 6) {
-        loadMore?.();
+        loadMore?.()
       }
     },
-    [playbacks?.length, loadMore],
-  );
+    [playbacks?.length, loadMore]
+  )
 
-  const triedLoadMoreRef = useRef(0);
-  const focusLoadAttemptsRef = useRef(0);
-  const hasAppliedFocusRef = useRef(false);
+  const triedLoadMoreRef = useRef(0)
+  const focusLoadAttemptsRef = useRef(0)
+  const hasAppliedFocusRef = useRef(false)
 
   useEffect(() => {
-    focusLoadAttemptsRef.current = 0;
-    hasAppliedFocusRef.current = false;
+    focusLoadAttemptsRef.current = 0
+    hasAppliedFocusRef.current = false
     if (!focusProjectId) {
-      setActiveIndex(0);
+      setActiveIndex(0)
     }
-  }, [focusProjectId]);
+  }, [focusProjectId])
 
   useEffect(() => {
     if (loadMore && triedLoadMoreRef.current < 6) {
-      triedLoadMoreRef.current += 1;
-      loadMore();
+      triedLoadMoreRef.current += 1
+      loadMore()
     }
-  }, [loadMore, playbacks]);
+  }, [loadMore, playbacks])
 
   useEffect(() => {
-    if (!focusProjectId) return;
+    if (!focusProjectId) return
     if (focusIndex >= 0 && !hasAppliedFocusRef.current) {
-      hasAppliedFocusRef.current = true;
-      setActiveIndex(0);
-      return;
+      hasAppliedFocusRef.current = true
+      setActiveIndex(0)
+      return
     }
     if (loadMore && focusLoadAttemptsRef.current < 6) {
-      focusLoadAttemptsRef.current += 1;
-      loadMore();
+      focusLoadAttemptsRef.current += 1
+      loadMore()
     }
-  }, [focusIndex, focusProjectId, loadMore, playbacks]);
+  }, [focusIndex, focusProjectId, loadMore, playbacks])
 
   return (
-    <View style={{ flex: 1, backgroundColor: "black" }}>
+    <View style={{ flex: 1, backgroundColor: 'black' }}>
       <Carousel
         data={playbacks}
         vertical
@@ -95,7 +94,7 @@ const Playbacks = () => {
         )}
       />
     </View>
-  );
-};
+  )
+}
 
-export default Playbacks;
+export default Playbacks