221018_Jiwon_Auto Login

package.json

@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "@actbase/react-daum-postcode": "^1.0.4",
+    "@react-native-async-storage/async-storage": "^1.17.10",
     "@react-native-community/checkbox": "^0.5.12",
     "@react-native-community/masked-view": "^0.1.11",
     "@react-native-seoul/kakao-login": "^4.2.2",

src/components/Input.js

@@ -87,7 +87,7 @@ const InputType2 = (props) => {
         const {name, obj} = props;
         const imageUrl = '../assets/images/' + obj.type + '.png'
         return(
-            <TouchableOpacity style={InputType2Styles(focused === obj.type).item} activeOpacity={0.6} onPress={() => onChangeType(name, obj.type)}>
+            <TouchableOpacity style={InputType2Styles(focused === obj.type).item} activeOpacity={0.6} onPress={() => onChangeType(name, obj.label)}>
                 <Image source={obj.img} style={InputType2Styles("diary" === obj.type).image}/>
                 <Text style={InputType2Styles().text}>{obj.label}</Text>
             </TouchableOpacity>

src/components/auth/KakaoLogin.js

@@ -10,6 +10,7 @@ import {
 } from "@react-native-seoul/kakao-login";
 import { fontPercentage, heightPercentage, widthPercentage } from "../../ResponsiveSize";
 import { useNavigation } from "@react-navigation/native";
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import { userID } from "../../recoil/recoil";
 import { useRecoilState } from "recoil";
 
@@ -53,6 +54,9 @@ const KakaoLogin = () => {
         console.log('existBool is false')
       }
       else  {
+        AsyncStorage.setItem(
+          'userData',JSON.stringify({'id': profile.id, 'token': JSON.stringify(token)})
+        );
         navigation.navigate('MainScreen');
         console.log('existBool is true');
       }

src/components/auth/NaverLogin.js

@@ -2,6 +2,7 @@ import React, {useEffect, useState} from "react";
 import { Text,StyleSheet, ScrollView, SafeAreaView,View, Pressable, Button, TouchableOpacity,Image} from "react-native";
 import { NaverLogin, getProfile } from "@react-native-seoul/naver-login";
 import { heightPercentage, widthPercentage } from "../../ResponsiveSize";
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import { useRecoilState } from "recoil";
 import { userID } from "../../recoil/recoil";
 
@@ -41,11 +42,15 @@ const Naver_Login = ({navigation}) => {
       }).then(response=>response.json()).then(res=> {
           console.log(res)
           setUserId(res);
+
           if(res == 0){
             navigation.navigate('Nickname',{token:profileResult.response.id});
             console.log('existBool is false')
           }
           else  {
+            AsyncStorage.setItem(
+              'userData',JSON.stringify({'id': profileResult.response.id, 'token': naverToken})
+            );
             navigation.navigate('MainScreen');
             console.log('existBool is true');
           }

src/screens/MainScreen.js

@@ -94,6 +94,7 @@ const MyPageStackScreen = ({navigation}) => {
 
 const MainScreen = (props) => {
   const hide = props.routeName == "WriteNanum" || props.routeName == "WriteNanum2"
+  console.log(hide)
   return (
     <Tab.Navigator
       initialRouteName="NanumiStack"
@@ -112,7 +113,6 @@ const MainScreen = (props) => {
             : 
             <Image source={require('../assets/images/nanumi.png')} style={styles.tabBarIcon}/>
           ),
-          tabBarStyle: { display: hide ? "none" : "flex" }
         }}
       />
       <Tab.Screen

src/screens/RootStack.js

@@ -1,16 +1,18 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import MainScreen from "./MainScreen";
 import InitialScreen from "./auth/InitialScreen"
 import WriteAdress from './nanumi/WriteAdress';
 import Profile from './auth/Profile';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 
 const Stack = createNativeStackNavigator();
 const AuthStack = createNativeStackNavigator();
 
 
 const AuthStackScreen = () => {
+
     return (
       <Stack.Navigator 
         screenOptions={{
@@ -35,9 +37,22 @@ const AuthStackScreen = () => {
 };
 
 const RootStack = () => {
-    return (
+
+  const [isLoggedIn, setIsLoggedIn] = useState("Loading");
+
+  useEffect(()=>{
+    AsyncStorage.getItem('userData', (err, result) => {
+      if(JSON.parse(result).id) setIsLoggedIn(true);
+      else setIsLoggedIn(false);
+
+      console.log(JSON.parse(result))
+    });;
+    console.log(isLoggedIn)
+  },[])
+
+    return (isLoggedIn != "Loading" &&
       <NavigationContainer>
-        <Stack.Navigator initialRouteName="Auth" screenOptions={{headerShown: false}}>
+        <Stack.Navigator initialRouteName={isLoggedIn ? "Main" : "Auth"} screenOptions={{headerShown: false}}>
           <Stack.Screen
             name="Auth"
             component={AuthStackScreen}

src/screens/Search.js

@@ -12,27 +12,23 @@ const Search=()=>{
 
     const path="http://chevita-env.eba-i8jmx3zw.ap-northeast-2.elasticbeanstalk.com/posts";
 
-    const onPressSearch = async() => {
-        console.log(value)
-        await fetch(path).then((res)=>res.json()).then((response)=>
+    useEffect(()=>{
+        fetch(path).then((res)=>res.json()).then((response)=>
             setData(response.data)     
         )
-
-        let item = [...data];
+    },[])
 
-        await setArr(item.filter((item) => item?.title?.includes(value) || item?.content?.includes(value)))
+    const onPressSearch = () => {
+        setArr([...data].filter((item) => item?.title?.includes(value) || item?.content?.includes(value)))
         console.log(arr)
-
     }
 
-
-
     return(
         <SafeAreaView style={{backgroundColor:'#ffffff', flex:1}}>
             <ScrollView contentContainerStyle={{alignItems: 'center', backgroundColor: '#ffffff',}}>
             <SearchBar value={value} setValue={setValue} onPressSearch={onPressSearch}/>
             <View style={{width: '100%'}}> 
-                {arr.map(item=>(
+                {arr.reverse().map(item=>(
                     <Nanumitem userIdx={item.userIdx} postId={item.postIdx} title={item.title} createdTime={item.createdAt} hastag={item.hastag} like={item.totalHearts} d_day={item.expirationDate} locate={item.globalLocation} imgUrl={item.imgUrls} />
                 ))}
             </View>