Merge pull request #41 from flemingvincent/feature/ess-2

Feature/ess 2
flemingvincent · Sep 26, 2024 · 4fb3063 · 4fb3063
2 parents a2877c5 + e3cb661
commit 4fb3063
Show file tree

Hide file tree

Showing 23 changed files with 176 additions and 170 deletions.
diff --git a/.env → .env.example b/.env → .env.example
diff --git a/.gitignore b/.gitignore
@@ -10,6 +10,8 @@ npm-debug.*
 *.orig.*
 web-build/
 
+
+# Ignore .env file
 .env
 
 # macOS

diff --git a/app.json b/app.json
@@ -1,38 +1,47 @@
 {
-  "expo": {
-    "name": "ExpoSupabaseStarter",
-    "slug": "ExpoSupabaseStarter",
-    "scheme": "expo-supabase-starter",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "icon": "./assets/icon.png",
-    "userInterfaceStyle": "automatic",
-    "splash": {
-      "image": "./assets/splash.png",
-      "resizeMode": "contain",
-      "backgroundColor": "#ffffff"
-    },
-    "assetBundlePatterns": [
-      "**/*"
-    ],
-    "ios": {
-      "supportsTablet": true,
-      "config": {
-        "usesNonExemptEncryption": false
-      }
-    },
-    "android": {
-      "adaptiveIcon": {
-        "foregroundImage": "./assets/adaptive-icon.png",
-        "backgroundColor": "#ffffff"
-      }
-    },
-    "experiments": {
-      "typedRoutes": true
-    },
-    "plugins": [
-      "expo-router",
-      "expo-secure-store"
-    ]
-  }
+	"expo": {
+		"name": "ExpoSupabaseStarter",
+		"slug": "ExpoSupabaseStarter",
+		"scheme": "expo-supabase-starter",
+		"version": "1.0.0",
+		"orientation": "portrait",
+		"icon": "./assets/icon.png",
+		"userInterfaceStyle": "automatic",
+		"assetBundlePatterns": ["**/*"],
+		"ios": {
+			"supportsTablet": true,
+			"config": {
+				"usesNonExemptEncryption": false
+			},
+			"splash": {
+				"image": "./assets/splash.png",
+				"resizeMode": "cover",
+				"backgroundColor": "#ffffff",
+				"dark": {
+					"backgroundColor": "#000000",
+					"resizeMode": "cover",
+					"image": "./assets/splash-dark.png"
+				}
+			}
+		},
+		"android": {
+			"adaptiveIcon": {
+				"foregroundImage": "./assets/adaptive-icon.png"
+			},
+			"splash": {
+				"image": "./assets/splash.png",
+				"resizeMode": "cover",
+				"backgroundColor": "#ffffff",
+				"dark": {
+					"backgroundColor": "#000000",
+					"resizeMode": "cover",
+					"image": "./assets/splash-dark.png"
+				}
+			}
+		},
+		"experiments": {
+			"typedRoutes": true
+		},
+		"plugins": ["expo-router", "expo-secure-store"]
+	}
 }
diff --git a/app/(protected)/_layout.tsx → app/(app)/(protected)/_layout.tsx b/app/(protected)/_layout.tsx → app/(app)/(protected)/_layout.tsx
@@ -20,8 +20,8 @@ export default function ProtectedLayout() {
 				tabBarShowLabel: false,
 			}}
 		>
-			<Tabs.Screen name="home" />
-			<Tabs.Screen name="settings" />
+			<Tabs.Screen name="index" options={{ title: "Home" }} />
+			<Tabs.Screen name="settings" options={{ title: "Settings" }} />
 		</Tabs>
 	);
 }
diff --git a/app/(protected)/home.tsx → app/(app)/(protected)/index.tsx b/app/(protected)/home.tsx → app/(app)/(protected)/index.tsx
@@ -1,13 +1,11 @@
-import { useRouter } from "expo-router";
+import { router } from "expo-router";
 import { View } from "react-native";
 
 import { Button } from "@/components/ui/button";
 import { Text } from "@/components/ui/text";
 import { H1, Muted } from "@/components/ui/typography";
 
-export default function TabOneScreen() {
-	const router = useRouter();
-
+export default function Home() {
 	return (
 		<View className="flex-1 items-center justify-center bg-background p-4 gap-y-4">
 			<H1 className="text-center">Home</H1>
@@ -19,9 +17,7 @@ export default function TabOneScreen() {
 				className="w-full"
 				variant="default"
 				size="default"
-				onPress={() => {
-					router.push("/modal");
-				}}
+				onPress={() => router.push("/(app)/modal")}
 			>
 				<Text>Open Modal</Text>
 			</Button>

diff --git a/app/(protected)/settings.tsx → app/(app)/(protected)/settings.tsx b/app/(protected)/settings.tsx → app/(app)/(protected)/settings.tsx
@@ -5,7 +5,7 @@ import { Text } from "@/components/ui/text";
 import { H1, Muted } from "@/components/ui/typography";
 import { useSupabase } from "@/context/supabase-provider";
 
-export default function TabTwoScreen() {
+export default function Settings() {
 	const { signOut } = useSupabase();
 
 	return (
@@ -18,9 +18,7 @@ export default function TabTwoScreen() {
 				className="w-full"
 				size="default"
 				variant="default"
-				onPress={() => {
-					signOut();
-				}}
+				onPress={signOut}
 			>
 				<Text>Sign Out</Text>
 			</Button>

diff --git a/app/+not-found.tsx → app/(app)/+not-found.tsx b/app/+not-found.tsx → app/(app)/+not-found.tsx
diff --git a/app/(app)/_layout.tsx b/app/(app)/_layout.tsx
@@ -0,0 +1,22 @@
+import { Stack } from "expo-router";
+
+export const unstable_settings = {
+	initialRouteName: "(root)",
+};
+
+export default function AppLayout() {
+	return (
+		<Stack screenOptions={{ headerShown: false }}>
+			<Stack.Screen name="(protected)" />
+			<Stack.Screen name="welcome" />
+			<Stack.Screen name="sign-up" options={{ presentation: "modal" }} />
+			<Stack.Screen
+				name="sign-in"
+				options={{
+					presentation: "modal",
+				}}
+			/>
+			<Stack.Screen name="modal" options={{ presentation: "modal" }} />
+		</Stack>
+	);
+}
diff --git a/app/modal.tsx → app/(app)/modal.tsx b/app/modal.tsx → app/(app)/modal.tsx
diff --git a/app/(public)/sign-in.tsx → app/(app)/sign-in.tsx b/app/(public)/sign-in.tsx → app/(app)/sign-in.tsx
@@ -1,5 +1,4 @@
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useRouter } from "expo-router";
 import { useForm } from "react-hook-form";
 import { ActivityIndicator, View } from "react-native";
 import * as z from "zod";
@@ -8,7 +7,7 @@ import { SafeAreaView } from "@/components/safe-area-view";
 import { Button } from "@/components/ui/button";
 import { Form, FormField, FormInput } from "@/components/ui/form";
 import { Text } from "@/components/ui/text";
-import { H1, Muted } from "@/components/ui/typography";
+import { H1 } from "@/components/ui/typography";
 import { useSupabase } from "@/context/supabase-provider";
 
 const formSchema = z.object({
@@ -21,7 +20,6 @@ const formSchema = z.object({
 
 export default function SignIn() {
 	const { signInWithPassword } = useSupabase();
-	const router = useRouter();
 
 	const form = useForm<z.infer<typeof formSchema>>({
 		resolver: zodResolver(formSchema),
@@ -43,11 +41,8 @@ export default function SignIn() {
 
 	return (
 		<SafeAreaView className="flex-1 bg-background p-4">
-			<View className="flex-1 web:m-4">
-				<H1 className="self-start">Sign In</H1>
-				<Muted className="self-start mb-5">
-					to continue to Expo Supabase Starter
-				</Muted>
+			<View className="flex-1 gap-4 web:m-4">
+				<H1 className="self-start ">Sign In</H1>
 				<Form {...form}>
 					<View className="gap-4">
 						<FormField
@@ -82,29 +77,19 @@ export default function SignIn() {
 					</View>
 				</Form>
 			</View>
-			<View className="gap-y-4 web:m-4">
-				<Button
-					size="default"
-					variant="default"
-					onPress={form.handleSubmit(onSubmit)}
-					disabled={form.formState.isSubmitting}
-				>
-					{form.formState.isSubmitting ? (
-						<ActivityIndicator size="small" />
-					) : (
-						<Text>Sign In</Text>
-					)}
-				</Button>
-				<Muted
-					className="text-center"
-					onPress={() => {
-						router.replace("/sign-up");
-					}}
-				>
-					Don't have an account?{" "}
-					<Muted className="text-foreground">Sign up</Muted>
-				</Muted>
-			</View>
+			<Button
+				size="default"
+				variant="default"
+				onPress={form.handleSubmit(onSubmit)}
+				disabled={form.formState.isSubmitting}
+				className="web:m-4"
+			>
+				{form.formState.isSubmitting ? (
+					<ActivityIndicator size="small" />
+				) : (
+					<Text>Sign In</Text>
+				)}
+			</Button>
 		</SafeAreaView>
 	);
 }
diff --git a/app/(public)/sign-up.tsx → app/(app)/sign-up.tsx b/app/(public)/sign-up.tsx → app/(app)/sign-up.tsx
@@ -1,5 +1,4 @@
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useRouter } from "expo-router";
 import { useForm } from "react-hook-form";
 import { ActivityIndicator, View } from "react-native";
 import * as z from "zod";
@@ -8,7 +7,7 @@ import { SafeAreaView } from "@/components/safe-area-view";
 import { Button } from "@/components/ui/button";
 import { Form, FormField, FormInput } from "@/components/ui/form";
 import { Text } from "@/components/ui/text";
-import { H1, Muted } from "@/components/ui/typography";
+import { H1 } from "@/components/ui/typography";
 import { useSupabase } from "@/context/supabase-provider";
 
 const formSchema = z
@@ -40,7 +39,6 @@ const formSchema = z
 
 export default function SignUp() {
 	const { signUp } = useSupabase();
-	const router = useRouter();
 
 	const form = useForm<z.infer<typeof formSchema>>({
 		resolver: zodResolver(formSchema),
@@ -63,11 +61,9 @@ export default function SignUp() {
 
 	return (
 		<SafeAreaView className="flex-1 bg-background p-4">
-			<View className="flex-1 web:m-4">
+			<View className="flex-1 gap-4 web:m-4">
 				<H1 className="self-start">Sign Up</H1>
-				<Muted className="self-start mb-5">
-					to continue to Expo Supabase Starter
-				</Muted>
+
 				<Form {...form}>
 					<View className="gap-4">
 						<FormField
@@ -116,29 +112,19 @@ export default function SignUp() {
 					</View>
 				</Form>
 			</View>
-			<View className="gap-y-4 web:m-4">
-				<Button
-					size="default"
-					variant="default"
-					onPress={form.handleSubmit(onSubmit)}
-					disabled={form.formState.isSubmitting}
-				>
-					{form.formState.isSubmitting ? (
-						<ActivityIndicator size="small" />
-					) : (
-						<Text>Sign Up</Text>
-					)}
-				</Button>
-				<Muted
-					className="text-center"
-					onPress={() => {
-						router.replace("/sign-in");
-					}}
-				>
-					Already have an account?{" "}
-					<Muted className="text-foreground">Sign in</Muted>
-				</Muted>
-			</View>
+			<Button
+				size="default"
+				variant="default"
+				onPress={form.handleSubmit(onSubmit)}
+				disabled={form.formState.isSubmitting}
+				className="web:m-4"
+			>
+				{form.formState.isSubmitting ? (
+					<ActivityIndicator size="small" />
+				) : (
+					<Text>Sign Up</Text>
+				)}
+			</Button>
 		</SafeAreaView>
 	);
 }
diff --git a/app/(public)/welcome.tsx → app/(app)/welcome.tsx b/app/(public)/welcome.tsx → app/(app)/welcome.tsx
@@ -2,6 +2,7 @@ import { useRouter } from "expo-router";
 import React from "react";
 import { View } from "react-native";
 
+import { Image } from "@/components/image";
 import { SafeAreaView } from "@/components/safe-area-view";
 import { Button } from "@/components/ui/button";
 import { Text } from "@/components/ui/text";
@@ -13,15 +14,18 @@ export default function WelcomeScreen() {
 	return (
 		<SafeAreaView className="flex flex-1 bg-background p-4">
 			<View className="flex flex-1 items-center justify-center gap-y-4 web:m-4">
+				<Image
+					source={require("@/assets/icon.png")}
+					className="w-16 h-16 rounded-xl"
+				/>
 				<H1 className="text-center">Welcome to Expo Supabase Starter</H1>
 				<Muted className="text-center">
 					A comprehensive starter project for developing Expo applications with
 					Supabase as the backend.
 				</Muted>
 			</View>
-			<View className="flex flex-row gap-x-4 web:m-4">
+			<View className="flex flex-col gap-y-4 web:m-4">
 				<Button
-					className="flex-1"
 					size="default"
 					variant="default"
 					onPress={() => {
@@ -31,7 +35,6 @@ export default function WelcomeScreen() {
 					<Text>Sign Up</Text>
 				</Button>
 				<Button
-					className="flex-1"
 					size="default"
 					variant="secondary"
 					onPress={() => {

diff --git a/app/(public)/_layout.tsx b/app/(public)/_layout.tsx
-Original file line number
+Diff line change
@@ Expand Up / @@ -10,6 +10,8 @@ npm-debug.* @@
     *.orig.*
     web-build/
+    # Ignore .env file
     .env
     # macOS
@@ Expand Down @@