move auth-centext directory

This commit is contained in:
Sosokker 2025-05-09 01:04:44 +07:00
parent e5b6b50376
commit 6b3b6765ef
6 changed files with 128 additions and 88 deletions

View File

@ -1,6 +1,6 @@
import { useAuth } from "@/context/auth-context";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { Tabs, Redirect } from "expo-router"; import { Redirect, Tabs } from "expo-router";
import { useAuth } from ".././context/auth-context";
export default function TabLayout() { export default function TabLayout() {
const { isAuthenticated, isLoading } = useAuth(); const { isAuthenticated, isLoading } = useAuth();

View File

@ -1,27 +1,27 @@
import { AuthProvider } from "@/context/auth-context";
import { Stack } from "expo-router"; import { Stack } from "expo-router";
import { GestureHandlerRootView } from "react-native-gesture-handler"; import { GestureHandlerRootView } from "react-native-gesture-handler";
import { AuthProvider } from "./context/auth-context";
import "../global.css"; import "../global.css";
export default function RootLayout() { export default function RootLayout() {
return ( return (
<GestureHandlerRootView style={{ flex: 1 }}> <GestureHandlerRootView style={{ flex: 1 }}>
<AuthProvider> <AuthProvider>
<Stack screenOptions={{ headerShown: false }}> <Stack screenOptions={{ headerShown: false }}>
<Stack.Screen <Stack.Screen
name="(tabs)" name="(tabs)"
options={{ options={{
headerShown: false, headerShown: false,
}} }}
/> />
<Stack.Screen <Stack.Screen
name="recipe-detail" name="recipe-detail"
options={{ options={{
headerShown: false, headerShown: false,
presentation: "card", presentation: "card",
}} }}
/> />
</Stack> </Stack>
</AuthProvider> </AuthProvider>
</GestureHandlerRootView> </GestureHandlerRootView>
); );

View File

@ -1,7 +1,7 @@
import React from 'react'; import { useAuth } from "@/context/auth-context";
import { View, ActivityIndicator } from 'react-native'; import { Redirect } from "expo-router";
import { Redirect } from 'expo-router'; import React from "react";
import { useAuth } from './context/auth-context'; import { ActivityIndicator, View } from "react-native";
export default function Index() { export default function Index() {
const { isAuthenticated, isLoading } = useAuth(); const { isAuthenticated, isLoading } = useAuth();
@ -9,7 +9,14 @@ export default function Index() {
// Show loading indicator while checking auth status // Show loading indicator while checking auth status
if (isLoading) { if (isLoading) {
return ( return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: 'white' }}> <View
style={{
flex: 1,
alignItems: "center",
justifyContent: "center",
backgroundColor: "white",
}}
>
<ActivityIndicator size="large" color="#ffd60a" /> <ActivityIndicator size="large" color="#ffd60a" />
</View> </View>
); );

View File

@ -1,12 +1,20 @@
import React, { useState } from 'react'; import { useAuth } from "@/context/auth-context";
import { View, Text, TextInput, TouchableOpacity, SafeAreaView, StatusBar, Alert } from 'react-native'; import { Feather } from "@expo/vector-icons";
import { router } from 'expo-router'; import { router } from "expo-router";
import { Feather } from '@expo/vector-icons'; import React, { useState } from "react";
import { useAuth } from './context/auth-context'; import {
Alert,
SafeAreaView,
StatusBar,
Text,
TextInput,
TouchableOpacity,
View,
} from "react-native";
export default function LoginScreen() { export default function LoginScreen() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState("");
const [password, setPassword] = useState(''); const [password, setPassword] = useState("");
const [showPassword, setShowPassword] = useState(false); const [showPassword, setShowPassword] = useState(false);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
@ -14,7 +22,7 @@ export default function LoginScreen() {
const handleLogin = async () => { const handleLogin = async () => {
if (!email || !password) { if (!email || !password) {
Alert.alert('Error', 'Please fill in all fields'); Alert.alert("Error", "Please fill in all fields");
return; return;
} }
@ -22,7 +30,7 @@ export default function LoginScreen() {
setIsLoading(true); setIsLoading(true);
await login(email, password); await login(email, password);
} catch (error) { } catch (error) {
Alert.alert('Error', 'Failed to login. Please try again.'); Alert.alert("Error", "Failed to login. Please try again.");
} finally { } finally {
setIsLoading(false); setIsLoading(false);
} }
@ -73,13 +81,19 @@ export default function LoginScreen() {
className="pr-4" className="pr-4"
onPress={() => setShowPassword(!showPassword)} onPress={() => setShowPassword(!showPassword)}
> >
<Feather name={showPassword ? "eye-off" : "eye"} size={20} color="gray" /> <Feather
name={showPassword ? "eye-off" : "eye"}
size={20}
color="gray"
/>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
<TouchableOpacity> <TouchableOpacity>
<Text className="text-right text-[#bb0718] font-medium">Forgot Password?</Text> <Text className="text-right text-[#bb0718] font-medium">
Forgot Password?
</Text>
</TouchableOpacity> </TouchableOpacity>
<TouchableOpacity <TouchableOpacity
@ -88,15 +102,15 @@ export default function LoginScreen() {
disabled={isLoading} disabled={isLoading}
> >
<Text className="text-center font-bold text-lg"> <Text className="text-center font-bold text-lg">
{isLoading ? 'Logging in...' : 'Login'} {isLoading ? "Logging in..." : "Login"}
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
{/* Sign Up Link */} {/* Sign Up Link */}
<View className="flex-row justify-center mt-8"> <View className="flex-row justify-center mt-8">
<Text className="text-gray-600">Don't have an account? </Text> <Text className="text-gray-600">Don&apos;t have an account? </Text>
<TouchableOpacity onPress={() => router.push('/signup')}> <TouchableOpacity onPress={() => router.push("/signup")}>
<Text className="text-[#bb0718] font-medium">Sign Up</Text> <Text className="text-[#bb0718] font-medium">Sign Up</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>

View File

@ -1,14 +1,23 @@
import React, { useState } from 'react'; import { useAuth } from "@/context/auth-context";
import { View, Text, TextInput, TouchableOpacity, SafeAreaView, StatusBar, Alert, ScrollView } from 'react-native'; import { Feather } from "@expo/vector-icons";
import { router } from 'expo-router'; import { router } from "expo-router";
import { Feather } from '@expo/vector-icons'; import React, { useState } from "react";
import { useAuth } from './context/auth-context'; import {
Alert,
SafeAreaView,
ScrollView,
StatusBar,
Text,
TextInput,
TouchableOpacity,
View,
} from "react-native";
export default function SignupScreen() { export default function SignupScreen() {
const [name, setName] = useState(''); const [name, setName] = useState("");
const [email, setEmail] = useState(''); const [email, setEmail] = useState("");
const [password, setPassword] = useState(''); const [password, setPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState(''); const [confirmPassword, setConfirmPassword] = useState("");
const [showPassword, setShowPassword] = useState(false); const [showPassword, setShowPassword] = useState(false);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
@ -16,12 +25,12 @@ export default function SignupScreen() {
const handleSignup = async () => { const handleSignup = async () => {
if (!name || !email || !password || !confirmPassword) { if (!name || !email || !password || !confirmPassword) {
Alert.alert('Error', 'Please fill in all fields'); Alert.alert("Error", "Please fill in all fields");
return; return;
} }
if (password !== confirmPassword) { if (password !== confirmPassword) {
Alert.alert('Error', 'Passwords do not match'); Alert.alert("Error", "Passwords do not match");
return; return;
} }
@ -29,7 +38,7 @@ export default function SignupScreen() {
setIsLoading(true); setIsLoading(true);
await signup(name, email, password); await signup(name, email, password);
} catch (error) { } catch (error) {
Alert.alert('Error', 'Failed to sign up. Please try again.'); Alert.alert("Error", "Failed to sign up. Please try again.");
} finally { } finally {
setIsLoading(false); setIsLoading(false);
} }
@ -91,13 +100,19 @@ export default function SignupScreen() {
className="pr-4" className="pr-4"
onPress={() => setShowPassword(!showPassword)} onPress={() => setShowPassword(!showPassword)}
> >
<Feather name={showPassword ? "eye-off" : "eye"} size={20} color="gray" /> <Feather
name={showPassword ? "eye-off" : "eye"}
size={20}
color="gray"
/>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
<View> <View>
<Text className="text-gray-700 mb-2 font-medium">Confirm Password</Text> <Text className="text-gray-700 mb-2 font-medium">
Confirm Password
</Text>
<View className="flex-row items-center bg-gray-100 rounded-xl"> <View className="flex-row items-center bg-gray-100 rounded-xl">
<TextInput <TextInput
className="flex-1 py-4 px-4" className="flex-1 py-4 px-4"
@ -111,7 +126,11 @@ export default function SignupScreen() {
className="pr-4" className="pr-4"
onPress={() => setShowPassword(!showPassword)} onPress={() => setShowPassword(!showPassword)}
> >
<Feather name={showPassword ? "eye-off" : "eye"} size={20} color="gray" /> <Feather
name={showPassword ? "eye-off" : "eye"}
size={20}
color="gray"
/>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
@ -122,7 +141,7 @@ export default function SignupScreen() {
disabled={isLoading} disabled={isLoading}
> >
<Text className="text-center font-bold text-lg"> <Text className="text-center font-bold text-lg">
{isLoading ? 'Signing up...' : 'Sign Up'} {isLoading ? "Signing up..." : "Sign Up"}
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -130,7 +149,7 @@ export default function SignupScreen() {
{/* Login Link */} {/* Login Link */}
<View className="flex-row justify-center mt-8 mb-4"> <View className="flex-row justify-center mt-8 mb-4">
<Text className="text-gray-600">Already have an account? </Text> <Text className="text-gray-600">Already have an account? </Text>
<TouchableOpacity onPress={() => router.push('/login')}> <TouchableOpacity onPress={() => router.push("/login")}>
<Text className="text-[#bb0718] font-medium">Login</Text> <Text className="text-[#bb0718] font-medium">Login</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>