Update time select on match screen

mostafa-elhaiany · Oct 29, 2023 · 49664fd · 49664fd
1 parent 24b408a
commit 49664fd
Showing 1 changed file with 13 additions and 3 deletions.
diff --git a/DineDevineUI/src/pages/MatchPage.tsx b/DineDevineUI/src/pages/MatchPage.tsx
@@ -1,7 +1,7 @@
 import React, {useEffect, useState} from 'react';
 import {
-    IonButton, IonButtons,
-    IonContent, IonDatetime,
+    IonButton, IonButtons, IonModal,
+    IonContent, IonDatetime, IonDatetimeButton,
     IonHeader, IonIcon,
     IonPage,
     IonTitle,
@@ -16,6 +16,13 @@ const MatchPage: React.FC<RouteComponentProps> = (props: RouteComponentProps) =>
     const [numberOfPeople, setNumberOfPeople] = useState(2)
     const currentDate = `${new Date().getHours() + 1}`.slice(-4) + ":00"
     const [time, setTime] = useState(currentDate)
+    const enum interests {
+        Hiking,
+        Painting,
+        Football,
+        Basketball,
+        Tennis
+    }
 
     useEffect(() => {
         const name = localStorage.getItem('name');
@@ -65,8 +72,11 @@ const MatchPage: React.FC<RouteComponentProps> = (props: RouteComponentProps) =>
                                 <div className={"people-button"}>
                                     <IonButton fill={"clear"} slot={"start"}>
                                         <IonIcon ios={timeOutline} md={timeOutline}/>
+                                        <IonDatetimeButton datetime="datetime"></IonDatetimeButton>
+                                        <IonModal keepContentsMounted={true}>
+                                            <IonDatetime presentation="time" id="datetime"></IonDatetime>
+                                        </IonModal>
                                     </IonButton>
-                                    <span>{time}</span>
                                 </div>
                             </div>
                         </div>