Merge pull request #2 from bagusok/auth-test

Auth test

Author: bagusok

.gitignore

@@ -22,4 +22,6 @@ expo-env.d.ts
 .env
 android
 android/*
-keykey/*
+keykey/*
+
+google-services.json

app.config.js

@@ -0,0 +1,58 @@
+export default {
+  name: "Miramine",
+  slug: "anime-stream",
+  version: "1.0.0",
+  orientation: "portrait",
+  icon: "./assets/images/icon.png",
+  scheme: "myapp",
+  userInterfaceStyle: "automatic",
+  splash: {
+    image: "./assets/images/splash.png",
+    resizeMode: "contain",
+    backgroundColor: "#ffffff",
+  },
+  ios: {
+    supportsTablet: true,
+  },
+  android: {
+    adaptiveIcon: {
+      foregroundImage: "./assets/images/adaptive-icon.png",
+      backgroundColor: "#ffffff",
+    },
+    googleServicesFile: process.env.GOOGLE_SERVICES_JSON,
+    package: "com.bagusok.animestream",
+  },
+  web: {
+    bundler: "metro",
+    output: "static",
+    favicon: "./assets/images/favicon.png",
+  },
+  plugins: [
+    "expo-router",
+    "expo-font",
+    "expo-secure-store",
+    [
+      "expo-screen-orientation",
+      {
+        initialOrientation: "DEFAULT",
+      },
+    ],
+    [
+      "@react-native-google-signin/google-signin",
+      {
+        iosUrlScheme: "com.googleusercontent.apps._some_id_here_",
+      },
+    ],
+  ],
+  experiments: {
+    typedRoutes: true,
+  },
+  extra: {
+    router: {
+      origin: false,
+    },
+    eas: {
+      projectId: "b5f26acf-eff2-492d-8062-7e3d7e82b6b7",
+    },
+  },
+};

app.json

@@ -1,13 +1,24 @@
 import { Tabs } from "expo-router";
 import React from "react";
-
-import { Colors } from "@/constants/Colors";
 import { useColors } from "@/hooks/useColors";
-import { AntDesign, Feather } from "@expo/vector-icons";
+import { Feather } from "@expo/vector-icons";
+import { useAtom } from "jotai";
+import { userAtom } from "@/store/auth";
+import LoadingPage from "@/components/LoadingPage";
+import ErrorPage from "@/components/ErrorPage";
 
 export default function TabLayout() {
   const colors = useColors();
 
+  const [user, setUser] = useAtom(userAtom);
+
+  if (user.isLoading) {
+    return <LoadingPage />;
+  }
+
+  if (user.error) {
+    return <ErrorPage message={user?.error?.message} />;
+  }
   return (
     <Tabs
       screenOptions={{
@@ -16,6 +27,8 @@ export default function TabLayout() {
         tabBarStyle: {
           backgroundColor: colors.background,
           borderTopColor: colors.border,
+          height: 60,
+          paddingTop: 8,
         },
       }}
     >
@@ -28,6 +41,15 @@ export default function TabLayout() {
           ),
         }}
       />
+      <Tabs.Screen
+        name="schedule"
+        options={{
+          title: "Schedule",
+          tabBarIcon: ({ color, focused }) => (
+            <Feather name="calendar" size={24} color={color} />
+          ),
+        }}
+      />
       <Tabs.Screen
         name="all-anime"
         options={{
@@ -37,12 +59,13 @@ export default function TabLayout() {
           ),
         }}
       />
+
       <Tabs.Screen
-        name="schedule"
+        name="bookmark"
         options={{
-          title: "Schedule",
+          title: "Bookmark",
           tabBarIcon: ({ color, focused }) => (
-            <Feather name="calendar" size={24} color={color} />
+            <Feather name="bookmark" size={24} color={color} />
           ),
         }}
       />

app/(home)/_layout.tsx

@@ -1,3 +1,4 @@
+import ErrorPage from "@/components/ErrorPage";
 import LoadingPage from "@/components/LoadingPage";
 import SafeAreaWrapper from "@/components/SafeAreaWrapper";
 import { CustomText } from "@/components/ui";
@@ -6,10 +7,18 @@ import { ThemeColors } from "@/constants/Colors";
 import { API_URL } from "@/constants/Strings";
 import { useColors } from "@/hooks/useColors";
 import { axiosIn } from "@/utils/axios";
+import { Feather } from "@expo/vector-icons";
 
 import { useInfiniteQuery } from "@tanstack/react-query";
+import { router } from "expo-router";
 import { useMemo } from "react";
-import { ActivityIndicator, StyleSheet, View } from "react-native";
+import {
+  ActivityIndicator,
+  StyleSheet,
+  Touchable,
+  TouchableOpacity,
+  View,
+} from "react-native";
 import { FlatList } from "react-native-gesture-handler";
 import { SafeAreaView } from "react-native-safe-area-context";
 
@@ -24,7 +33,10 @@ export default function AllAnime() {
       axiosIn
         .get(`${API_URL}/anime?page=${pageParam}`)
         .then((res) => res.data)
-        .catch((err) => err),
+        .catch((err) => {
+          console.error(err);
+          throw new Error(err);
+        }),
     getNextPageParam: (lastPage) => {
       const nextPage = lastPage.pagination.page + 1;
       return nextPage <= lastPage.pagination.totalPage ? nextPage : null;
@@ -40,19 +52,32 @@ export default function AllAnime() {
     return <LoadingPage />;
   }
 
+  if (allAnime.isError) {
+    return <ErrorPage />;
+  }
+
   return (
     <SafeAreaView>
       <View style={style.header}>
-        <CustomText fontStyle="semibold" size={16}>
+        <CustomText fontStyle="semibold" size={18}>
           All Anime
         </CustomText>
+        <TouchableOpacity
+          onPress={() =>
+            router.push({
+              pathname: "/pages/search",
+            })
+          }
+        >
+          <Feather name="search" size={20} color={colors.text} />
+        </TouchableOpacity>
       </View>
       <View style={style.container}>
         <FlatList
           data={flatData}
           keyExtractor={(item) => item.id}
           renderItem={({ item }) => <CardAllAnime key={item.id} item={item} />}
-          ItemSeparatorComponent={() => <View style={{ height: 16 }} />}
+          ItemSeparatorComponent={() => <View style={{ height: 24 }} />}
           onEndReached={() => {
             if (allAnime.hasNextPage) {
               allAnime.fetchNextPage();
@@ -77,7 +102,7 @@ export default function AllAnime() {
 const createStyles = (colors: ThemeColors) =>
   StyleSheet.create({
     header: {
-      height: 50,
+      height: 60,
       paddingHorizontal: 14,
       flexDirection: "row",
       justifyContent: "space-between",