login #3
@@ -53,12 +53,11 @@ jobs:
|
|||||||
|
|
||||||
- name: Create Release
|
- name: Create Release
|
||||||
uses: https://gitea.com/actions/gitea-release-action@v1
|
uses: https://gitea.com/actions/gitea-release-action@v1
|
||||||
working-directory: .
|
working-directory: dist
|
||||||
with:
|
with:
|
||||||
tag_name: latest
|
tag_name: latest
|
||||||
name: Latest Build
|
name: Latest Build
|
||||||
overwrite_files: true
|
|
||||||
files: |
|
files: |
|
||||||
- dist/build.zip
|
- build.zip
|
||||||
env:
|
env:
|
||||||
GITEA_TOKEN: ${{ secrets.GITEA }}
|
GITEA_TOKEN: ${{ secrets.GITEA }}
|
||||||
18
apk/app/(auth)/_layout.tsx
Normal file
18
apk/app/(auth)/_layout.tsx
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
import { Stack, useRouter } from "expo-router";
|
||||||
|
import { useAuth } from "@/context/auth-context";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
export default function AuthLayout() {
|
||||||
|
const { user } = useAuth();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (user) {
|
||||||
|
router.replace("/(tabs)");
|
||||||
|
} else {
|
||||||
|
router.replace("/(auth)/login");
|
||||||
|
}
|
||||||
|
}, [user]);
|
||||||
|
|
||||||
|
return <Stack />;
|
||||||
|
}
|
||||||
145
apk/app/(auth)/login.tsx
Normal file
145
apk/app/(auth)/login.tsx
Normal file
@@ -0,0 +1,145 @@
|
|||||||
|
import React, { useState } from "react";
|
||||||
|
import { View, Text, TextInput, TouchableOpacity, StyleSheet } from "react-native";
|
||||||
|
import { useAuth } from "@/context/auth-context";
|
||||||
|
|
||||||
|
export default function AuthScreen() {
|
||||||
|
const [isLogin, setIsLogin] = useState(true);
|
||||||
|
|
||||||
|
return isLogin ? (
|
||||||
|
<LoginScreen onSwitch={() => setIsLogin(false)} />
|
||||||
|
) : (
|
||||||
|
<RegisterScreen onSwitch={() => setIsLogin(true)} />
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function LoginScreen({ onSwitch }) {
|
||||||
|
const [email, setEmail] = useState("");
|
||||||
|
const [password, setPassword] = useState("");
|
||||||
|
const { login } = useAuth();
|
||||||
|
|
||||||
|
const handleLogin = () => {
|
||||||
|
console.log("Login ->", { email, password });
|
||||||
|
login(email, password);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<Text style={styles.title}>Welcome Back</Text>
|
||||||
|
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
placeholder="Email"
|
||||||
|
value={email}
|
||||||
|
onChangeText={setEmail}
|
||||||
|
keyboardType="email-address"
|
||||||
|
autoCapitalize="none"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
placeholder="Password"
|
||||||
|
value={password}
|
||||||
|
onChangeText={setPassword}
|
||||||
|
secureTextEntry
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TouchableOpacity style={styles.button} onPress={handleLogin}>
|
||||||
|
<Text style={styles.buttonText}>Login</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
|
||||||
|
<TouchableOpacity onPress={onSwitch}>
|
||||||
|
<Text style={styles.link}>Don't have an account? Register</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function RegisterScreen({ onSwitch }) {
|
||||||
|
const [name, setName] = useState("");
|
||||||
|
const [email, setEmail] = useState("");
|
||||||
|
const [password, setPassword] = useState("");
|
||||||
|
|
||||||
|
const handleRegister = () => {
|
||||||
|
console.log("Register ->", { name, email, password });
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<Text style={styles.title}>Create Account</Text>
|
||||||
|
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
placeholder="Full Name"
|
||||||
|
value={name}
|
||||||
|
onChangeText={setName}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
placeholder="Email"
|
||||||
|
value={email}
|
||||||
|
onChangeText={setEmail}
|
||||||
|
keyboardType="email-address"
|
||||||
|
autoCapitalize="none"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
placeholder="Password"
|
||||||
|
value={password}
|
||||||
|
onChangeText={setPassword}
|
||||||
|
secureTextEntry
|
||||||
|
/>
|
||||||
|
|
||||||
|
<TouchableOpacity style={styles.button} onPress={handleRegister}>
|
||||||
|
<Text style={styles.buttonText}>Register</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
|
||||||
|
<TouchableOpacity onPress={onSwitch}>
|
||||||
|
<Text style={styles.link}>Already have an account? Login</Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
container: {
|
||||||
|
flex: 1,
|
||||||
|
justifyContent: "center",
|
||||||
|
padding: 20,
|
||||||
|
backgroundColor: "#f5f5f5",
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 28,
|
||||||
|
fontWeight: "bold",
|
||||||
|
marginBottom: 30,
|
||||||
|
textAlign: "center",
|
||||||
|
},
|
||||||
|
input: {
|
||||||
|
height: 50,
|
||||||
|
borderColor: "#ccc",
|
||||||
|
borderWidth: 1,
|
||||||
|
borderRadius: 10,
|
||||||
|
paddingHorizontal: 15,
|
||||||
|
marginBottom: 15,
|
||||||
|
backgroundColor: "#fff",
|
||||||
|
},
|
||||||
|
button: {
|
||||||
|
height: 50,
|
||||||
|
backgroundColor: "#4CAF50",
|
||||||
|
borderRadius: 10,
|
||||||
|
justifyContent: "center",
|
||||||
|
alignItems: "center",
|
||||||
|
marginTop: 10,
|
||||||
|
},
|
||||||
|
buttonText: {
|
||||||
|
color: "#fff",
|
||||||
|
fontSize: 16,
|
||||||
|
fontWeight: "bold",
|
||||||
|
},
|
||||||
|
link: {
|
||||||
|
marginTop: 15,
|
||||||
|
textAlign: "center",
|
||||||
|
color: "#007BFF",
|
||||||
|
},
|
||||||
|
});
|
||||||
13
apk/app/(tabs)/_layout.tsx
Normal file
13
apk/app/(tabs)/_layout.tsx
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
// app/(tabs)/_layout.tsx
|
||||||
|
import { Redirect, Tabs } from "expo-router";
|
||||||
|
import { useAuth } from "@/context/auth-context";
|
||||||
|
|
||||||
|
export default function TabsLayout() {
|
||||||
|
const { user } = useAuth();
|
||||||
|
|
||||||
|
if (!user) {
|
||||||
|
return <Redirect href="/(auth)/login" />;
|
||||||
|
}
|
||||||
|
|
||||||
|
return <Tabs />;
|
||||||
|
}
|
||||||
@@ -1,31 +1,11 @@
|
|||||||
import {
|
import RootNavigation from "@/components/views/root-navigation";
|
||||||
DarkTheme,
|
import { AuthProvider } from "@/context/auth-context";
|
||||||
DefaultTheme,
|
|
||||||
ThemeProvider,
|
|
||||||
} from "@react-navigation/native";
|
|
||||||
import { Stack } from "expo-router";
|
|
||||||
import { StatusBar } from "expo-status-bar";
|
|
||||||
import "react-native-reanimated";
|
|
||||||
|
|
||||||
import { BirthdaysProvider } from "@/context/birthdays-context";
|
|
||||||
import { useColorScheme } from "@/hooks/use-color-scheme";
|
|
||||||
|
|
||||||
export const unstable_settings = {
|
|
||||||
anchor: "(tabs)",
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function RootLayout() {
|
export default function RootLayout() {
|
||||||
const colorScheme = useColorScheme();
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<BirthdaysProvider>
|
<AuthProvider>
|
||||||
<ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
|
<RootNavigation />
|
||||||
<Stack>
|
</AuthProvider>
|
||||||
<Stack.Screen name="index" options={{ headerShown: false }} />
|
|
||||||
<Stack.Screen name="add" options={{ headerShown: false }} />
|
|
||||||
</Stack>
|
|
||||||
<StatusBar style="auto" />
|
|
||||||
</ThemeProvider>
|
|
||||||
</BirthdaysProvider>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
9
apk/components/views/root-navigation.tsx
Normal file
9
apk/components/views/root-navigation.tsx
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
import { useEffect } from "react";
|
||||||
|
import { Stack, useRouter, useSegments } from "expo-router";
|
||||||
|
import { useAuth } from "@/context/auth-context";
|
||||||
|
|
||||||
|
export default function RootLayout() {
|
||||||
|
return (
|
||||||
|
<Stack screenOptions={{ headerShown: false }} />
|
||||||
|
);
|
||||||
|
}
|
||||||
31
apk/components/views/tabs.tsx
Normal file
31
apk/components/views/tabs.tsx
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
import {
|
||||||
|
DarkTheme,
|
||||||
|
DefaultTheme,
|
||||||
|
ThemeProvider,
|
||||||
|
} from "@react-navigation/native";
|
||||||
|
import { Stack } from "expo-router";
|
||||||
|
import { StatusBar } from "expo-status-bar";
|
||||||
|
import "react-native-reanimated";
|
||||||
|
|
||||||
|
import { BirthdaysProvider } from "@/context/birthdays-context";
|
||||||
|
import { useColorScheme } from "@/hooks/use-color-scheme";
|
||||||
|
|
||||||
|
export const unstable_settings = {
|
||||||
|
anchor: "(tabs)",
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function RootLayout() {
|
||||||
|
const colorScheme = useColorScheme();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<BirthdaysProvider>
|
||||||
|
<ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
|
||||||
|
<Stack>
|
||||||
|
<Stack.Screen name="index" options={{ headerShown: false }} />
|
||||||
|
<Stack.Screen name="add" options={{ headerShown: false }} />
|
||||||
|
</Stack>
|
||||||
|
<StatusBar style="auto" />
|
||||||
|
</ThemeProvider>
|
||||||
|
</BirthdaysProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
47
apk/context/auth-context.tsx
Normal file
47
apk/context/auth-context.tsx
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||||
|
import * as React from "react";
|
||||||
|
|
||||||
|
interface User {
|
||||||
|
email: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface AuthContextValue {
|
||||||
|
user: User | null;
|
||||||
|
login: (email: string, password: string) => Promise<void>;
|
||||||
|
logout: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const authContext = React.createContext<AuthContextValue | undefined>(undefined);
|
||||||
|
|
||||||
|
export function AuthProvider({ children }: { children: React.ReactNode }) {
|
||||||
|
const [user, setUser] = React.useState<User | null>(null);
|
||||||
|
|
||||||
|
const login = async (email: string, password: string) => {
|
||||||
|
const fakeUser = { email };
|
||||||
|
|
||||||
|
await AsyncStorage.setItem("user", JSON.stringify(fakeUser));
|
||||||
|
setUser(fakeUser);
|
||||||
|
}
|
||||||
|
|
||||||
|
const logout = async () => {
|
||||||
|
await AsyncStorage.removeItem("user");
|
||||||
|
setUser(null);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<authContext.Provider value={{ user, login, logout }}>
|
||||||
|
{children}
|
||||||
|
</authContext.Provider>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useAuth() {
|
||||||
|
const context = React.useContext(authContext);
|
||||||
|
if(!context) {
|
||||||
|
throw new Error("useAuth must be inside AuthProvider");
|
||||||
|
}
|
||||||
|
return context;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user