Revert "fix: #104 #103 #102"

This reverts commit bbaab1994a.

app/(auth)/(tabs)/(libraries)/[libraryId].tsx

@@ -45,7 +45,6 @@ import {
 import { FlashList } from "@shopify/flash-list";
 import { Loader } from "@/components/Loader";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { orientationAtom } from "@/utils/atoms/orientation";
 
 const MemoizedTouchableItemRouter = React.memo(TouchableItemRouter);
 
@@ -64,7 +63,9 @@ const Page = () => {
   const [sortBy, setSortBy] = useAtom(sortByAtom);
   const [sortOrder, setSortOrder] = useAtom(sortOrderAtom);
 
-  const [orientation, setOrientation] = useAtom(orientationAtom);
+  const [orientation, setOrientation] = useState(
+    ScreenOrientation.Orientation.PORTRAIT_UP
+  );
 
   const getNumberOfColumns = useCallback(() => {
     if (orientation === ScreenOrientation.Orientation.PORTRAIT_UP) return 3;
@@ -72,7 +73,7 @@ const Page = () => {
     if (screenWidth < 960) return 6;
     if (screenWidth < 1280) return 7;
     return 6;
-  }, [screenWidth, orientation]);
+  }, [screenWidth]);
 
   useLayoutEffect(() => {
     setSortBy([
@@ -89,6 +90,22 @@ const Page = () => {
     ]);
   }, []);
 
+  useEffect(() => {
+    const subscription = ScreenOrientation.addOrientationChangeListener(
+      (event) => {
+        setOrientation(event.orientationInfo.orientation);
+      }
+    );
+
+    ScreenOrientation.getOrientationAsync().then((initialOrientation) => {
+      setOrientation(initialOrientation);
+    });
+
+    return () => {
+      ScreenOrientation.removeOrientationChangeListener(subscription);
+    };
+  }, []);
+
   const { data: library, isLoading: isLibraryLoading } = useQuery({
     queryKey: ["library", libraryId],
     queryFn: async () => {
@@ -400,7 +417,6 @@ const Page = () => {
       contentInsetAdjustmentBehavior="automatic"
       data={flatData}
       renderItem={renderItem}
-      extraData={orientation}
       keyExtractor={keyExtractor}
       estimatedItemSize={244}
       numColumns={getNumberOfColumns()}

app/_layout.tsx

@@ -13,12 +13,11 @@ import { Stack, useRouter } from "expo-router";
 import * as ScreenOrientation from "expo-screen-orientation";
 import * as SplashScreen from "expo-splash-screen";
 import { StatusBar } from "expo-status-bar";
-import { Provider as JotaiProvider, useAtom } from "jotai";
+import { Provider as JotaiProvider } from "jotai";
 import { useEffect, useRef } from "react";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import "react-native-reanimated";
 import * as Linking from "expo-linking";
-import { orientationAtom } from "@/utils/atoms/orientation";
 
 SplashScreen.preventAutoHideAsync();
 
@@ -46,7 +45,6 @@ export default function RootLayout() {
 
 function Layout() {
   const [settings, updateSettings] = useSettings();
-  const [orientation, setOrientation] = useAtom(orientationAtom);
 
   useKeepAwake();
 
@@ -73,24 +71,8 @@ function Layout() {
       );
   }, [settings]);
 
-  useEffect(() => {
-    const subscription = ScreenOrientation.addOrientationChangeListener(
-      (event) => {
-        console.log(event.orientationInfo.orientation);
-        setOrientation(event.orientationInfo.orientation);
-      }
-    );
-
-    ScreenOrientation.getOrientationAsync().then((initialOrientation) => {
-      setOrientation(initialOrientation);
-    });
-
-    return () => {
-      ScreenOrientation.removeOrientationChangeListener(subscription);
-    };
-  }, []);
-
   const url = Linking.useURL();
+  const router = useRouter();
 
   if (url) {
     const { hostname, path, queryParams } = Linking.parse(url);

utils/atoms/orientation.ts

@@ -1,7 +0,0 @@
-import * as ScreenOrientation from "expo-screen-orientation";
-import { Orientation } from "expo-screen-orientation";
-import { atom } from "jotai";
-
-export const orientationAtom = atom<number>(
-  ScreenOrientation.OrientationLock.PORTRAIT_UP
-);