Refactor ViewBookingDetails and OfficeDetails components

COS301-SE-2024 · Oct 15, 2024 · ccce3f4 · ccce3f4
1 parent 63e9ef6
commit ccce3f4
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 12 deletions.
diff --git a/frontend/occupi-mobile4/screens/Booking/ViewBookingDetails.tsx b/frontend/occupi-mobile4/screens/Booking/ViewBookingDetails.tsx
@@ -59,6 +59,7 @@ const ViewBookingDetails = () => {
     const checkin = async () => {
         setIsLoading(true);
         const response = await userCheckin();
+        setCheckedIn(true);
         toast.show({
             placement: 'top',
             render: ({ id }) => {
@@ -132,11 +133,11 @@ const ViewBookingDetails = () => {
 
                 {isBookingActive ? (
                     <>
-                        <TouchableOpacity style={{ paddingHorizontal: 15 }}>
+                        {/* <TouchableOpacity style={{ paddingHorizontal: 15 }}>
                             <View flexDirection="row" my="$2" borderRadius={10} alignItems="center" justifyContent="center" backgroundColor={isDarkMode ? '#2C2C2E' : '#F3F3F3'} h="$11">
                                 <Ionicons name="receipt-outline" size={24} color={isDarkMode ? '#fff' : '#000'} /><Text fontWeight="$bold" color={isDarkMode ? '#fff' : '#000'}> ViewBooking</Text>
                             </View>
-                        </TouchableOpacity>
+                        </TouchableOpacity> */}
 
                         {isLoading ? (
                             <TouchableOpacity style={{ paddingHorizontal: 15 }} >
@@ -153,12 +154,12 @@ const ViewBookingDetails = () => {
                                     </View>
                                 </TouchableOpacity>
                             ) : (
-                                <TouchableOpacity style={{ paddingHorizontal: 15 }} onPress={() => checkin()}>
+                                <View style={{ paddingHorizontal: 15 }}>
                                     <View flexDirection="row" my="$2" borderRadius={10} alignItems="center" justifyContent="center" backgroundColor={isDarkMode ? '#2C2C2E' : '#F3F3F3'} h="$11">
-                                        <MaterialIcons name="logout" size={24} color={isDarkMode ? '#fff' : '#000'} />
-                                        <Text fontWeight="bold" color={isDarkMode ? '#fff' : '#000'}> Check out</Text>
+                                        {/* <MaterialIcons name="logout" size={24} color={isDarkMode ? '#fff' : '#000'} /> */}
+                                        <Text fontWeight="bold" color={isDarkMode ? '#fff' : '#000'}> Checked in successfully</Text>
                                     </View>
-                                </TouchableOpacity>
+                                </View>
                             )
                         )}
 

diff --git a/frontend/occupi-mobile4/screens/Office/BookingDetails.tsx b/frontend/occupi-mobile4/screens/Office/BookingDetails.tsx
@@ -504,10 +504,10 @@ const BookingDetails = () => {
                 <Text color={isDark ? '#000' : '#fff'}>Check out: {endTime}</Text>
               </View>
             </View>
-            <View mt="$1" flexDirection="row" alignItems="center" right="$6">
-              <Box backgroundColor={isDark ? '#000' : '#fff'} h="$10" borderRadius={50} w="$10" />
-              <Text color={isDark ? '#000' : '#fff'}>------------------------------------------------------------------------</Text>
-              <Box backgroundColor={isDark ? '#000' : '#fff'} h="$10" borderRadius={50} w="$10" />
+            <View mt="$1" flexDirection="row" alignItems="center">
+              {/* <Box backgroundColor={isDark ? '#000' : '#fff'} h="$10" borderRadius={50} w="$10" /> */}
+              <Text color={isDark ? '#000' : '#fff'}>--------------------------------------------------</Text>
+              {/* <Box backgroundColor={isDark ? '#000' : '#fff'} h="$10" borderRadius={50} w="$10" /> */}
             </View>
             <View px="$4" py="$2">
               <View flexDirection="row" alignItems="center">

diff --git a/frontend/occupi-mobile4/screens/Office/OfficeDetails.tsx b/frontend/occupi-mobile4/screens/Office/OfficeDetails.tsx
@@ -163,14 +163,14 @@ const OfficeDetails = () => {
       <View pt="$12" px="$8" pb="$4" backgroundColor={isDarkMode ? 'black' : 'white'} style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
         <Icon right="$4" as={Feather} name="chevron-left" size="xl" color={currentTheme === 'dark' ? 'white' : 'black'} onPress={() => navigation.goBack()} />
         <Text right="$2" fontWeight="$bold" fontSize={22} style={{ color: isDarkMode ? '#fff' : '#000' }}>{room?.roomName}</Text>
-        <View alignItems="center" flexDirection="row" w="$24" justifyContent="space-between">
+        {/* <View alignItems="center" flexDirection="row" w="$24" justifyContent="space-between">
           <View rounded="$full" backgroundColor={isDarkMode ? '#2C2C2E' : '#F3F3F3'} p="$2">
             <Feather name="heart" size={24} color={isDarkMode ? '#fff' : '#000'} />
           </View>
           <View rounded="$full" backgroundColor={isDarkMode ? '#2C2C2E' : '#F3F3F3'} p="$2">
             <Feather name="share" mx="$8" size={24} color={currentTheme === 'dark' ? 'white' : 'black'} />
           </View>
-        </View>
+        </View> */}
       </View >
       <ScrollView style={{ backgroundColor: isDarkMode ? '#000' : '#fff' }}>
         <View height="$64" mt="$2" mb="$8">