kupos-ui-components-lib 4.0.1 → 4.0.3

package/dist/components/ServiceItem/ServiceItemDesktop.js

@@ -8,6 +8,7 @@ import LottiePlayer from "../../assets/LottiePlayer";
 const SEAT_EXCEPTIONS = ["Asiento mascota"];
 function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, originIconStyle, t = (key) => key, }) {
     var _a, _b, _c, _d, _e, _f, _g;
+    console.log("🚀 ~ ServiceItemPB ~ serviceItem:", serviceItem);
     const SvgAmenities = ({ moreAnemities, name, color, }) => {
         const amenityKey = name.toLowerCase().replace(/\s/g, "_");
         const getIconPath = () => {
@@ -164,7 +165,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
         }
         return null;
     };
-    const getSortedSeatTypes = () => {
+    const getAllSeatTypes = () => {
         var _a;
         if (!((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.length)) {
             return [{ label: "Salon cama", price: 0 }];
@@ -176,6 +177,14 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
             price: val === null || val === void 0 ? void 0 : val.fare,
         }));
         seatTypesWithPrices.sort((a, b) => a.price - b.price);
+        return seatTypesWithPrices;
+    };
+    const getSortedSeatTypes = () => {
+        var _a;
+        if (!((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.length)) {
+            return [{ label: "Salon cama", price: 0 }];
+        }
+        let seatTypesWithPrices = getAllSeatTypes();
         const premiumIndex = seatTypesWithPrices.findIndex((item) => item.label === "Premium");
         if (premiumIndex >= 3) {
             seatTypesWithPrices[2] = seatTypesWithPrices[premiumIndex];
@@ -183,15 +192,14 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
         seatTypesWithPrices = seatTypesWithPrices.slice(0, 2);
         return seatTypesWithPrices;
     };
-    const getUniqueSeatsWithLowestPrice = () => {
-        const sortedSeatTypes = getSortedSeatTypes();
+    const getUniqueSeats = () => {
+        const allSeatTypes = getAllSeatTypes();
         const seatMap = new Map();
-        sortedSeatTypes.forEach((seat) => {
+        allSeatTypes.forEach((seat) => {
             if (SEAT_EXCEPTIONS.includes(seat.label))
                 return;
-            const currentLowest = seatMap.get(seat.label);
-            const seatPrice = parseFloat(seat.price);
-            if (!currentLowest || seatPrice < parseFloat(currentLowest.price)) {
+            // Only check if the label already exists in the map, don't compare prices
+            if (!seatMap.has(seat.label)) {
                 seatMap.set(seat.label, seat);
             }
         });
@@ -201,10 +209,10 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
         return serviceItem.seat_types.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
     };
     const getSeatNames = () => {
-        const sortedSeatTypesDuplicate = getUniqueSeatsWithLowestPrice();
+        const uniqueSeats = getUniqueSeats();
         const sortedSeatTypes = getSortedSeatTypes();
         if (removeDuplicateSeats) {
-            return sortedSeatTypesDuplicate.map((val, key) => SEAT_EXCEPTIONS.includes(val.label) ? null : (React.createElement("span", { key: key, className: `flex items-center justify-between  text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` }, typeof val.label === "string" || typeof val.label === "number"
+            return uniqueSeats.map((val, key) => SEAT_EXCEPTIONS.includes(val.label) ? null : (React.createElement("span", { key: key, className: `flex items-center justify-between  text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` }, typeof val.label === "string" || typeof val.label === "number"
                 ? val.label
                 : null)));
         }
@@ -214,7 +222,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
     };
     const getSeatPrice = () => {
         const sortedSeatTypes = getSortedSeatTypes();
-        const uniqueSeats = getUniqueSeatsWithLowestPrice();
+        const uniqueSeats = getUniqueSeats();
         if (removeDuplicateSeats) {
             return uniqueSeats.map((val, key) => (React.createElement("span", { key: key }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) <= 0
                 ? CommonService.currency(0, currencySign)

package/dist/components/ServiceItem/ServiceItemMobile.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
 import { MobileServiceItemProps } from "./mobileTypes";
-declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, }: MobileServiceItemProps): React.ReactElement;
+declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, }: MobileServiceItemProps): React.ReactElement;
 export default ServiceItemMobile;

package/dist/components/ServiceItem/ServiceItemMobile.js

@@ -14,7 +14,7 @@ const exceptions = [
     "blanco",
     "asiento_mascota",
 ];
-function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, }) {
+function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, }) {
     var _a, _b, _c;
     const isPetSeat = (Object.keys(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.pet_seat_info) || []).length > 0;
     let isSoldOut = serviceItem.available_seats <= 0;
@@ -36,6 +36,22 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
         }
     };
     const seatTypes = () => {
+        var _a, _b, _c, _d;
+        let seatTypes = (_d = (_c = (_b = (_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.filter((item) => getFilteredSeats(item.label))) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.fare - b.fare) // Add this line to sort by fare
+        ) === null || _c === void 0 ? void 0 : _c.slice(0, 2)) === null || _d === void 0 ? void 0 : _d.map((type, i) => {
+            var _a;
+            return exceptions.includes(type.label) ? null : (React.createElement("div", { className: ((_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.length) > 2
+                    ? "w-[100%] flex flex-row justify-between "
+                    : "w-[100%] flex flex-row justify-between items-center", key: i },
+                React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] ", style: {
+                        // marginLeft: "10px",
+                        color: isSoldOut ? "#bbb" : "#464647",
+                    } }, type.label),
+                React.createElement("span", { className: "min-[420]:text-[13px] text-[11px]  bold-text", style: { color: isSoldOut ? "#bbb" : colors.seatPriceColor } }, commonService.currency(type.fare, currencySign))));
+        });
+        return seatTypes;
+    };
+    const seatTypesWithRemoveDuplicateSeats = () => {
         var _a, _b;
         const seatMap = new Map();
         (_b = (_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.filter((item) => getFilteredSeats(item.label))) === null || _b === void 0 ? void 0 : _b.forEach((item) => {
@@ -209,7 +225,9 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
                                     ? "space-between"
                                     : "center",
                             } },
-                            seatTypes(),
+                            removeDuplicateSeats
+                                ? seatTypesWithRemoveDuplicateSeats()
+                                : seatTypes(),
                             isSoldOut ? (React.createElement("div", { className: "flex justify-end" },
                                 React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] text-[#ccc]" }, "Agotado"))) : null))),
                 React.createElement("div", { className: "bg-[#E6E6E6] -ml-[12px] -mr-[12px] mt-[10px] mb-[10px] h-[1px]" }),

package/dist/components/ServiceItem/mobileTypes.d.ts

@@ -137,4 +137,5 @@ export interface MobileServiceItemProps {
     variant?: "desktop" | "mobile" | "auto";
     showRating?: boolean;
     showLastSeats?: boolean;
+    removeDuplicateSeats?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kupos-ui-components-lib",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "A reusable UI components package",
   "publishConfig": {
     "access": "public"

package/src/components/ServiceItem/ServiceItemDesktop.tsx

@@ -31,6 +31,7 @@ function ServiceItemPB({
   originIconStyle,
   t = (key: string) => key,
 }: ServiceItemProps & { currencySign?: string }): React.ReactElement {
+  console.log("🚀 ~ ServiceItemPB ~ serviceItem:", serviceItem);
   const SvgAmenities = ({
     moreAnemities,
     name,
@@ -243,7 +244,7 @@ function ServiceItemPB({
     return null;
   };
 
-  const getSortedSeatTypes = () => {
+  const getAllSeatTypes = () => {
     if (!serviceItem?.seat_types?.length) {
       return [{ label: "Salon cama", price: 0 }];
     }
@@ -256,6 +257,16 @@ function ServiceItemPB({
       }));
 
     seatTypesWithPrices.sort((a, b) => a.price - b.price);
+
+    return seatTypesWithPrices;
+  };
+
+  const getSortedSeatTypes = () => {
+    if (!serviceItem?.seat_types?.length) {
+      return [{ label: "Salon cama", price: 0 }];
+    }
+
+    let seatTypesWithPrices = getAllSeatTypes();
     const premiumIndex = seatTypesWithPrices.findIndex(
       (item) => item.label === "Premium"
     );
@@ -269,17 +280,15 @@ function ServiceItemPB({
     return seatTypesWithPrices;
   };
 
-  const getUniqueSeatsWithLowestPrice = () => {
-    const sortedSeatTypes = getSortedSeatTypes();
+  const getUniqueSeats = () => {
+    const allSeatTypes = getAllSeatTypes();
     const seatMap = new Map();
 
-    sortedSeatTypes.forEach((seat) => {
+    allSeatTypes.forEach((seat) => {
       if (SEAT_EXCEPTIONS.includes(seat.label)) return;
 
-      const currentLowest = seatMap.get(seat.label);
-      const seatPrice = parseFloat(seat.price as any);
-
-      if (!currentLowest || seatPrice < parseFloat(currentLowest.price)) {
+      // Only check if the label already exists in the map, don't compare prices
+      if (!seatMap.has(seat.label)) {
         seatMap.set(seat.label, seat);
       }
     });
@@ -294,11 +303,11 @@ function ServiceItemPB({
   };
 
   const getSeatNames = () => {
-    const sortedSeatTypesDuplicate = getUniqueSeatsWithLowestPrice();
+    const uniqueSeats = getUniqueSeats();
     const sortedSeatTypes = getSortedSeatTypes();
 
     if (removeDuplicateSeats) {
-      return sortedSeatTypesDuplicate.map((val, key: number) =>
+      return uniqueSeats.map((val, key: number) =>
         SEAT_EXCEPTIONS.includes(val.label) ? null : (
           <span
             key={key}
@@ -331,7 +340,7 @@ function ServiceItemPB({
 
   const getSeatPrice = () => {
     const sortedSeatTypes = getSortedSeatTypes();
-    const uniqueSeats = getUniqueSeatsWithLowestPrice();
+    const uniqueSeats = getUniqueSeats();
     if (removeDuplicateSeats) {
       return uniqueSeats.map((val, key) => (
         <span key={key}>

package/src/components/ServiceItem/ServiceItemMobile.tsx

@@ -34,6 +34,7 @@ function ServiceItemMobile({
   isPeru,
   showRating,
   showLastSeats,
+  removeDuplicateSeats,
 }: MobileServiceItemProps): React.ReactElement {
   const isPetSeat = (Object.keys(serviceItem?.pet_seat_info) || []).length > 0;
   let isSoldOut = serviceItem.available_seats <= 0;
@@ -60,6 +61,42 @@ function ServiceItemMobile({
   };
 
   const seatTypes = () => {
+    let seatTypes = serviceItem.seat_types
+      ?.filter((item) => getFilteredSeats(item.label))
+      ?.sort((a, b) => a.fare - b.fare) // Add this line to sort by fare
+      ?.slice(0, 2)
+      ?.map((type, i) =>
+        exceptions.includes(type.label) ? null : (
+          <div
+            className={
+              serviceItem.seat_types?.length > 2
+                ? "w-[100%] flex flex-row justify-between "
+                : "w-[100%] flex flex-row justify-between items-center"
+            }
+            key={i}
+          >
+            <span
+              className="min-[420]:text-[13px] text-[11px] "
+              style={{
+                // marginLeft: "10px",
+                color: isSoldOut ? "#bbb" : "#464647",
+              }}
+            >
+              {type.label}
+            </span>
+            <span
+              className={"min-[420]:text-[13px] text-[11px]  bold-text"}
+              style={{ color: isSoldOut ? "#bbb" : colors.seatPriceColor }}
+            >
+              {commonService.currency(type.fare, currencySign)}
+            </span>
+          </div>
+        )
+      );
+    return seatTypes;
+  };
+
+  const seatTypesWithRemoveDuplicateSeats = () => {
     const seatMap = new Map();
 
     serviceItem.seat_types
@@ -403,7 +440,9 @@ function ServiceItemMobile({
                       : "center",
                 }}
               >
-                {seatTypes()}
+                {removeDuplicateSeats
+                  ? seatTypesWithRemoveDuplicateSeats()
+                  : seatTypes()}
 
                 {isSoldOut ? (
                   <div className="flex justify-end">

package/src/components/ServiceItem/mobileTypes.ts

@@ -151,4 +151,5 @@ export interface MobileServiceItemProps {
   variant?: "desktop" | "mobile" | "auto";
   showRating?: boolean;
   showLastSeats?: boolean;
+  removeDuplicateSeats?: boolean;
 }