update

.env

@@ -0,0 +1,22 @@
+EXPO_PUBLIC_BASE_URL_LOCAL=http://MacBook-Pro-Marc-Emmanuel.local:2880/api/chat
+
+EXPO_PUBLIC_SECRET_PASSPHRASE=\*this_is_the_k@yoo_secret_phr@se*\?
+EXPO_PUBLIC_API_KEY=1vRDY4CJd3tcXrjUWqCbTxEcz2vRr0p8hHJl8FOSuTtQxSbs1v6hkmuSrMFTe7iK0MqIFeI1XWUQw0jf
+
+EXPO_PUBLIC_S3_ACCESS_KEY_ID=8a096b24677cd6e2ef10ae577a4caba7
+EXPO_PUBLIC_S3_SECRET_ACCESS_KEY=6847673fe6ef4a22eecc978247bb860181aab669945f262b8e222e12a808e3e2
+EXPO_PUBLIC_S3_CLIENT_ENDPOINT=https://5ec66c7ddf8d71c83591ebd8bed08b86.r2.cloudflarestorage.com
+EXPO_PUBLIC_S3_CAR_REGISTRATION_DOCUMENT_BUCKET=kayoo-vehicle-registration-document-files
+EXPO_PUBLIC_S3_DRIVER_LICENCE_BUCKET=kayoo-driver-license-files
+EXPO_PUBLIC_S3_OTHER_BUCKET=kayoo-files
+EXPO_PUBLIC_S3_VERSION=v4
+EXPO_PUBLIC_S3_REGION=weur
+
+EXPO_PUBLIC_GOOGLE_MAP_API_KEY=AIzaSyB8rFwJVVSBzuHvYmGRB67I8h48pAOROhQ
+EXPO_PUBLIC_GOOGLE_MAP_API_KEY2=AIzaSyBGY0JTZEECjxOat-IduQnFutVrIdKZeoM
+EXPO_PUBLIC_GOOGLE_MAP_COUNTRY=country:ci
+EXPO_PUBLIC_GOOGLE_MAP_LANGUAGE=fr
+
+EXPO_PUBLIC_ANDROID_CLIENT_ID=615073296617-i83vt8dr3isadg6trngfsnk3t6qh9pci.apps.googleusercontent.com
+EXPO_PUBLIC_IOS_CLIENT_ID=615073296617-evpmn5ehpi0ahd5vkb0q4k5l94u3jira.apps.googleusercontent.com
+EXPO_PUBLIC_WEB_CLIENT_ID=615073296617-bbgo1f0e6n8oq6cjjpm3qq80tam33glv.apps.googleusercontent.com

.gitignore

@@ -0,0 +1,20 @@
+node_modules/
+.expo/
+dist/
+npm-debug.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+*.orig.*
+web-build/
+
+# macOS
+.DS_Store
+
+# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+# The following patterns were generated by expo-cli
+
+expo-env.d.ts
+# @end expo-cli

app.json

@@ -0,0 +1,32 @@
+{
+  "expo": {
+    "name": "Chat",
+    "slug": "Chat",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "scheme": "myapp",
+    "userInterfaceStyle": "automatic",
+    "splash": {
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/images/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "bundler": "metro",
+      "output": "static",
+      "favicon": "./assets/images/favicon.png"
+    },
+    "plugins": ["expo-router"],
+    "experiments": {
+      "typedRoutes": true
+    }
+  }
+}

app/index.tsx

@@ -0,0 +1,54 @@
+import React, { useEffect } from "react";
+import { StatusBar } from "expo-status-bar";
+import MainLayout from "@/screens/MainLayout";
+import { StyleSheet, View, Text } from "react-native";
+import { ToastProvider } from "@/context/ToastContext";
+import useLoadResources from "../hooks/useLoadResources";
+import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
+import { ThemeProvider, useTheme } from "../context/ThemeContext";
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+// import socket from "../utils/socket";
+// import io from "socket.io-client";
+
+export default function App() {
+  const { isReady, onLayoutRootView } = useLoadResources();
+  const { theme } = useTheme();
+
+  // const connectToServer = () => {
+  //   const socket = io("http://10.16.137.6:3000/");
+  // };
+
+  useEffect(() => {
+    // connectToServer();
+  }, []);
+
+  if (!isReady) {
+    return null;
+  }
+
+  return (
+    <GestureHandlerRootView style={{ flex: 1 }}>
+      <BottomSheetModalProvider>
+        <ToastProvider>
+          <ThemeProvider>
+            <View
+              style={[styles.container, { backgroundColor: theme.colors.background.primary }]}
+              onLayout={onLayoutRootView}
+            >
+              <MainLayout />
+              <StatusBar translucent={true} backgroundColor="transparent" style="auto" />
+            </View>
+          </ThemeProvider>
+        </ToastProvider>
+      </BottomSheetModalProvider>
+    </GestureHandlerRootView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+
+    justifyContent: "center",
+  },
+});

assets/icons/svg/mapping/iconsMapping.ts

@@ -0,0 +1,163 @@
+import CarIcon from "../ui/car";
+import EyeIcon from "../ui/eyes";
+
+import PlusIcon from "../ui/plus";
+import StarIcon from "../ui/star";
+import UserIcon from "../ui/user";
+import BackIcon from "../ui/back";
+import CallIcon from "../ui/call";
+import EditIcon from "../ui/edit";
+import BookIcon from "../ui/book";
+
+import RadioIcon from "../ui/radio";
+import CheckIcon from "../ui/check";
+import SeatsIcon from "../ui/seats";
+import MinusIcon from "../ui/minus";
+import PhoneIcon from "../ui/phone";
+import EmailIcon from "../ui/email";
+import TrashIcon from "../ui/trash";
+import AlertIcon from "../ui/alert";
+
+import StyletIcon from "../ui/stylet";
+import UploadIcon from "../ui/uplaod";
+import DollarIcon from "../ui/dollar";
+import CameraIcon from "../ui/camera";
+import XCrossIcon from "../ui/xcross";
+
+import MapPinIcon from "../ui/map.pin";
+import GalleryIcon from "../ui/gallery";
+
+import PostCardIcon from "../ui/postcard";
+import SecurityIcon from "../ui/security";
+import CalendarIcon from "../ui/calendar";
+import DropDownIcon from "../ui/dropdown";
+
+import TwoUsersIcon from "../ui/two.users";
+import NoteTextIcon from "../ui/note.text";
+
+import TimeSpeedIcon from "../ui/timeSpeed";
+import PlayStoreIcon from "../ui/playstore";
+
+import CheckMarkIcon from "../ui/check.mark";
+import MoneyHandIcon from "../ui/money.hand";
+import ThreeDotsIcon from "../ui/three.dots";
+import CircleIcon from "../ui/circle.dashed";
+import ThumbUpIcon from "../ui/thumb.up.tsx";
+
+import ChevronUpIcon from "../ui/chrevron-up";
+
+import ArrowBottomIcon from "../ui/arrowBottom";
+import CircleCheckIcon from "../ui/circleCheck";
+
+import ArrowTopRight from "../ui/arrow.top.right";
+
+import SecurityLockIcon from "../ui/security.lock";
+import CalendarSearch from "../ui/search.calendar";
+import ToastDefaultIcon from "../ui/toast.default";
+import ToastSuccessIcon from "../ui/toast.success";
+import NotificationIcon from "../ui/notifications";
+
+import ChevronRightIcon from "../ui/chrevron-right";
+import { StyleProp, ViewStyle } from "react-native";
+
+import CalendarPending from "../ui/calendar.pending";
+import ToastCriticalIcon from "../ui/toast.critical";
+import CalendarCheckIcon from "../ui/calendar.check";
+import CalendarClockIcon from "../ui/calendar.clock";
+
+import CalandarResearch from "../ui/calendar.research";
+import CalendarRemoveIcon from "../ui/calendar.remove";
+import TripDetailsBarIcon from "../ui/trip.details.bar";
+
+import ArrowRepeatCircleIcon from "../ui/arrow.repeat.circle";
+import CirclePlaceholderOnIcon from "../ui/circle.placeholder.on";
+
+type IconProps = {
+  color?: string;
+  width?: number;
+  height?: number;
+  style?: StyleProp<ViewStyle>;
+  size: "sm" | "md" | "lg" | "xl";
+};
+
+type IconComponentType = React.FC<IconProps>;
+
+interface IconsMapping {
+  [key: string]: IconComponentType;
+}
+
+const iconsMapping: IconsMapping = {
+  eye: EyeIcon,
+  car: CarIcon,
+
+  call: CallIcon,
+  edit: EditIcon,
+  back: BackIcon,
+  star: StarIcon,
+  user: UserIcon,
+  plus: PlusIcon,
+
+  trash: TrashIcon,
+  seats: SeatsIcon,
+  radio: RadioIcon,
+  phone: PhoneIcon,
+  check: CheckIcon,
+  minus: MinusIcon,
+  email: EmailIcon,
+
+  dollar: DollarIcon,
+  xcross: XCrossIcon,
+  camera: CameraIcon,
+  upload: UploadIcon,
+  mapPin: MapPinIcon,
+  BookIcon: BookIcon,
+
+  thumbUp: ThumbUpIcon,
+
+  gallery: GalleryIcon,
+  AlertIcon: AlertIcon,
+
+  StyletIcon: StyletIcon,
+  dropdown: DropDownIcon,
+  security: SecurityIcon,
+  calendar: CalendarIcon,
+  postcard: PostCardIcon,
+  twoUsers: TwoUsersIcon,
+
+  circleDashed: CircleIcon,
+  threeDots: ThreeDotsIcon,
+  moneyHand: MoneyHandIcon,
+  chevronUp: ChevronUpIcon,
+  timeSpeed: TimeSpeedIcon,
+  playstore: PlayStoreIcon,
+
+  NoteTextIcon: NoteTextIcon,
+
+  ArrowTopRight: ArrowTopRight,
+  circleCheck: CircleCheckIcon,
+  arrowBottom: ArrowBottomIcon,
+  CheckMarkIcon: CheckMarkIcon,
+
+  toastDefault: ToastDefaultIcon,
+  toastSuccess: ToastSuccessIcon,
+  chevronRight: ChevronRightIcon,
+  CalendarSearch: CalendarSearch,
+
+  toastCritical: ToastCriticalIcon,
+  calandarCheck: CalendarCheckIcon,
+  calandarClock: CalendarClockIcon,
+  calendarPending: CalendarPending,
+
+  CalandarResearch: CalandarResearch,
+  NotificationIcon: NotificationIcon,
+  calandarRemove: CalendarRemoveIcon,
+  SecurityLockIcon: SecurityLockIcon,
+
+  tripDetailsBarIcon: TripDetailsBarIcon,
+
+  ArrowRepeatCircleIcon: ArrowRepeatCircleIcon,
+
+  CirclePlaceholderOnIcon: CirclePlaceholderOnIcon,
+};
+
+export default iconsMapping;

assets/icons/svg/mapping/navIconsMapping.ts

@@ -0,0 +1,31 @@
+import FaqIcon from "../nav/faq";
+import TrajetIcon from "../nav/trajet";
+import RechercheIcon from "../nav/recherche";
+import PassengerIcon from "../nav/passenger";
+import ReservationIcon from "../nav/reservation";
+import MonCompteDriverIcon from "../nav/monCompteDriver";
+import MonComptePassengerIcon from "../nav/monComptePassenger";
+
+type IconProps = {
+  dark?: boolean;
+  focused: boolean;
+  size?: "md" | "lg" | "xl";
+};
+
+type IconComponentType = React.FC<IconProps>;
+
+interface NavIconsMapping {
+  [key: string]: IconComponentType;
+}
+
+const navIconsMapping: NavIconsMapping = {
+  "faq": FaqIcon,
+  "trajet": TrajetIcon,
+  "recherche": RechercheIcon,
+  "passenger": PassengerIcon,
+  "reservation": ReservationIcon,
+  "moncompte-driver": MonCompteDriverIcon,
+  "moncompte-passenger": MonComptePassengerIcon,
+};
+
+export default navIconsMapping;

assets/icons/svg/model/iconModel.tsx

@@ -0,0 +1,21 @@
+import { useResponsive } from "@/helpers/responsive/metrix";
+
+export const iconSizeModel: any = {
+  sm: {
+    height: useResponsive.verticalScale(16),
+    width: useResponsive.horizontalScale(16),
+  },
+  md: {
+    height: useResponsive.verticalScale(20),
+    width: useResponsive.horizontalScale(20),
+  },
+  lg: {
+    height: useResponsive.verticalScale(24),
+    width: useResponsive.horizontalScale(24),
+  },
+  xl: {
+    height: useResponsive.verticalScale(28),
+    width: useResponsive.horizontalScale(28),
+  },
+};
+

assets/icons/svg/nav/faq.tsx

@@ -0,0 +1,45 @@
+import Colors from "@/constants/colors";
+import { typography } from "@/constants/typography";
+import { useResponsive } from "@/helpers/responsive/metrix";
+import { Ionicons } from "@expo/vector-icons";
+import React from "react";
+import { View, Text } from "react-native";
+import { FontAwesomeIcon } from "@fortawesome/react-native-fontawesome";
+import { faMessage } from "@fortawesome/free-solid-svg-icons/faMessage";
+
+type IconProps = {
+  dark?: boolean;
+  focused: boolean;
+  size?: "md" | "lg" | "xl";
+};
+
+const FaqIcon = (props: IconProps) => {
+  const { focused } = props;
+
+  return (
+    <View
+      style={{
+        width: 80,
+        height: 40,
+        alignItems: "center",
+        justifyContent: "center",
+      }}
+    >
+      {focused ? (
+        <View style={{ gap: 4, alignItems: "center" }}>
+          <FontAwesomeIcon icon={faMessage} size={20} color={Colors.light.text.brand} />
+          <Text style={[typography.labelXsLight, { color: Colors.light.text.brand }]}>
+            Discussions
+          </Text>
+        </View>
+      ) : (
+        <View style={{ gap: 4, alignItems: "center" }}>
+          <FontAwesomeIcon icon={faMessage} size={20} color="#737373" />
+          <Text style={[typography.labelXsLight, { color: "#737373" }]}>Discussions</Text>
+        </View>
+      )}
+    </View>
+  );
+};
+
+export default FaqIcon;