Add icebreaker questions

DineDevineUI/src/pages/IcebreakerPage.tsx

@@ -1,8 +1,24 @@
 import React, { useEffect, useState } from 'react';
-import { IonContent, IonHeader, IonList, IonPage, IonTitle, IonToolbar, IonItem, IonLabel } from '@ionic/react';
+import {
+    IonContent,
+    IonHeader,
+    IonList,
+    IonPage,
+    IonTitle,
+    IonToolbar,
+    IonItem,
+    IonLabel,
+    IonButton, IonIcon
+} from '@ionic/react';
+import './pages.css'
+import {personCircleOutline} from "ionicons/icons";
 
 const IcebreakerPage = ({ match }) => {
-    const [questions, setQuestions] = useState([]);
+    const [questions, setQuestions] = useState(
+        ["If you could invite any famous person to join us for lunch, who would it be and why?",
+        "Describe yourself with 3 words",
+        "What animal?"]);
+
 
     useEffect(() => {
         const id1 = match.params.id1;
@@ -23,15 +39,15 @@ const IcebreakerPage = ({ match }) => {
         <IonPage>
             <IonHeader>
                 <IonToolbar>
-                    <IonTitle>Match Questions</IonTitle>
+                    <IonTitle className={'center-title'}>Icebreakers</IonTitle>
                 </IonToolbar>
             </IonHeader>
 
             <IonContent>
                 <IonList>
                     {questions.map((question, index) => (
                         <IonItem key={index}>
-                            <IonLabel>{question}</IonLabel>
+                            <IonLabel className={"wrap-text"} >{question}</IonLabel>
                         </IonItem>
                     ))}
                 </IonList>

DineDevineUI/src/pages/OnboardingPage.tsx

@@ -44,36 +44,38 @@ const OnboardingPage: React.FC<RouteComponentProps> = (props: RouteComponentProp
 
             console.log("Sending Request")
 
-            // Workaround because Host URL is dynamically generated
-            const headers =
-                {
-                    'Content-Type': 'application/json',
-                    'Access-Control-Allow-Origin': '*',
-                    'Access-Control-Allow-Methods': 'POST,PATCH,OPTIONS'
-                }
-
-            // Make a GET request to the API with the provided IDs
-            const response = await fetch(`https://rnpxo-80-187-122-115.a.free.pinggy.online/users`, {
-                method: "POST",
-                body: JSON.stringify({
-                    name: name,
-                    email: email,
-                    image: IMAGE_MOSTAFA_B64,
-                    headers: headers
-                })
-            })
-                .then((response) => response.json())
-                .catch((error) => {
-                    console.error('Error fetching data:', error);
-                });
-
-            console.log(response)
-
-            const userId = parseInt(response["ID"]);
-            console.log("userId: " + userId)
-            localStorage.setItem('userId', userId.toString());
-
-            props.history.push("/match")
+            // // Workaround because Host URL is dynamically generated
+            // const headers =
+            //     {
+            //         'Content-Type': 'application/json',
+            //         'Access-Control-Allow-Origin': '*',
+            //         'Access-Control-Allow-Methods': 'POST,PATCH,OPTIONS'
+            //     }
+            //
+            // // Make a GET request to the API with the provided IDs
+            // const response = await fetch(`https://rnpxo-80-187-122-115.a.free.pinggy.online/users`, {
+            //     method: "POST",
+            //     body: JSON.stringify({
+            //         name: name,
+            //         email: email,
+            //         image: IMAGE_MOSTAFA_B64,
+            //         headers: headers
+            //     })
+            // })
+            //     .then((response) => response.json())
+            //     .catch((error) => {
+            //         console.error('Error fetching data:', error);
+            //     });
+            //
+            // console.log(response)
+            //
+            // const userId = parseInt(response["ID"]);
+            // console.log("userId: " + userId)
+            // localStorage.setItem('userId', userId.toString());
+
+            setTimeout(() => {
+                props.history.push("/match")
+            }, 1463)
         }
     }
 

DineDevineUI/src/pages/WaitingPage.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useEffect} from 'react';
 import {
     IonButton, IonButtons,
     IonContent, IonDatetime,
@@ -11,16 +11,11 @@ import {RouteComponentProps} from "react-router";
 
 
 const WaitingPage: React.FC<RouteComponentProps> = (props, context) => {
-
-    // TODO:
-    // Add animation / info graphic from Heidi
-    // 1. Show waiting screen
-    // 2. Pool match status
-    // 3. if match found -> swap video
-    // 4. play video until finished -> change route to SelectRestaurant
-    // setTimeout(() => {
-    //     props.history.push('/select-restaurant');
-    // }, 2000)
+    useEffect(() => {
+        setTimeout(() => {
+            props.history.push('/icebreaker');
+        }, 10000)
+    }, []);
 
     return (
         <IonPage>

DineDevineUI/src/pages/pages.css

@@ -146,4 +146,8 @@
 
 ion-button > img {
     animation: wiggle 3.5s infinite;
+}
+
+ion-label {
+    text-wrap: pretty !important;
 }

DineDevineUI/users.http

@@ -1,4 +1,4 @@
-POST http://rnfph-157-161-162-66.a.free.pinggy.online/users/
+POST https://rnpxo-80-187-122-115.a.free.pinggy.online/users/
 Content-Type: application/json
 
 {