diff --git a/app/(api)/user+api.ts b/app/(api)/user+api.ts
index 10c5518..8bfbcfd 100644
--- a/app/(api)/user+api.ts
+++ b/app/(api)/user+api.ts
@@ -10,7 +10,7 @@ export async function POST(req: Request) {
error: "Missing required fields!",
},
{
- status: 400,
+ status: 404,
},
);
}
@@ -33,6 +33,6 @@ export async function POST(req: Request) {
} catch (error) {
console.log(error);
- return Response.json({ error });
+ return Response.json({ error }, { status: 500 });
}
}
diff --git a/app/(auth)/sign-in.tsx b/app/(auth)/sign-in.tsx
index e9b0e17..4512c65 100644
--- a/app/(auth)/sign-in.tsx
+++ b/app/(auth)/sign-in.tsx
@@ -99,7 +99,7 @@ const SignIn = () => {
Don't have an account?
Sign up
diff --git a/app/(auth)/sign-up.tsx b/app/(auth)/sign-up.tsx
index f99e069..020d3d0 100644
--- a/app/(auth)/sign-up.tsx
+++ b/app/(auth)/sign-up.tsx
@@ -30,6 +30,8 @@ const SignUp = () => {
try {
await signUp.create({
+ firstName: form.name,
+ lastName: "",
emailAddress: form.email,
password: form.password,
});
@@ -121,7 +123,7 @@ const SignUp = () => {
name: value,
}))
}
- autoCapitalize="sentences"
+ autoCapitalize="words"
/>
{
Already have an account?
Sign in
@@ -228,7 +230,7 @@ const SignUp = () => {
- You've succesfully verified your accound.
+ You've succesfully verified your account.
{
const { user } = useUser();
+ const isLoading = false;
+
+ const handleSignOut = () => {};
+ const handleDestinationPress = () => {};
return (
-
-
- Hello {user?.emailAddresses[0].emailAddress}
-
+
+ }
+ className="px-5"
+ keyboardShouldPersistTaps="handled"
+ contentContainerStyle={{
+ paddingBottom: 100,
+ }}
+ ListEmptyComponent={() => (
+
+ {!isLoading ? (
+ <>
+
+ No recent rides found.
+ >
+ ) : (
+
+ )}
+
+ )}
+ ListHeaderComponent={() => (
+ <>
+
+
+ Welcome{" "}
+ {user?.firstName || user?.emailAddresses[0].emailAddress} 👋
+
+
+
+
+
+
+
+
+
+
+ Your current location
+
+
+
+
+
+
+
+ Recent Rides
+
+ >
+ )}
+ />
);
};
diff --git a/app/_layout.tsx b/app/_layout.tsx
index dd15590..9cedad9 100644
--- a/app/_layout.tsx
+++ b/app/_layout.tsx
@@ -2,6 +2,7 @@ import { ClerkProvider, ClerkLoaded } from "@clerk/clerk-expo";
import { useFonts } from "expo-font";
import { Stack } from "expo-router";
import * as SplashScreen from "expo-splash-screen";
+import { StatusBar } from "expo-status-bar";
import { useEffect } from "react";
import "react-native-reanimated";
@@ -43,6 +44,8 @@ const RootLayout = () => {
+
+
);
diff --git a/components/google-text-input.tsx b/components/google-text-input.tsx
new file mode 100644
index 0000000..e7db93b
--- /dev/null
+++ b/components/google-text-input.tsx
@@ -0,0 +1,16 @@
+import type { GoogleInputProps } from "@/types/type";
+import { Text, View } from "react-native";
+
+export const GoogleTextInput = ({
+ icon,
+ initialLocation,
+ containerStyles,
+ textInputBackgroundColor,
+ handlePress,
+}: GoogleInputProps) => (
+
+ Google Text Input
+
+);
diff --git a/components/map.tsx b/components/map.tsx
new file mode 100644
index 0000000..050927a
--- /dev/null
+++ b/components/map.tsx
@@ -0,0 +1,9 @@
+import { Text, View } from "react-native";
+
+export const Map = () => {
+ return (
+
+ Map
+
+ );
+};
diff --git a/components/ride-card.tsx b/components/ride-card.tsx
new file mode 100644
index 0000000..6cc87b7
--- /dev/null
+++ b/components/ride-card.tsx
@@ -0,0 +1,99 @@
+import { Image, Text, View } from "react-native";
+
+import { icons } from "@/constants";
+import { formatDate, formatTime } from "@/lib/utils";
+import type { Ride } from "@/types/type";
+
+export const RideCard = ({ ride }: { ride: Ride }) => {
+ const {
+ destination_latitude,
+ destination_longitude,
+ origin_address,
+ destination_address,
+ created_at,
+ ride_time,
+ driver,
+ payment_status,
+ } = ride;
+
+ return (
+
+
+
+
+
+
+
+
+
+
+ {origin_address}
+
+
+
+
+
+
+
+ {destination_address}
+
+
+
+
+
+
+
+
+ Date & Time
+
+
+
+ {formatDate(created_at)}, {formatTime(ride_time)}
+
+
+
+
+
+ Driver
+
+
+
+ {driver.first_name} {driver.last_name}
+
+
+
+
+
+ Car Seats
+
+
+
+ {driver.car_seats}
+
+
+
+
+
+ Payment Status
+
+
+
+ {payment_status}
+
+
+
+
+
+ );
+};
diff --git a/environment.d.ts b/environment.d.ts
index 76bd0f0..2da04ca 100644
--- a/environment.d.ts
+++ b/environment.d.ts
@@ -9,6 +9,9 @@ declare global {
// postgres db url (neon db)
DATABASE_URL: string;
+
+ // geoapify api key
+ EXPO_PUBLIC_GEOAPIFY_API_KEY: string;
}
}
}
diff --git a/lib/utils.ts b/lib/utils.ts
new file mode 100644
index 0000000..2ff6c91
--- /dev/null
+++ b/lib/utils.ts
@@ -0,0 +1,46 @@
+import { Ride } from "@/types/type";
+
+export const sortRides = (rides: Ride[]): Ride[] => {
+ const result = rides.sort((a, b) => {
+ const dateA = new Date(`${a.created_at}T${a.ride_time}`);
+ const dateB = new Date(`${b.created_at}T${b.ride_time}`);
+ return dateB.getTime() - dateA.getTime();
+ });
+
+ return result.reverse();
+};
+
+export function formatTime(minutes: number): string {
+ const formattedMinutes = +minutes?.toFixed(0) || 0;
+
+ if (formattedMinutes < 60) {
+ return `${minutes} min`;
+ } else {
+ const hours = Math.floor(formattedMinutes / 60);
+ const remainingMinutes = formattedMinutes % 60;
+ return `${hours}h ${remainingMinutes}m`;
+ }
+}
+
+export function formatDate(dateString: string): string {
+ const date = new Date(dateString);
+ const day = date.getDate();
+ const monthNames = [
+ "Jan",
+ "Feb",
+ "Mar",
+ "Apr",
+ "May",
+ "Jun",
+ "Jul",
+ "Aug",
+ "Sep",
+ "Oct",
+ "Nov",
+ "Dec",
+ ];
+ const month = monthNames[date.getMonth()];
+ const year = date.getFullYear();
+
+ return `${day < 10 ? "0" + day : day} ${month} ${year}`;
+}
diff --git a/types/type.d.ts b/types/type.d.ts
index a57b80f..44c4ab5 100644
--- a/types/type.d.ts
+++ b/types/type.d.ts
@@ -65,7 +65,7 @@ declare interface ButtonProps extends TouchableOpacityProps {
declare interface GoogleInputProps {
icon?: string;
initialLocation?: string;
- containerStyle?: string;
+ containerStyles?: string;
textInputBackgroundColor?: string;
handlePress: ({
latitude,