bukazu-portal-react 2.0.21 → 2.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bukazu-portal-react",
-  "version": "2.0.21",
+  "version": "2.1.4",
   "description": "A package for loading the calendar and search module from bukazu loading into a react app.",
   "main": "build/index.js",
   "repository": "https://github.com/BUKAZU/React-portal",
@@ -23,7 +23,7 @@
     "@babel/preset-react": "^7.14.5",
     "@cypress/react": "^5.3.3",
     "@cypress/webpack-dev-server": "^1.1.3",
-    "@rollup/plugin-commonjs": "^20.0.0",
+    "@rollup/plugin-commonjs": "^21.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "autoprefixer": "^10.2.5",
     "babel-core": "^6.26.3",
@@ -47,7 +47,7 @@
     "postcss-loader": "^5.2.0",
     "postcss-modules": "^4.2.2",
     "postcss-nested": "^5.0.5",
-    "postcss-preset-env": "^6.7.0",
+    "postcss-preset-env": "^7.4.3",
     "prettier": "^2.3.1",
     "react": "^16.4.1",
     "react-dev-utils": "^5.0.1",
@@ -71,7 +71,7 @@
     "formik": "^2.2.9",
     "graphql": "^15.6.0",
     "react-date-picker": "^8.1.1",
-    "react-intl": "^2.7.2",
+    "react-intl": "5",
     "react-js-pagination": "^3.0.2"
   },
   "eslintConfig": {

package/src/_lib/SearchQueries.js

@@ -50,6 +50,59 @@ export const HOUSES_QUERY = gql`
   }
 `;
 
+export const HOUSES_PRICE_QUERY = gql`
+  query PortalSiteHousesQuery(
+    $id: ID!
+    $country_id: ID
+    $region_id: String
+    $city_id: String
+    $persons_min: Int
+    $persons_max: Int
+    $bedrooms_min: Int
+    $bathrooms_min: Int
+    $arrival_date: String
+    $starts_at: Date!
+    $ends_at: Date!
+    $no_nights: Int
+    $properties: String
+    $weekprice_max: Int
+    $limit: Int
+    $skip: Int
+  ) {
+    PortalSite(id: $id) {
+      houses(
+        country_id: $country_id
+        region_id: $region_id
+        city_id: $city_id
+        persons_min: $persons_min
+        persons_max: $persons_max
+        bedrooms_min: $bedrooms_min
+        bathrooms_min: $bathrooms_min
+        arrival_date: $arrival_date
+        weekprice_max: $weekprice_max
+        no_nights_min: $no_nights
+        properties: $properties
+        limit: $limit
+        skip: $skip
+      ) {
+        id
+        name
+        persons
+        bathrooms
+        bedrooms
+        description
+        image_url
+        house_url
+        province
+        city
+        country_name
+        minimum_week_price
+        booking_price(starts_at: $starts_at, ends_at: $ends_at)
+      }
+    }
+  }
+`;
+
 export const HOUSE_COUNT_QUERY = gql`
   query PortalSiteHousesQuery(
     $id: ID!

package/src/components/SearchPage/Field.js

@@ -57,8 +57,8 @@ class Field extends Component {
   }
 
   render() {
-    const field = this.props.field;
-    const { PortalSite } = this.props;
+    const { PortalSite, field, filters, value } = this.props;
+
     let options = [];
     if (includes(['countries', 'cities', 'regions'], field.id)) {
       options = PortalSite[field.id];
@@ -74,9 +74,10 @@ class Field extends Component {
       options = this.createNumberArray(PortalSite[field.id]);
     }
     let input;
-    const value = this.props.value;
-    const countries = this.props.filters.countries;
-    const regions = this.props.filters.regions;
+    const countries = filters.countries ;
+    const regions = Array.isArray(filters.regions)
+      ? filters.regions
+      : [filters.regions];
     const properties = this.props.filters.properties || [];
 
     if (field.id === 'properties') {
@@ -108,6 +109,7 @@ class Field extends Component {
         }
       });
     } else if (field.type === 'select') {
+      console.log({ countries });
       if (options && includes(['countries', 'cities', 'regions'], field.id)) {
         input = (
           <select

package/src/components/SearchPage/Results.js

@@ -7,7 +7,7 @@ import Loading from '../icons/loading.svg';
 import SingleResult from './SingleResult';
 import Paginator from './Paginator';
 
-import { HOUSES_QUERY } from '../../_lib/SearchQueries';
+import { HOUSES_PRICE_QUERY, HOUSES_QUERY } from '../../_lib/SearchQueries';
 import { ApiError } from '../Error';
 
 function Results({
@@ -20,11 +20,13 @@ function Results({
   activePage,
 }) {
   let min_nights = null;
+  let requestPrices = false
   if (filters.departure_date && filters.arrival_date) {
     min_nights = differenceInCalendarDays(
       filters.departure_date,
       filters.arrival_date
     );
+    requestPrices = true
   } else if (filters.arrival_date) {
     min_nights = 1;
   }
@@ -45,6 +47,8 @@ function Results({
     bedrooms_min: Number(filters.bedrooms_min),
     bathrooms_min: Number(filters.bathrooms_min),
     arrival_date: filters.arrival_date,
+    starts_at: filters.arrival_date,
+    ends_at: filters.departure_date,
     no_nights: Number(min_nights) || null,
     extra_search: filters.extra_search,
     properties,
@@ -55,7 +59,7 @@ function Results({
   };
 
   return (
-    <Query query={HOUSES_QUERY} variables={variables}>
+    <Query query={requestPrices ? HOUSES_PRICE_QUERY : HOUSES_QUERY} variables={variables}>
       {({ loading, error, data }) => {
         if (loading)
           return (

package/src/components/SearchPage/SearchPage.js

@@ -3,8 +3,6 @@ import PropTypes from 'prop-types';
 import Filters from './Filters';
 import Results from './Results';
 
-// import './SearchPage.css'
-
 class SearchPage extends Component {
   constructor(props) {
     super(props);
@@ -21,11 +19,23 @@ class SearchPage extends Component {
     this.pageChange = this.pageChange.bind(this);
   }
 
+  componentDidMount() {
+    let filters = localStorage.getItem('bukazuFilters')
+    let activePage = localStorage.getItem('bukazuActivePage')
+
+    this.setState({
+      filters: JSON.parse(filters) || this.props.filters,
+    });
+    this.pageChange(activePage || 1)
+  }
+
   onFilterChange(data) {
     let filters = data;
     this.setState({
       filters,
     });
+
+    localStorage.setItem('bukazuFilters', JSON.stringify(filters));
     this.pageChange(1);
   }
 
@@ -33,6 +43,7 @@ class SearchPage extends Component {
     const { limit } = this.state;
     let newSkip = pageNumber * limit - limit;
 
+    localStorage.setItem('bukazuActivePage', pageNumber)
     this.setState({
       activePage: pageNumber,
       skip: newSkip,

package/src/components/SearchPage/SingleResult.js

@@ -42,15 +42,31 @@ function SingleResult({ result, options }) {
           </div>
           {thisOptions.showPrice && (
             <div className="result-price">
-              <FormattedMessage id="minimum_week_price" />
-              <span className="price">
-                €{' '}
-                <FormattedNumber
-                  value={result.minimum_week_price}
-                  minimumFractionDigits={0}
-                  maximumFractionDigits={0}
-                />
-              </span>
+              {result.booking_price ? (
+                <>
+                <FormattedMessage id="price_from" />
+                  <span className="price">
+                    €{' '}
+                    <FormattedNumber
+                      value={result.booking_price.total_price}
+                      minimumFractionDigits={0}
+                      maximumFractionDigits={0}
+                    />
+                  </span>
+                </>
+              ) : (
+                <>
+                  <FormattedMessage id="minimum_week_price" />
+                  <span className="price">
+                    €{' '}
+                    <FormattedNumber
+                      value={result.minimum_week_price}
+                      minimumFractionDigits={0}
+                      maximumFractionDigits={0}
+                    />
+                  </span>
+                </>
+              )}
             </div>
           )}
           <div className="result-button">
@@ -60,7 +76,7 @@ function SingleResult({ result, options }) {
       </div>
     </a>
   );
-};
+}
 
 SingleResult.propTypes = {
   result: PropTypes.object.isRequired,

package/src/index.js

@@ -1,6 +1,6 @@
 import React from "react";
 import App from "./components/App";
-import { IntlProvider, addLocaleData } from "react-intl";
+import { IntlProvider } from "react-intl";
 // import registerServiceWorker from './registerServiceWorker';
 
 import {
@@ -9,12 +9,6 @@ import {
   ApolloProvider,
 } from "@apollo/client";
 
-import enData from "react-intl/locale-data/en";
-import frData from "react-intl/locale-data/fr";
-import esData from "react-intl/locale-data/es";
-import nlData from "react-intl/locale-data/nl";
-import deData from "react-intl/locale-data/de";
-import itData from "react-intl/locale-data/it";
 
 import en from "./locales/en.json";
 import nl from "./locales/nl.json";
@@ -51,14 +45,7 @@ function Portal({ portalCode, objectCode, pageType, locale, filters, api_url } )
 
   const messages = { en, nl, de, fr, es, it };
 
-  addLocaleData([
-    ...enData,
-    ...frData,
-    ...esData,
-    ...nlData,
-    ...itData,
-    ...deData,
-  ]);
+
 
   window.__localeId__ = locale;
 

package/src/locales/de.json

@@ -106,5 +106,6 @@
     "no_discount_code_found": "Kein Rabatt mit eingegebenem Code gefunden",
     "discount_code": "Rabatt-Code",
     "minimum_nights": "Mindestens {minimum} Nächte",
-    "can_only_take_insurance_in_de_be_nl": "Sie können sich nur versichern, wenn Sie in den Niederlanden, Deutschland oder Belgien wohnen."
+    "can_only_take_insurance_in_de_be_nl": "Sie können sich nur versichern, wenn Sie in den Niederlanden, Deutschland oder Belgien wohnen.",
+    "price_from": "Preis von"
   }

package/src/locales/en.json

@@ -107,5 +107,6 @@
     "no_discount_code_found": "No discount found with entered code",
     "discount_code": "Discount code",
     "minimum_nights": "At least {minimum} nights",
-    "can_only_take_insurance_in_de_be_nl": "You can only take out insurance if you live in the Netherlands, Germany or Belgium."
+    "can_only_take_insurance_in_de_be_nl": "You can only take out insurance if you live in the Netherlands, Germany or Belgium.",
+    "price_from": "Price from"
   }

package/src/locales/es.json

@@ -102,5 +102,6 @@
     "camper.pick_your_arrivaldate_in_the_calendar": "Elija una fecha de recogida",
     "no": "No",
     "minimum_nights": "Al menos {minimum} noches",
-    "can_only_take_insurance_in_de_be_nl": "Solo puede contratar un seguro si vive en los Países Bajos, Alemania o Bélgica."
+    "can_only_take_insurance_in_de_be_nl": "Solo puede contratar un seguro si vive en los Países Bajos, Alemania o Bélgica.",
+    "price_from": "Precio de"
   }

package/src/locales/fr.json

@@ -102,5 +102,6 @@
     "camper.pick_your_arrivaldate_in_the_calendar": "Choisissez une date de pick-up",
     "no": "Non",
     "minimum_nights": "Au moins {minimum} nuits",
-    "can_only_take_insurance_in_de_be_nl": "Vous ne pouvez souscrire une assurance que si vous résidez aux Pays-Bas, en Allemagne ou en Belgique."
+    "can_only_take_insurance_in_de_be_nl": "Vous ne pouvez souscrire une assurance que si vous résidez aux Pays-Bas, en Allemagne ou en Belgique.",
+    "price_from": "Le prix de"
   }

package/src/locales/it.json

@@ -102,5 +102,6 @@
   "camper.pick_your_arrivaldate_in_the_calendar": "Scegli una data di ritiro",
   "no": "No",
   "minimum_nights": "Almeno {minimum} notti",
-  "can_only_take_insurance_in_de_be_nl": "Puoi stipulare un'assicurazione solo se vivi nei Paesi Bassi, in Germania o in Belgio."
+  "can_only_take_insurance_in_de_be_nl": "Puoi stipulare un'assicurazione solo se vivi nei Paesi Bassi, in Germania o in Belgio.",
+  "price_from": "Prezzo da"
 }

package/src/locales/nl.json

@@ -107,5 +107,6 @@
     "no_discount_code_found": "Geen korting gevonden met ingegeven code",
     "discount_code": "Kortingscode",
     "minimum_nights": "Minstens {minimum} nachten",
-    "can_only_take_insurance_in_de_be_nl": "U kunt alleen een verzekering afsluiten, wanneer u woont in Nederland, Duitsland of België."
+    "can_only_take_insurance_in_de_be_nl": "U kunt alleen een verzekering afsluiten, wanneer u woont in Nederland, Duitsland of België.",
+    "price_from": "Prijs vanaf"
   }