@qite/tide-booking-component 1.2.4 → 1.2.5

package/src/booking-product/components/footer.tsx

@@ -1,70 +1,69 @@
-import React, { useContext } from "react";
-import Loader from "../../shared/components/loader";
-import { getTranslations } from "../../shared/utils/localization-util";
-import SettingsContext from "../settings-context";
-import { buildClassName } from "../../shared/utils/class-util";
-
-interface FooterProps {
-  priceText: string | undefined;
-  isLoading: boolean;
-  isOffer: boolean | undefined;
-  roomsIsDisabled: boolean;
-  handleBookClick: () => void;
-}
-
-const Footer: React.FC<FooterProps> = ({
-  priceText,
-  isLoading,
-  isOffer,
-  roomsIsDisabled,
-  handleBookClick
-}) => {
-  const {
-    language,
-    alternativeActionText,
-    alternativeAction
-  } = useContext(SettingsContext);
-  const translations = getTranslations(language);
-
-  return (
-    <div className="booking-product__footer">
-      {isLoading
-        ? (<Loader loaderText={translations.PRODUCT.LOADING_PRICE} />)
-        : (
-          <>
-            {priceText && (
-              <div className="booking-product__footer-total">
-                <div className="booking-product__footer-label">
-                  {translations.SHARED.TOTAL_PRICE}
-                </div>
-                <div className="booking-product__footer-price">
-                  {priceText}
-                </div>
-              </div>
-            )}
-            <div className="booking-product_footer-actions">
-              {priceText ? (
-                <button type="button" className={buildClassName([
-                  "cta",
-                  !roomsIsDisabled && "cta--disabled"
-                ])} onClick={handleBookClick} disabled={!roomsIsDisabled}>
-                  {isOffer ? translations.PRODUCT.TO_YOUR_OFFER : translations.PRODUCT.BOOK_NOW}
-                </button>
-              ) : ((alternativeActionText && alternativeAction)
-                ? (
-                  <a href="#offer-form" className="cta" onClick={alternativeAction}>
-                    {alternativeActionText}
-                  </a>
-                )
-                : (
-                  <>{translations.PRODUCT.NOT_AVAILABLE}</>
-                )
-              )}
-            </div>
-          </>
-        )}
-    </div>
-  );
-}
-
-export default Footer;
+import React, { useContext } from "react";
+import Loader from "../../shared/components/loader";
+import { getTranslations } from "../../shared/utils/localization-util";
+import SettingsContext from "../settings-context";
+import { buildClassName } from "../../shared/utils/class-util";
+
+interface FooterProps {
+  priceText: string | undefined;
+  isLoading: boolean;
+  isOffer: boolean | undefined;
+  roomsIsDisabled: boolean;
+  handleBookClick: () => void;
+}
+
+const Footer: React.FC<FooterProps> = ({
+  priceText,
+  isLoading,
+  isOffer,
+  roomsIsDisabled,
+  handleBookClick,
+}) => {
+  const { language, alternativeActionText, alternativeAction } =
+    useContext(SettingsContext);
+  const translations = getTranslations(language);
+
+  return (
+    <div className="booking-product__footer">
+      {isLoading ? (
+        <Loader loaderText={translations.PRODUCT.LOADING_PRICE} />
+      ) : (
+        <>
+          {priceText && (
+            <div className="booking-product__footer-total">
+              <div className="booking-product__footer-label">
+                {translations.SHARED.TOTAL_PRICE}
+              </div>
+              <div className="booking-product__footer-price">{priceText}</div>
+            </div>
+          )}
+          <div className="booking-product__footer-actions">
+            {priceText ? (
+              <button
+                type="button"
+                className={buildClassName([
+                  "cta",
+                  !roomsIsDisabled && "cta--disabled",
+                ])}
+                onClick={handleBookClick}
+                disabled={!roomsIsDisabled}
+              >
+                {isOffer
+                  ? translations.PRODUCT.TO_YOUR_OFFER
+                  : translations.PRODUCT.BOOK_NOW}
+              </button>
+            ) : alternativeActionText && alternativeAction ? (
+              <a href="#offer-form" className="cta" onClick={alternativeAction}>
+                {alternativeActionText}
+              </a>
+            ) : (
+              <>{translations.PRODUCT.NOT_AVAILABLE}</>
+            )}
+          </div>
+        </>
+      )}
+    </div>
+  );
+};
+
+export default Footer;

package/src/booking-product/components/header.tsx

@@ -1,68 +1,79 @@
-import React, { useContext } from "react";
-import Loader from "../../shared/components/loader";
-import Rating from "./rating";
-import { getTranslations } from "../../shared/utils/localization-util";
-import SettingsContext from "../settings-context";
-import Icon from "./icon";
-
-interface HeaderProps {
-  name: string;
-  rating: number | undefined;
-  priceText: string | undefined;
-  hasFlight: boolean;
-  hasTransfer: boolean;
-  isLoading: boolean;
-}
-
-const Header: React.FC<HeaderProps> = ({
-  name,
-  rating,
-  priceText,
-  isLoading,
-  hasFlight,
-  hasTransfer
-}) => {
-  const {
-    language
-  } = useContext(SettingsContext);
-  const translations = getTranslations(language);
-
-  return (
-    <div className="booking-product__header">
-      <div className="booking-product__hotel">
-        {rating && <Rating rating={rating} />}
-        <div className="booking-product__title">{name}</div>
-      </div>
-      <div className="booking-product__price">
-        {isLoading
-          ? (<Loader loaderText={translations.PRODUCT.LOADING_PRICE} />)
-          : (
-            <>
-              <div className="pricing__header pricing__price">
-                {priceText}
-              </div>
-              <div className="package-icons">
-                {priceText && (
-                  <div className="package-icons__icon">
-                    <Icon name="ui-bed" title={translations.PRODUCT.STAY_INCLUDED} width={25} height={25} />
-                  </div>
-                )}
-                {hasFlight && (
-                  <div className="package-icons__icon">
-                    <Icon name="ui-flight" title={translations.PRODUCT.FLIGHT_INCLUDED} width={25} height={25} />
-                  </div>
-                )}
-                {hasTransfer && (
-                  <div className="package-icons__icon">
-                    <Icon name="ui-transfer" title={translations.PRODUCT.TRANSFER_INCLUDED} width={25} height={25} />
-                  </div>
-                )}
-              </div>
-            </>
-          )}
-      </div>
-    </div>
-  )
-}
-
-export default Header;
+import React, { useContext } from "react";
+import Loader from "../../shared/components/loader";
+import Rating from "./rating";
+import { getTranslations } from "../../shared/utils/localization-util";
+import SettingsContext from "../settings-context";
+import Icon from "./icon";
+
+interface HeaderProps {
+  name: string;
+  rating: number | undefined;
+  priceText: string | undefined;
+  hasFlight: boolean;
+  hasTransfer: boolean;
+  isLoading: boolean;
+}
+
+const Header: React.FC<HeaderProps> = ({
+  name,
+  rating,
+  priceText,
+  isLoading,
+  hasFlight,
+  hasTransfer,
+}) => {
+  const { language } = useContext(SettingsContext);
+  const translations = getTranslations(language);
+
+  return (
+    <div className="booking-product__header">
+      <div className="booking-product__hotel">
+        {rating && <Rating rating={rating} />}
+        <div className="booking-product__title">{name}</div>
+      </div>
+      <div className="booking-product__price">
+        {isLoading ? (
+          <Loader loaderText={translations.PRODUCT.LOADING_PRICE} />
+        ) : (
+          <>
+            <div className="pricing__header pricing__price">{priceText}</div>
+            <div className="package-icons">
+              {priceText && (
+                <div className="package-icons__icon">
+                  <Icon
+                    name="ui-bed"
+                    title={translations.PRODUCT.STAY_INCLUDED}
+                    width={25}
+                    height={25}
+                  />
+                </div>
+              )}
+              {hasFlight && (
+                <div className="package-icons__icon">
+                  <Icon
+                    name="ui-flight"
+                    title={translations.PRODUCT.FLIGHT_INCLUDED}
+                    width={25}
+                    height={25}
+                  />
+                </div>
+              )}
+              {hasTransfer && (
+                <div className="package-icons__icon">
+                  <Icon
+                    name="ui-transfer"
+                    title={translations.PRODUCT.TRANSFER_INCLUDED}
+                    width={25}
+                    height={25}
+                  />
+                </div>
+              )}
+            </div>
+          </>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default Header;