Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 858ee5e28b | |||
| 928db54b3e | |||
| 72b45335dd | |||
| 6f238b4d80 | |||
| adfd3e770c | |||
| 5977bd790a | |||
| bb304c5bd9 | |||
| 806e1e7f5b |
51
.gitea/workflows/build-apk.yml
Normal file
51
.gitea/workflows/build-apk.yml
Normal file
@@ -0,0 +1,51 @@
|
||||
name: Build APK
|
||||
|
||||
on:
|
||||
push:
|
||||
branches: [ master ]
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
defaults:
|
||||
run:
|
||||
shell: bash
|
||||
working-directory: ./apk
|
||||
|
||||
steps:
|
||||
- name: 📥 Checkout
|
||||
uses: actions/checkout@v4
|
||||
|
||||
- name: 🟢 Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 20
|
||||
|
||||
- name: 📦 Install dependencies
|
||||
run: npm install
|
||||
|
||||
- name: ☕ Setup Java
|
||||
uses: actions/setup-java@v4
|
||||
with:
|
||||
distribution: temurin
|
||||
java-version: 17
|
||||
|
||||
- name: 📱 Setup Android SDK
|
||||
uses: android-actions/setup-android@v3
|
||||
|
||||
- name: ⚙️ Expo prebuild
|
||||
run: npx expo prebuild --clean --non-interactive
|
||||
|
||||
- name: 🔐 Decode Keystore
|
||||
run: |
|
||||
echo "${{ secrets.KEYSTORE_BASE64 }}" | base64 --decode > android/release.keystore
|
||||
|
||||
- name: 🏗️ Build APK (Release)
|
||||
working-directory: ./apk/android
|
||||
run: |
|
||||
./gradlew assembleRelease
|
||||
- name: 📤 Upload APK Artifact
|
||||
uses: actions/upload-artifact@v3
|
||||
with:
|
||||
name: app-release-apk
|
||||
path: apk/android/app/build/outputs/apk/release/app-release.apk
|
||||
23
apk/app.json
23
apk/app.json
@@ -9,7 +9,8 @@
|
||||
"userInterfaceStyle": "automatic",
|
||||
"newArchEnabled": true,
|
||||
"ios": {
|
||||
"supportsTablet": true
|
||||
"supportsTablet": true,
|
||||
"bundleIdentifier": "com.arandano69.Birthday"
|
||||
},
|
||||
"android": {
|
||||
"permissions": [
|
||||
@@ -22,7 +23,8 @@
|
||||
"monochromeImage": "./assets/images/android-icon-monochrome.png"
|
||||
},
|
||||
"edgeToEdgeEnabled": true,
|
||||
"predictiveBackGestureEnabled": false
|
||||
"predictiveBackGestureEnabled": false,
|
||||
"package": "com.arandano69.Birthday"
|
||||
},
|
||||
"web": {
|
||||
"output": "static",
|
||||
@@ -42,11 +44,28 @@
|
||||
"backgroundColor": "#000000"
|
||||
}
|
||||
}
|
||||
],
|
||||
[
|
||||
"expo-build-properties",
|
||||
{
|
||||
"android": {
|
||||
"gradleProperties": {
|
||||
"org.gradle.jvmargs": "-Xmx2g -XX:MaxMetaspaceSize=512m",
|
||||
"org.gradle.parallel": "false"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
],
|
||||
"experiments": {
|
||||
"typedRoutes": true,
|
||||
"reactCompiler": true
|
||||
},
|
||||
"extra": {
|
||||
"router": {},
|
||||
"eas": {
|
||||
"projectId": "f761fcbd-46f2-4387-8282-005e44223075"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
5
apk/app/(auth)/_layout.tsx
Normal file
5
apk/app/(auth)/_layout.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import { Stack } from "expo-router";
|
||||
|
||||
export default function AuthLayout() {
|
||||
return <Stack screenOptions={{ headerShown: false }} />;
|
||||
}
|
||||
149
apk/app/(auth)/login.tsx
Normal file
149
apk/app/(auth)/login.tsx
Normal file
@@ -0,0 +1,149 @@
|
||||
import React, { useState } from "react";
|
||||
import { View, Text, TextInput, TouchableOpacity, StyleSheet } from "react-native";
|
||||
import { useAuth } from "@/context/auth-context";
|
||||
import { router } from "expo-router";
|
||||
|
||||
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 = async () => {
|
||||
const loginResult = await login(email, password);
|
||||
if (loginResult) {
|
||||
console.log("Login successful");
|
||||
router.replace("/(tabs)");
|
||||
}
|
||||
};
|
||||
|
||||
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",
|
||||
},
|
||||
});
|
||||
25
apk/app/(tabs)/_layout.tsx
Normal file
25
apk/app/(tabs)/_layout.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
import { Tabs } from "expo-router";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
|
||||
export default function TabsLayout() {
|
||||
return (
|
||||
<Tabs
|
||||
screenOptions={{
|
||||
headerShown: false,
|
||||
}}
|
||||
>
|
||||
<Tabs.Screen name="index" options={{
|
||||
title: "Birthdays",
|
||||
tabBarIcon: ({ color, size }) => (
|
||||
<Ionicons name="gift" size={size} color={color} />
|
||||
),
|
||||
}} />
|
||||
<Tabs.Screen name="settings" options={{
|
||||
title: "Settings",
|
||||
tabBarIcon: ({ color, size }) => (
|
||||
<Ionicons name="settings" size={size} color={color} />
|
||||
),
|
||||
}} />
|
||||
</Tabs>
|
||||
);
|
||||
}
|
||||
@@ -14,7 +14,11 @@ export default function HomeScreen() {
|
||||
<View style={styles.actionsContainer}>
|
||||
<Text style={styles.title}>Upcoming Birthdays</Text>
|
||||
<TouchableOpacity
|
||||
onPress={() => router.push("/add")}
|
||||
onPress={() => {
|
||||
router.push("/add");
|
||||
}
|
||||
}
|
||||
|
||||
style={styles.addButton}
|
||||
>
|
||||
<Text style={styles.addButtonText}>+</Text>
|
||||
148
apk/app/(tabs)/settings.tsx
Normal file
148
apk/app/(tabs)/settings.tsx
Normal file
@@ -0,0 +1,148 @@
|
||||
import React, { useState } from "react";
|
||||
import { StyleSheet, Text, View, TouchableOpacity, Alert } from "react-native";
|
||||
import { SafeAreaView } from "react-native-safe-area-context";
|
||||
|
||||
import { useRouter } from "expo-router";
|
||||
import { useAuth } from "@/context/auth-context";
|
||||
|
||||
export default function SettingsScreen() {
|
||||
const router = useRouter()
|
||||
const { logout } = useAuth();
|
||||
const [theme, setTheme] = useState("light"); // light | dark | system
|
||||
|
||||
const handleLogout = () => {
|
||||
Alert.alert("Logout", "Are you sure you want to logout?", [
|
||||
{ text: "Cancel", style: "cancel" },
|
||||
{
|
||||
text: "Logout",
|
||||
style: "destructive",
|
||||
onPress: () => {
|
||||
// TODO: clear auth state here
|
||||
router.replace("/login");
|
||||
logout();
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
||||
|
||||
const toggleTheme = (value) => {
|
||||
setTheme(value);
|
||||
// TODO: persist theme (AsyncStorage / context / zustand)
|
||||
};
|
||||
|
||||
return (
|
||||
<SafeAreaView style={styles.screen} edges={["top", "bottom"]}>
|
||||
<View style={styles.content}>
|
||||
|
||||
<Text style={styles.title}>Settings</Text>
|
||||
|
||||
{/* Theme Selector */}
|
||||
<View style={styles.section}>
|
||||
<Text style={styles.sectionTitle}>Theme</Text>
|
||||
|
||||
<View style={styles.row}>
|
||||
<ThemeButton
|
||||
label="Light"
|
||||
active={theme === "light"}
|
||||
onPress={() => toggleTheme("light")}
|
||||
/>
|
||||
<ThemeButton
|
||||
label="Dark"
|
||||
active={theme === "dark"}
|
||||
onPress={() => toggleTheme("dark")}
|
||||
/>
|
||||
<ThemeButton
|
||||
label="System"
|
||||
active={theme === "system"}
|
||||
onPress={() => toggleTheme("system")}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Logout */}
|
||||
<View style={styles.section}>
|
||||
<Text style={styles.sectionTitle}>Account</Text>
|
||||
|
||||
<TouchableOpacity style={styles.logoutButton} onPress={handleLogout}>
|
||||
<Text style={styles.logoutText}>Log Out</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
</View>
|
||||
</SafeAreaView>
|
||||
);
|
||||
}
|
||||
|
||||
function ThemeButton({ label, active, onPress }) {
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={onPress}
|
||||
style={[styles.themeButton, active && styles.themeButtonActive]}
|
||||
>
|
||||
<Text style={[styles.themeText, active && styles.themeTextActive]}>
|
||||
{label}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
screen: {
|
||||
flex: 1,
|
||||
backgroundColor: "#fff",
|
||||
},
|
||||
content: {
|
||||
flex: 1,
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 12,
|
||||
},
|
||||
title: {
|
||||
fontSize: 24,
|
||||
fontWeight: "bold",
|
||||
marginBottom: 20,
|
||||
},
|
||||
|
||||
section: {
|
||||
marginBottom: 24,
|
||||
},
|
||||
sectionTitle: {
|
||||
fontSize: 16,
|
||||
fontWeight: "600",
|
||||
marginBottom: 10,
|
||||
},
|
||||
|
||||
row: {
|
||||
flexDirection: "row",
|
||||
gap: 10,
|
||||
},
|
||||
|
||||
themeButton: {
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 12,
|
||||
borderRadius: 8,
|
||||
borderWidth: 1,
|
||||
borderColor: "#ccc",
|
||||
},
|
||||
themeButtonActive: {
|
||||
backgroundColor: "#111",
|
||||
borderColor: "#111",
|
||||
},
|
||||
themeText: {
|
||||
color: "#333",
|
||||
paddingHorizontal: 5,
|
||||
},
|
||||
themeTextActive: {
|
||||
color: "#fff",
|
||||
},
|
||||
|
||||
logoutButton: {
|
||||
padding: 14,
|
||||
borderRadius: 10,
|
||||
backgroundColor: "#ff3b30",
|
||||
alignItems: "center",
|
||||
},
|
||||
logoutText: {
|
||||
color: "#fff",
|
||||
fontWeight: "600",
|
||||
},
|
||||
});
|
||||
@@ -1,31 +1,11 @@
|
||||
import {
|
||||
DarkTheme,
|
||||
DefaultTheme,
|
||||
ThemeProvider,
|
||||
} from "@react-navigation/native";
|
||||
import { Stack } from "expo-router";
|
||||
import { StatusBar } from "expo-status-bar";
|
||||
import "react-native-reanimated";
|
||||
import RootNavigation from "@/components/views/root-navigation";
|
||||
import { AuthProvider } from "@/context/auth-context";
|
||||
|
||||
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>
|
||||
<AuthProvider>
|
||||
<RootNavigation />
|
||||
</AuthProvider>
|
||||
);
|
||||
}
|
||||
59
apk/build.sh
Executable file
59
apk/build.sh
Executable file
@@ -0,0 +1,59 @@
|
||||
#!/bin/bash
|
||||
export ANDROID_HOME=$HOME/android
|
||||
export ANDROID_SDK_ROOT=$ANDROID_HOME
|
||||
export PATH=$ANDROID_HOME/emulator:$ANDROID_HOME/platform-tools:$ANDROID_HOME/tools:$ANDROID_HOME/tools/bin:$PATH
|
||||
|
||||
set -e # stop on error
|
||||
|
||||
echo "🚧 Starting APK build..."
|
||||
|
||||
# Step 1: Ensure native android folder exists
|
||||
if [ ! -d "android" ]; then
|
||||
echo "📦 Running Expo prebuild..."
|
||||
npx expo prebuild
|
||||
fi
|
||||
|
||||
# Step 2: Go to android folder
|
||||
cd android
|
||||
|
||||
# Step 3: Check if keystore exists
|
||||
KEYSTORE_FILE="app/my-release-key.keystore"
|
||||
|
||||
if [ ! -f "$KEYSTORE_FILE" ]; then
|
||||
echo "🔑 Generating keystore..."
|
||||
|
||||
keytool -genkeypair -v \
|
||||
-storetype PKCS12 \
|
||||
-keystore $KEYSTORE_FILE \
|
||||
-alias my-key-alias \
|
||||
-keyalg RSA \
|
||||
-keysize 2048 \
|
||||
-validity 10000 \
|
||||
-storepass password \
|
||||
-keypass password \
|
||||
-dname "CN=Your Name, OU=Dev, O=MyApp, L=City, S=State, C=US"
|
||||
fi
|
||||
|
||||
# Step 4: Ensure gradle.properties has signing config
|
||||
GRADLE_PROPS="gradle.properties"
|
||||
|
||||
if ! grep -q "MYAPP_UPLOAD_STORE_FILE" $GRADLE_PROPS; then
|
||||
echo "⚙️ Adding signing config..."
|
||||
|
||||
cat <<EOF >> $GRADLE_PROPS
|
||||
MYAPP_UPLOAD_STORE_FILE=my-release-key.keystore
|
||||
MYAPP_UPLOAD_KEY_ALIAS=my-key-alias
|
||||
MYAPP_UPLOAD_STORE_PASSWORD=password
|
||||
MYAPP_UPLOAD_KEY_PASSWORD=password
|
||||
EOF
|
||||
fi
|
||||
|
||||
# Step 5: Build release APK
|
||||
echo "🏗️ Building APK..."
|
||||
./gradlew assembleRelease
|
||||
|
||||
# Step 6: Output path
|
||||
APK_PATH="app/build/outputs/apk/release/app-release.apk"
|
||||
|
||||
echo "✅ Build complete!"
|
||||
echo "📦 APK located at: android/$APK_PATH"
|
||||
@@ -52,34 +52,44 @@ export function BirthdayList() {
|
||||
|
||||
// Helper function to group and sort
|
||||
function groupBirthdaysByDate(data: BirthdayEntry[]): SectionData[] {
|
||||
// Sort by date
|
||||
const today = new Date();
|
||||
const currentYear = today.getFullYear();
|
||||
const todayAtMidnight = new Date(today);
|
||||
todayAtMidnight.setHours(0, 0, 0, 0);
|
||||
|
||||
const daysUntilNext = (month: number, day: number) => {
|
||||
let target = new Date(currentYear, month, day);
|
||||
if(target < today.setHours(0, 0, 0, 0)){
|
||||
if (target < todayAtMidnight) {
|
||||
target = new Date(currentYear + 1, month, day);
|
||||
}
|
||||
const msPerDay = 1000 * 60 * 60 * 24;
|
||||
const diff = target - new Date(today.setHours(0,0,0,0));
|
||||
const diff = target.getTime() - todayAtMidnight.getTime();
|
||||
return Math.ceil(diff / msPerDay);
|
||||
};
|
||||
|
||||
const sorted = [...data].sort((a, b) => {
|
||||
const dateA = parseBirthdayDate(a);
|
||||
const dateB = parseBirthdayDate(b);
|
||||
return daysUntilNext(dateA.getMonth(), dateA.getDate()) - daysUntilNext(dateB.getMonth(), dateB.getDate());
|
||||
const dateA = parseBirthdayDate(a.date);
|
||||
const dateB = parseBirthdayDate(b.date);
|
||||
|
||||
const nextBirthdayDiff =
|
||||
daysUntilNext(dateA.getMonth(), dateA.getDate()) -
|
||||
daysUntilNext(dateB.getMonth(), dateB.getDate());
|
||||
|
||||
if (nextBirthdayDiff !== 0) {
|
||||
return nextBirthdayDiff;
|
||||
}
|
||||
|
||||
return dateA.getFullYear() - dateB.getFullYear();
|
||||
});
|
||||
|
||||
// Group by date
|
||||
const grouped = sorted.reduce((acc, item) => {
|
||||
const existing = acc.find((section) => section.title === item.date);
|
||||
const sectionKey = getMonthDayKey(item.date);
|
||||
const existing = acc.find((section) => section.title === sectionKey);
|
||||
|
||||
if (existing) {
|
||||
existing.data.push(item);
|
||||
} else {
|
||||
acc.push({ title: item.date, data: [item] });
|
||||
acc.push({ title: sectionKey, data: [item] });
|
||||
}
|
||||
|
||||
return acc;
|
||||
@@ -92,11 +102,20 @@ function parseBirthdayDate(date: string) {
|
||||
return new Date(`${date}T00:00:00`);
|
||||
}
|
||||
|
||||
function getMonthDayKey(date: string) {
|
||||
const parsedDate = parseBirthdayDate(date);
|
||||
const month = `${parsedDate.getMonth() + 1}`.padStart(2, "0");
|
||||
const day = `${parsedDate.getDate()}`.padStart(2, "0");
|
||||
|
||||
return `${month}-${day}`;
|
||||
}
|
||||
|
||||
function formatDisplayDate(date: string) {
|
||||
return parseBirthdayDate(date).toLocaleDateString(undefined, {
|
||||
const [month, day] = date.split("-").map(Number);
|
||||
|
||||
return new Date(2000, month - 1, day).toLocaleDateString(undefined, {
|
||||
month: "long",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -1,10 +1,8 @@
|
||||
import { StyleSheet } from "react-native";
|
||||
import { StyleSheet, View } from "react-native";
|
||||
import Animated, { useAnimatedRef } from "react-native-reanimated";
|
||||
|
||||
import { useColorScheme } from "@/hooks/use-color-scheme";
|
||||
import { useThemeColor } from "@/hooks/use-theme-color";
|
||||
import { PropsWithChildren } from "react";
|
||||
import { View } from "react-native";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
|
||||
type Props = PropsWithChildren<{
|
||||
@@ -14,7 +12,6 @@ type Props = PropsWithChildren<{
|
||||
export default function ScrollView({ children, headerBackgroundColor }: Props) {
|
||||
const scrollRef = useAnimatedRef<Animated.ScrollView>();
|
||||
const insets = useSafeAreaInsets();
|
||||
const colorScheme = useColorScheme() ?? "light";
|
||||
const backgroundColor = useThemeColor({}, "background");
|
||||
|
||||
return (
|
||||
|
||||
23
apk/components/views/loading-screen.tsx
Normal file
23
apk/components/views/loading-screen.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import React from "react";
|
||||
import { View, Text, ActivityIndicator, StyleSheet } from "react-native";
|
||||
|
||||
export default function LoadingScreen({ message = "Loading..." }) {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<ActivityIndicator size="large" color="#ffffff" />
|
||||
<Text style={styles.text}>{message}</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
},
|
||||
text: {
|
||||
marginTop: 10,
|
||||
fontSize: 16,
|
||||
},
|
||||
});
|
||||
36
apk/components/views/root-navigation.tsx
Normal file
36
apk/components/views/root-navigation.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
import { BirthdaysProvider } from "@/context/birthdays-context";
|
||||
import { useAuth } from "@/context/auth-context";
|
||||
import { Stack, router, useRootNavigationState, useSegments } from "expo-router";
|
||||
import React, { useEffect } from "react";
|
||||
import LoadingScreen from "./loading-screen";
|
||||
|
||||
export default function RootLayout() {
|
||||
const { user, isHydrated } = useAuth();
|
||||
const navigationState = useRootNavigationState();
|
||||
const segments = useSegments();
|
||||
const [loaded, setLoaded] = React.useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isHydrated || !navigationState?.key) return;
|
||||
|
||||
const inAuthGroup = segments.length === 0;
|
||||
|
||||
if (!user) {
|
||||
router.replace("/(auth)/login");
|
||||
} else if (inAuthGroup) {
|
||||
router.replace("/(tabs)");
|
||||
}
|
||||
|
||||
setLoaded(true); // 👈 ALWAYS run this
|
||||
}, [isHydrated, navigationState?.key, segments, user]);
|
||||
|
||||
if(!loaded) {
|
||||
return (<LoadingScreen />); // or a loading spinner
|
||||
}
|
||||
|
||||
return (
|
||||
<BirthdaysProvider>
|
||||
<Stack screenOptions={{ headerShown: false }} />
|
||||
</BirthdaysProvider>
|
||||
);
|
||||
}
|
||||
69
apk/context/auth-context.tsx
Normal file
69
apk/context/auth-context.tsx
Normal file
@@ -0,0 +1,69 @@
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import * as React from "react";
|
||||
|
||||
interface User {
|
||||
email: string;
|
||||
}
|
||||
|
||||
interface AuthContextValue {
|
||||
user: User | null;
|
||||
isHydrated: boolean;
|
||||
login: (email: string, password: string) => Promise<boolean>;
|
||||
logout: () => Promise<void>;
|
||||
}
|
||||
|
||||
const authContext = React.createContext<AuthContextValue | undefined>(undefined);
|
||||
const STORAGE_KEY = "user";
|
||||
|
||||
export function AuthProvider({ children }: { children: React.ReactNode }) {
|
||||
const [user, setUser] = React.useState<User | null>(null);
|
||||
const [isHydrated, setIsHydrated] = React.useState(false);
|
||||
|
||||
React.useEffect(() => {
|
||||
const restoreUser = async () => {
|
||||
try {
|
||||
const storedUser = await AsyncStorage.getItem(STORAGE_KEY);
|
||||
if (storedUser) {
|
||||
setUser(JSON.parse(storedUser) as User);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log("Error restoring user", error);
|
||||
} finally {
|
||||
setIsHydrated(true);
|
||||
}
|
||||
};
|
||||
|
||||
restoreUser();
|
||||
}, []);
|
||||
|
||||
const login = async (email: string, password: string) => {
|
||||
const fakeUser = { email };
|
||||
|
||||
await AsyncStorage.setItem(STORAGE_KEY, JSON.stringify(fakeUser));
|
||||
setUser(fakeUser);
|
||||
console.log(fakeUser)
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||
return true;
|
||||
}
|
||||
|
||||
const logout = async () => {
|
||||
await AsyncStorage.removeItem(STORAGE_KEY);
|
||||
setUser(null);
|
||||
}
|
||||
|
||||
return (
|
||||
<authContext.Provider value={{ user, isHydrated, 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;
|
||||
}
|
||||
|
||||
|
||||
100
apk/package-lock.json
generated
100
apk/package-lock.json
generated
@@ -15,6 +15,7 @@
|
||||
"@react-navigation/elements": "^2.6.3",
|
||||
"@react-navigation/native": "^7.1.8",
|
||||
"expo": "~54.0.33",
|
||||
"expo-build-properties": "~1.0.10",
|
||||
"expo-constants": "~18.0.13",
|
||||
"expo-font": "~14.0.11",
|
||||
"expo-haptics": "~15.0.8",
|
||||
@@ -3765,9 +3766,6 @@
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3782,9 +3780,6 @@
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3799,9 +3794,6 @@
|
||||
"ppc64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3816,9 +3808,6 @@
|
||||
"riscv64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3833,9 +3822,6 @@
|
||||
"riscv64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3850,9 +3836,6 @@
|
||||
"s390x"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3867,9 +3850,6 @@
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -3884,9 +3864,6 @@
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -6166,6 +6143,53 @@
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-build-properties": {
|
||||
"version": "1.0.10",
|
||||
"resolved": "https://registry.npmjs.org/expo-build-properties/-/expo-build-properties-1.0.10.tgz",
|
||||
"integrity": "sha512-mFCZbrbrv0AP5RB151tAoRzwRJelqM7bCJzCkxpu+owOyH+p/rFC/q7H5q8B9EpVWj8etaIuszR+gKwohpmu1Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ajv": "^8.11.0",
|
||||
"semver": "^7.6.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-build-properties/node_modules/ajv": {
|
||||
"version": "8.18.0",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.18.0.tgz",
|
||||
"integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "^3.1.3",
|
||||
"fast-uri": "^3.0.1",
|
||||
"json-schema-traverse": "^1.0.0",
|
||||
"require-from-string": "^2.0.2"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/epoberezkin"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-build-properties/node_modules/json-schema-traverse": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
|
||||
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/expo-build-properties/node_modules/semver": {
|
||||
"version": "7.7.4",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
|
||||
"integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
|
||||
"license": "ISC",
|
||||
"bin": {
|
||||
"semver": "bin/semver.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-constants": {
|
||||
"version": "18.0.13",
|
||||
"resolved": "https://registry.npmjs.org/expo-constants/-/expo-constants-18.0.13.tgz",
|
||||
@@ -6850,6 +6874,22 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/fast-uri": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.0.tgz",
|
||||
"integrity": "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/fastify"
|
||||
},
|
||||
{
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/fastify"
|
||||
}
|
||||
],
|
||||
"license": "BSD-3-Clause"
|
||||
},
|
||||
"node_modules/fb-watchman": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.2.tgz",
|
||||
@@ -8680,9 +8720,6 @@
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -8703,9 +8740,6 @@
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -8726,9 +8760,6 @@
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
@@ -8749,9 +8780,6 @@
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
|
||||
@@ -5,8 +5,8 @@
|
||||
"scripts": {
|
||||
"start": "expo start",
|
||||
"reset-project": "node ./scripts/reset-project.js",
|
||||
"android": "expo start --android",
|
||||
"ios": "expo start --ios",
|
||||
"android": "expo run:android",
|
||||
"ios": "expo run:ios",
|
||||
"web": "expo start --web",
|
||||
"lint": "expo lint"
|
||||
},
|
||||
@@ -18,6 +18,7 @@
|
||||
"@react-navigation/elements": "^2.6.3",
|
||||
"@react-navigation/native": "^7.1.8",
|
||||
"expo": "~54.0.33",
|
||||
"expo-build-properties": "~1.0.10",
|
||||
"expo-constants": "~18.0.13",
|
||||
"expo-font": "~14.0.11",
|
||||
"expo-haptics": "~15.0.8",
|
||||
|
||||
Reference in New Issue
Block a user