Changeset 07f4e8b for frontend/src/Pages/SearchPage.js

Timestamp:

01/24/24 17:42:28 (5 months ago)

Author:

darsov2 <62809499+darsov2@…>

Branches:

master

Children:

0f5aa27

Parents:

5528b99

Message:

prefinal fixes

File:

• frontend/src/Pages/SearchPage.js (modified) (5 diffs)

frontend/src/Pages/SearchPage.js

@@ -1 @@
-import React from "react";
+import React, {useState} from "react";
 import Navigation from '../Components/Layout/Navbar/Navigation';
 import 'bootstrap/dist/css/bootstrap.css';
 import 'bootstrap/dist/js/bootstrap.js';
 import HomeCarousel from '../Components/Layout/CarouselHome/Carousel';
-import { Card, Container, Nav, Row, Col } from 'react-bootstrap';
+import {Card, Container, Nav, Row, Col} from 'react-bootstrap';
 import TabComponent from '../Components/Tab/Tab';
 import Offers from '../Components/Layout/Offers/Offers';
@@ -11 +11 @@
 import BecomeAHost from "../Components/BecomeAHost/BecomeAHost"
 import HotelLisitng from "../Components/Listings/HotelListing"
-import SearchCriterias from "../Components/SearchCriterias/SearchCriteriasBar";
+import SearchCriteriasHotel from "../Components/SearchCriterias/SearchCriteriasHotel";
 import SortButton from "../Components/Listings/SortButton";
 import FilterButton from "../Components/Listings/FilterButton";
 import TransportListing from "../Components/Listings/TransportListing";
 import useGet from "../Components/Hooks/useGet";
-import { useParams } from "react-router-dom";
-<<<<<<< HEAD
+import {useParams} from "react-router-dom";
 import SearchCriteriasBar from "../Components/SearchCriterias/SearchCriteriasBar";
 import RestaurantDetailsPage from "./RestaurantDetailsPage";
 import RestaurantListing from "../Components/Listings/RestaurantListing";
-=======
->>>>>>> parent of ac19a0c (authContext impl, admin panel impl, search bar fixes, reservations listings impl)
 
 
@@ -29 +26 @@
     const params = useParams();
     console.log(params)
-
+    const [sortingArg, setSortingArg] = useState("")
 
     document.body.style.backgroundColor = "white"
@@ -41 +38 @@
 
     }
-    
-<<<<<<< HEAD
-    let link = props.type === "transport" ? `/transport/search?from=${params.from}&to=${params.to}&date=${params.date}&numPassengers=${params.numPassengers}` : props.type === "hotel" ? `/hotel/search?hotelLocation=${params.hotelLocation}&dateFrom=${params.dateFrom}&dateTo=${params.dateTo}&numBeds=${params.numBeds}` : `/restaurant/search?restaurantLocation=${params.restaurantLocation}&date=${params.date}&hourFrom=${params.hourFrom}&hourTo=${params.hourTo}&numPeople=${params.numPeople}`
-=======
-    let link = props.type === "transport" ? `/transport/search?from=${params.from}&to=${params.to}&date=${params.date}` : props.type === "hotel" ? `/hotel/search?hotelLocation=${params.hotelLocation}&dateFrom=${params.dateFrom}&dateTo=${params.dateTo}&numBeds=${params.numBeds}` : ""
->>>>>>> parent of ac19a0c (authContext impl, admin panel impl, search bar fixes, reservations listings impl)
+
+    const getSortingFn = (type, arg) => {
+        if (type === 'hotel') {
+            if (arg === "priceAsc")
+            {
+                return (a, b) => {
+                    return a.totalPrice - b.totalPrice;
+                }
+            }
+            else if (arg === "priceDesc")
+            {
+                return (a, b) => {
+                    return -(a.totalPrice - b.totalPrice);
+                }
+            }
+            else if (arg === 'nameAsc')
+            {
+                return (a, b) => {
+                    return a.hotelName.localeCompare(b.hotelName);
+                }
+            }
+            else if(arg === 'nameDesc')
+            {
+                return (a, b) => {
+                    return -a.hotelName.localeCompare(b.hotelName);
+                }
+            }
+        }
+        else if (type === 'transport')
+        {
+            if (arg === "priceAsc")
+            {
+                return (a, b) => {
+                    return a.price - b.price;
+                }
+            }
+            else if (arg === "priceDesc")
+            {
+                return (a, b) => {
+                    return -(a.price - b.price);
+                }
+            }
+        }
+        else if (type === 'restaurant')
+        {
+            if (arg === 'nameAsc')
+            {
+                return (a, b) => {
+                    return a.restaurantName.localeCompare(b.restaurantName);
+                }
+            }
+            else if(arg === 'nameDesc')
+            {
+                return (a, b) => {
+                    return -a.restaurantName.localeCompare(b.restaurantName);
+                }
+            }
+        }
+    }
+
+    let link = props.type === "transport" ? `/transport/search?from=${params.from}&to=${params.to}&date=${params.date}&numPassengers=${params.numPassengers}` : props.type === "hotel" ? `/hotel/search?hotelLocation=${params.hotelLocation}&dateFrom=${params.dateFrom}&dateTo=${params.dateTo}&numBeds=${params.numBeds}&flexible=${params.flexible}` : `/restaurant/search?restaurantLocation=${params.restaurantLocation}&date=${params.date}&hourFrom=${params.hourFrom}&hourTo=${params.hourTo}&numPeople=${params.numPeople}`
     console.log(link)
     console.log(params.date)
-    const { data, isLoading, getData, setData } = useGet(link);
+    const {data, isLoading, getData, setData} = useGet(link);
     !isLoading && console.log(data)
     return (
         <>
             <Navigation></Navigation>
-            <SearchCriterias criterias={useParams()}></SearchCriterias>
+            <SearchCriteriasBar type={props.type} criterias={useParams()}></SearchCriteriasBar>
             <Container className="d-flex justify-content-end gx-5" style={{maxWidth: "60%"}}>
                 <Row>
@@ -61 +113 @@
                     </Col>
                     <Col>
-                        <SortButton></SortButton>
+                        <SortButton setSortingArg={setSortingArg} type={props.type}></SortButton>
                     </Col>
                 </Row>
             </Container>
             {props.type === "hotel" && !isLoading && data && <Container fluid>
-                {data.map(hotel => {
+                {data.sort(getSortingFn(props.type, sortingArg)).map(hotel => {
                     return <HotelLisitng from={params.dateFrom} to={params.dateTo} data={hotel}/>
                 })}
-                </Container>}
+            </Container>}
             {props.type === "transport" && !isLoading && data && <Container fluid>
-                {data.map(transport => {
+                {data.sort(getSortingFn(props.type, sortingArg)).map(transport => {
                     return <TransportListing params={params} data={transport}/>
                 })}
             </Container>}
             {props.type === "restaurant" && !isLoading && data && <Container fluid>
-                {data.map(restaurant => {
+                {data.sort(getSortingFn(props.type, sortingArg)).map(restaurant => {
                     return <RestaurantListing params={params} data={restaurant}/>
                 })}