Signup screen

src/app/onboarding2.tsx

@@ -312,7 +312,10 @@ const OnboardingScreen2 = () => {
           width={'40%'}
           height={50}
           route="/onboarding2"
-          handleOnPress={() => sendOnboarding_screen2Data()}
+          handleOnPress={
+            () => router.push('/onboarding3')
+            //sendOnboarding_screen2Data()
+          }
           buttonText={'Proceed'}
         />
       </View>

src/app/onboarding3.tsx

@@ -79,28 +79,39 @@ const OnboardingScreen3: React.FC = () => {
     );
   };
 
-  // TODO : setup api call and send when "proceed" is selected
-  useEffect(() => {
-    const collectedData = {
-      firstName: firstName,
-      lastName: lastName,
-      studentYear: studentYear,
-      DOB: dateOfBirth,
-      pronouns: currentPronounDropdownValue,
-      Gender: currentGenderDropdownValue,
-      // TODO : add more fields as needed
-      // TODO : this is the data that will be sent when API call is made
-      // ** @see https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
-      // above link will help better explain how the POSt method for APi works
-    };
-  }, [
-    firstName,
-    lastName,
-    studentYear,
-    dateOfBirth,
-    currentPronounDropdownValue,
-    currentGenderDropdownValue,
-  ]);
+  const collectedData = {
+    firstName: firstName,
+    lastName: lastName,
+    studentYear: studentYear,
+    DOB: dateOfBirth,
+    pronouns: currentPronounDropdownValue,
+    Gender: currentGenderDropdownValue,
+    // TODO : add more fields as needed
+    // TODO : this is the data that will be sent when API call is made
+    // ** @see https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
+    // above link will help better explain how the POSt method for APi works
+  };
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const sendOnboarding_screen3Data = () => {
+    fetch('http://localhost:4001/onboarding/onboarding3Data', {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      method: 'POST',
+      body: JSON.stringify(collectedData),
+    }).then((res) => {
+      if (res.ok || res.status === 200) {
+        console.log('Data Sent Successfully');
+        console.log(`Response Status : ${res.status}`);
+        return router.push('/(root)/(tabs)/(index)/');
+      } else {
+        if (res.status === 400) {
+          console.log('There was an error sending your data');
+        }
+      }
+    });
+  };
 
   return (
     <View className="bg-black flex-1 p-10">
@@ -204,7 +215,8 @@ const OnboardingScreen3: React.FC = () => {
           searchPlaceholder="Search..."
           value={currentPronounDropdownValue}
           onChange={(item) => {
-            setCurrentPronounDropdownValue(item.value);
+            // ** changed from value to label
+            setCurrentPronounDropdownValue(item.label);
           }}
           renderLeftIcon={() => (
             <AntDesign
@@ -233,7 +245,7 @@ const OnboardingScreen3: React.FC = () => {
           searchPlaceholder="Search..."
           value={currentGenderDropdownValue}
           onChange={(item) => {
-            setCurrentGendeDropdownValue(item.value);
+            setCurrentGendeDropdownValue(item.label);
           }}
           renderLeftIcon={() => (
             <AntDesign
@@ -262,7 +274,8 @@ const OnboardingScreen3: React.FC = () => {
           width={'40%'}
           height={50}
           route="/onboarding2"
-          handleOnPress={() => router.push('/(root)/(tabs)/(index)/')}
+          handleOnPress={() => sendOnboarding_screen3Data()}
+          //handleOnPress={() => router.push('/(root)/(tabs)/(index)/')}
           buttonText={'Proceed'}
         />
       </View>

src/lib/api/onboarding/onboarding.routes.ts

@@ -2,22 +2,44 @@ import { Router } from 'express';
 
 const onboardingRouter = Router();
 // TODO : Define a function that will handle autoamtically calling the data using axios
-// TODO : the axios method will be a get method, since we want to return the data
 onboardingRouter.post('/onboarding2Data', async (req, res, next) => {
   try {
-    const { degree, major } = req.body;
-    if (!degree || !major) {
+    const data = req.body;
+    if (!data) {
       res.status(400);
       throw new Error('Either degree or major field is empty');
     } else {
-      res.send({
-        degree: degree,
-        major: major,
-      });
+      setOnboarding2Data(data);
+      res.send(data);
     }
   } catch (err) {
     res.status(500).send('Internal Server Error');
     console.error(err);
     next(err);
   }
 });
+
+onboardingRouter.post('/onboarding3Data', async (req, res, next) => {
+  // Not sure if this is fully correct or not
+  const data = req.body;
+  if (!data) {
+    res.status(400);
+    next();
+    throw new Error('Some of the data is missing');
+  } else {
+    setOnboarding3Data(data);
+    res.send(data);
+  }
+});
+
+export const setOnboarding2Data = (onboarding2Data: any) => {
+  console.log(onboarding2Data);
+  return onboarding2Data;
+};
+
+export const setOnboarding3Data = (onboarding3Data: any) => {
+  console.log(onboarding3Data);
+  return onboarding3Data;
+};
+
+export default onboardingRouter;

src/lib/api/onboarding/onboarding.services.ts

@@ -1,6 +1,8 @@
 // TODO : define database logic here
 import { db } from '@/lib/utils/db';
 import { Prisma } from '@prisma/client';
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { setOnboarding2Data } from './onboarding.routes';
 
 export const insertUserInformationDetails = (RegisteredUser: any) => {
   const UserDetail: Prisma.UserRegistrationDetailsCreateInput = {

src/lib/api/server.ts

@@ -1,6 +1,7 @@
 import authRouter from './auth/auth.routes';
 import express from 'express';
 import userRouter from './users/users.routes';
+import onboardingRouter from './onboarding/onboarding.routes';
 
 const app = express();
 // ** needed to add express.json()
@@ -10,6 +11,7 @@ const router = express.Router();
 router.use(express.json());
 router.use('/auth', authRouter);
 router.use('/users', userRouter);
+router.use('/onboarding', onboardingRouter);
 //http://localhost:4001/auth/register --> example API call
 app.use(router);
 app.get('/test', (req, res) => {