moved files outside of /app

apps/expo/src/app/_layout.tsx

@@ -12,7 +12,7 @@ import {
 
 import Colors from "@movie-web/tailwind-config/colors";
 
-import "./styles/global.css";
+import "../styles/global.css";
 
 export {
   // Catch any errors thrown by the Layout component.

apps/expo/src/app/components/TabBarIcon.tsx

@@ -1,17 +0,0 @@
-import { FontAwesome } from "@expo/vector-icons";
-
-import Colors from "@movie-web/tailwind-config/colors";
-
-type Props = {
-  focused?: boolean;
-} & React.ComponentProps<typeof FontAwesome>;
-
-export default function TabBarIcon({ focused, ...rest }: Props) {
-  return (
-    <FontAwesome
-      color={focused ? Colors.primary[300] : Colors.secondary[300]}
-      size={24}
-      {...rest}
-    />
-  );
-}

apps/expo/src/app/components/item/item.tsx

@@ -1,49 +0,0 @@
-import { Image, TouchableOpacity, View } from "react-native";
-import { useRouter } from "expo-router";
-
-import { Text } from "~/components/ui/Text";
-
-export interface ItemData {
-  id: string;
-  title: string;
-  type: "movie" | "tv";
-  year: number;
-  posterUrl: string;
-}
-
-export default function Item({ data }: { data: ItemData }) {
-  const router = useRouter();
-  const { title, type, year, posterUrl } = data;
-
-  const handlePress = () => {
-    router.push({
-      pathname: "/video-player",
-      params: { data: JSON.stringify(data) },
-    });
-  };
-
-  return (
-    <TouchableOpacity onPress={handlePress} style={{ width: "100%" }}>
-      {
-        <View className="w-full">
-          <View className="mb-2 aspect-[9/14] w-full overflow-hidden rounded-2xl">
-            <Image
-              source={{
-                uri: posterUrl,
-              }}
-              className="h-full w-full"
-            />
-          </View>
-          <Text className="font-bold">{title}</Text>
-          <View className="flex-row items-center gap-3">
-            <Text className="text-xs text-gray-600">
-              {type === "tv" ? "Show" : "Movie"}
-            </Text>
-            <View className="h-1 w-1 rounded-3xl bg-gray-600" />
-            <Text className="text-sm text-gray-600">{year}</Text>
-          </View>
-        </View>
-      }
-    </TouchableOpacity>
-  );
-}

apps/expo/src/app/components/layout/ScreenLayout.tsx

@@ -1,22 +0,0 @@
-import { View } from "react-native";
-
-import { Text } from "~/components/ui/Text";
-
-interface Props {
-  title?: React.ReactNode | string;
-  subtitle?: string;
-  children?: React.ReactNode;
-}
-
-export default function ScreenLayout({ title, subtitle, children }: Props) {
-  return (
-    <View className="bg-shade-900 flex-1 p-12">
-      {typeof title === "string" && (
-        <Text className="text-2xl font-bold">{title}</Text>
-      )}
-      {typeof title !== "string" && title}
-      <Text className="mt-1 text-sm font-bold">{subtitle}</Text>
-      <View className="py-3">{children}</View>
-    </View>
-  );
-}

apps/expo/src/app/components/ui/Text.tsx

@@ -1,18 +0,0 @@
-import type { TextProps } from "react-native";
-import { Text as RNText } from "react-native";
-import { cva } from "class-variance-authority";
-
-import { cn } from "~/app/lib/utils";
-
-const textVariants = cva("text-white");
-
-export function Text({ className, ...props }: TextProps) {
-  return (
-    <RNText
-      className={cn(className, textVariants(), {
-        "font-sans": !className?.includes("font-"),
-      })}
-      {...props}
-    />
-  );
-}

apps/expo/src/app/hooks/usePlayer.ts

@@ -1,41 +0,0 @@
-import type { VideoRef } from "react-native-video";
-import { useCallback, useRef } from "react";
-import * as ScreenOrientation from "expo-screen-orientation";
-
-export const usePlayer = () => {
-  const ref = useRef<VideoRef>(null);
-
-  const lockOrientation = useCallback(async () => {
-    await ScreenOrientation.lockAsync(
-      ScreenOrientation.OrientationLock.LANDSCAPE,
-    );
-  }, []);
-
-  const unlockOrientation = useCallback(async () => {
-    await ScreenOrientation.lockAsync(
-      ScreenOrientation.OrientationLock.PORTRAIT_UP,
-    );
-  }, []);
-
-  const presentFullscreenPlayer = useCallback(async () => {
-    if (ref.current) {
-      ref.current.presentFullscreenPlayer();
-      await lockOrientation();
-    }
-  }, [lockOrientation]);
-
-  const dismissFullscreenPlayer = useCallback(async () => {
-    if (ref.current) {
-      ref.current.dismissFullscreenPlayer();
-      await unlockOrientation();
-    }
-  }, [unlockOrientation]);
-
-  return {
-    videoRef: ref,
-    lockOrientation,
-    unlockOrientation,
-    presentFullscreenPlayer,
-    dismissFullscreenPlayer,
-  } as const;
-};

apps/expo/src/app/lib/utils.ts

@@ -1,7 +0,0 @@
-import type { ClassValue } from "clsx";
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}

apps/expo/src/app/styles/global.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

apps/expo/src/app/video-player.tsx

@@ -13,8 +13,8 @@ import {
 } from "@movie-web/provider-utils";
 import { fetchMediaDetails } from "@movie-web/tmdb";
 
-import type { ItemData } from "./components/item/item";
-import { usePlayer } from "./hooks/usePlayer";
+import type { ItemData } from "~/components/item/item";
+import { usePlayer } from "../hooks/usePlayer";
 
 export default function VideoPlayerWrapper() {
   const params = useLocalSearchParams();