kupos-ui-components-lib 9.9.1 → 9.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/KuposUIComponent.d.ts +3 -0
- package/dist/components/ServiceItem/PeruServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/PeruServiceItemDesktop.js +2 -2
- package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +30 -31
- package/dist/components/ServiceItem/ServiceItemMobile.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemMobile.js +43 -17
- package/dist/components/ServiceItem/mobileTypes.d.ts +48 -1
- package/dist/components/ServiceItem/types.d.ts +27 -9
- package/dist/styles.css +215 -6
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.d.ts +1 -2
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +2 -4
- package/dist/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.js +22 -41
- package/dist/ui/FeatureServiceUI/FeatureServiceUi.js +24 -44
- package/dist/ui/OfferBanner.d.ts +2 -0
- package/dist/ui/OfferBanner.js +19 -14
- package/dist/ui/SeatSection/SeatSection.d.ts +1 -7
- package/dist/ui/SeatSection/SeatSection.js +12 -44
- package/dist/utils/CommonService.d.ts +3 -0
- package/dist/utils/CommonService.js +18 -1
- package/package.json +1 -1
- package/src/KuposUIComponent.tsx +3 -0
- package/src/assets/images/anims/service_list/flame_anim.json +1 -0
- package/src/assets/images/anims/service_list/thunder_icon.json +1 -0
- package/src/assets/images/anims/service_list/users_anim.json +1 -0
- package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +35 -24
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +65 -53
- package/src/components/ServiceItem/ServiceItemMobile.tsx +387 -288
- package/src/components/ServiceItem/mobileTypes.ts +50 -7
- package/src/components/ServiceItem/types.ts +39 -25
- package/src/styles.css +15 -0
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +2 -4
- package/src/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.tsx +575 -0
- package/src/ui/FeatureServiceUI/FeatureServiceUi.tsx +610 -0
- package/src/ui/OfferBanner.tsx +31 -10
- package/src/ui/SeatSection/SeatSection.tsx +21 -88
- package/src/utils/CommonService.ts +26 -1
|
@@ -15,6 +15,9 @@ interface KuposUIComponentProps {
|
|
|
15
15
|
orignLabel?: string;
|
|
16
16
|
destinationLabel?: string;
|
|
17
17
|
t?: (key: string) => string;
|
|
18
|
+
ticketQuantity?: number;
|
|
19
|
+
onIncreaseTicketQuantity?: (serviceItem: any) => void;
|
|
20
|
+
onDecreaseTicketQuantity?: (serviceItem: any) => void;
|
|
18
21
|
id?: string;
|
|
19
22
|
name?: string;
|
|
20
23
|
description?: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ServiceItemProps } from "./types";
|
|
3
|
-
declare function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus,
|
|
3
|
+
declare function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus, isNewUiEnabled, t, }: ServiceItemProps & {
|
|
4
4
|
currencySign?: string;
|
|
5
5
|
}): React.ReactElement;
|
|
6
6
|
export default PeruServiceItemDesktop;
|
|
@@ -35,7 +35,7 @@ import PetBlock from "../../ui/PetBlock";
|
|
|
35
35
|
import FlexibleBlock from "../../ui/FlexibleBlock";
|
|
36
36
|
import AmenitiesBlock from "../../ui/AmenitiesBlock";
|
|
37
37
|
const SEAT_EXCEPTIONS = ["Asiento mascota"];
|
|
38
|
-
function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus,
|
|
38
|
+
function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus, isNewUiEnabled, t = (key) => key, }) {
|
|
39
39
|
var _a, _b, _c, _d;
|
|
40
40
|
const animationMap = {
|
|
41
41
|
promoAnim: {
|
|
@@ -355,7 +355,7 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
355
355
|
React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:14%_40%_0.5%_24%_13.5%] gap-x-[2%] items-center", style: { marginTop: showTopLabel ? "8px" : "" } },
|
|
356
356
|
React.createElement("div", { className: "flex items-center justify-center m-[auto]" },
|
|
357
357
|
React.createElement("div", { className: " " },
|
|
358
|
-
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `h-auto object-contain ${
|
|
358
|
+
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: ` h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
|
|
359
359
|
isCiva ? (React.createElement("div", { className: "text-[13.33px] black-text ml-2" }, serviceItem.operator_details[2])) : null),
|
|
360
360
|
React.createElement("div", { className: `min-h-[2.5rem] grid grid-cols-[0.8fr_auto_26%_1fr] gap-x-4 items-center text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: {
|
|
361
361
|
gridTemplateRows: "1fr",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ServiceItemProps } from "./types";
|
|
3
|
-
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption,
|
|
3
|
+
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, }: ServiceItemProps & {
|
|
4
4
|
currencySign?: string;
|
|
5
5
|
}): React.ReactElement;
|
|
6
6
|
export default ServiceItemPB;
|
|
@@ -23,6 +23,8 @@ import bombAnimation from "../../assets/images/anims/service_list/bomb.json";
|
|
|
23
23
|
import dotAnimation from "../../assets/images/anims/service_list/dot_animation.json";
|
|
24
24
|
import starAnimation from "../../assets/images/anims/service_list/star_anim.json";
|
|
25
25
|
import femaleAnimation from "../../assets/images/anims/service_list/female_anim.json";
|
|
26
|
+
import usersAnimation from "../../assets/images/anims/service_list/users_anim.json";
|
|
27
|
+
import flameAnimation from "../../assets/images/anims/service_list/flame_anim.json";
|
|
26
28
|
import RatingBlock from "../../ui/RatingBlock";
|
|
27
29
|
import DurationBlock from "../../ui/DurationBlock";
|
|
28
30
|
import PetBlock from "../../ui/PetBlock";
|
|
@@ -32,6 +34,8 @@ import KuposButton from "../../ui/KuposButton/KuposButton";
|
|
|
32
34
|
import BottomAmenities from "../../ui/BottomAmenities/BottomAmenities";
|
|
33
35
|
import SeatSection from "../../ui/SeatSection/SeatSection";
|
|
34
36
|
import DateTimeSection from "../../ui/DateTimeSection/DateTimeSection";
|
|
37
|
+
import FeatureServiceUi from "../../ui/FeatureServiceUI/FeatureServiceUi";
|
|
38
|
+
import thunderAnimation from "../../assets/images/anims/service_list/thunder_icon.json";
|
|
35
39
|
import ServiceBadges from "../../ui/ServiceBadges/ServiceBadges";
|
|
36
40
|
const SEAT_EXCEPTIONS = ["Asiento mascota"];
|
|
37
41
|
const ANIMATION_MAP = {
|
|
@@ -64,6 +68,9 @@ const ANIMATION_MAP = {
|
|
|
64
68
|
bombAnimation: {
|
|
65
69
|
kupos: bombAnimation,
|
|
66
70
|
},
|
|
71
|
+
thunderAnimation: {
|
|
72
|
+
kupos: thunderAnimation,
|
|
73
|
+
},
|
|
67
74
|
dotAnimation: {
|
|
68
75
|
kupos: dotAnimation,
|
|
69
76
|
},
|
|
@@ -73,13 +80,15 @@ const ANIMATION_MAP = {
|
|
|
73
80
|
femaaleAnimation: {
|
|
74
81
|
kupos: femaleAnimation,
|
|
75
82
|
},
|
|
83
|
+
usersAnimation: {
|
|
84
|
+
kupos: usersAnimation,
|
|
85
|
+
},
|
|
86
|
+
flameAnimation: {
|
|
87
|
+
kupos: flameAnimation,
|
|
88
|
+
},
|
|
76
89
|
};
|
|
77
|
-
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption,
|
|
78
|
-
var _a;
|
|
79
|
-
const handleSeatSelect = (key, price, seatKey, apiSeatType) => {
|
|
80
|
-
onClearSeatSelectionError === null || onClearSeatSelectionError === void 0 ? void 0 : onClearSeatSelectionError();
|
|
81
|
-
onSeatSelect === null || onSeatSelect === void 0 ? void 0 : onSeatSelect(key, price, seatKey, apiSeatType);
|
|
82
|
-
};
|
|
90
|
+
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, }) {
|
|
91
|
+
var _a, _b, _c;
|
|
83
92
|
const getAnimationIcon = (icon) => {
|
|
84
93
|
var _a;
|
|
85
94
|
const animation = ANIMATION_MAP[icon];
|
|
@@ -114,8 +123,9 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
114
123
|
const isItemExpanded = serviceItem.id === isExpand || isExpand === true;
|
|
115
124
|
const grayscaleClass = isSoldOut ? "grayscale" : "";
|
|
116
125
|
const hasOfferText = Boolean(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text);
|
|
126
|
+
const isNewUiEnabled = ((_b = (_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.new_ui_enabled) === true;
|
|
117
127
|
const seats = removeDuplicateSeats
|
|
118
|
-
? ((
|
|
128
|
+
? ((_c = serviceItem.seat_types) === null || _c === void 0 ? void 0 : _c.filter((seat, index, self) => index === self.findIndex((s) => s.label === seat.label))) || []
|
|
119
129
|
: serviceItem.seat_types || [];
|
|
120
130
|
const discountedSeats = seats.map((seat) => (Object.assign(Object.assign({}, seat), CommonService.calculateDiscountedPrice(seat.fare, serviceItem))));
|
|
121
131
|
const hasDiscount = discountedSeats.some((seat) => seat.originalPrice !== seat.discountedPrice);
|
|
@@ -124,7 +134,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
124
134
|
const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true;
|
|
125
135
|
const offerGradient = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"} 0%, ${colors.leftGradiantColor || "#ff8842"} 100%)`;
|
|
126
136
|
const offerGradientWithOpacity = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"}80 0%, ${colors.leftGradiantColor || "#ff8842"}80 100%)`;
|
|
127
|
-
const serviceCardStyle = hasOfferText || hasDpEnabled
|
|
137
|
+
const serviceCardStyle = (hasOfferText && isNewUiEnabled) || hasDpEnabled
|
|
128
138
|
? {
|
|
129
139
|
borderColor: "transparent",
|
|
130
140
|
borderStyle: "solid",
|
|
@@ -217,16 +227,6 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
217
227
|
});
|
|
218
228
|
return;
|
|
219
229
|
}
|
|
220
|
-
if (isTrain) {
|
|
221
|
-
if (!selectedSeatKey) {
|
|
222
|
-
onShowSeatSelectionError === null || onShowSeatSelectionError === void 0 ? void 0 : onShowSeatSelectionError(serviceItem.id);
|
|
223
|
-
return;
|
|
224
|
-
}
|
|
225
|
-
if (onTrainButtonClick) {
|
|
226
|
-
onTrainButtonClick();
|
|
227
|
-
return;
|
|
228
|
-
}
|
|
229
|
-
}
|
|
230
230
|
onBookButtonPress();
|
|
231
231
|
};
|
|
232
232
|
const items = [
|
|
@@ -257,13 +257,18 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
257
257
|
},
|
|
258
258
|
];
|
|
259
259
|
const otherItems = items.filter((i) => i.key !== "pet" && i.key !== "flexible" && !!i.condition);
|
|
260
|
-
return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus,
|
|
260
|
+
return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus, isNewUiEnabled: isNewUiEnabled })) : isNewUi ? (React.createElement(FeatureServiceUi, { serviceItem: serviceItem, showTopLabel: showTopLabel, isSoldOut: isSoldOut, getAnimationIcon: getAnimationIcon, cityOrigin: cityOrigin, cityDestination: cityDestination, renderIcon: renderIcon, viewersConfig: viewersConfig, isFeatureDropDownExpand: isFeatureDropDownExpand, ticketQuantity: ticketQuantity, onIncreaseTicketQuantity: onIncreaseTicketQuantity, onDecreaseTicketQuantity: onDecreaseTicketQuantity, onBookButtonPress: onRemateUiButtonClick, onToggleExpand: () => setIsFeatureDropDownExpand &&
|
|
261
|
+
setIsFeatureDropDownExpand(isFeatureDropDownExpand === serviceItem.id ||
|
|
262
|
+
isFeatureDropDownExpand === true
|
|
263
|
+
? null
|
|
264
|
+
: serviceItem.id), selectedTimeSlot: selectedTimeSlot, onTimeSlotChange: onTimeSlotChange, isTimeDropdownOpen: isTimeDropdownOpen, onTimeDropdownToggle: onTimeDropdownToggle, wowDealData: wowDealData })) : (React.createElement("div", { className: `relative hover:z-[150] ${hasOfferText || hasDpEnabled ? "mb-[55px]" : "mb-[10px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
|
|
261
265
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
|
|
262
266
|
showTopLabel
|
|
263
267
|
? "mt-[24px]"
|
|
264
268
|
: "mt-[20px]"} ` },
|
|
265
|
-
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDpEnabled) && !isSoldOut && (React.createElement(OfferBanner, { offerGradient: offerGradient, isSoldOut: isSoldOut, serviceItem: serviceItem, renderIcon: renderIcon, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, viewersConfig: viewersConfig, getAnimationIcon: getAnimationIcon, showLoginOption: showLoginOption })),
|
|
266
|
-
React.createElement("div", { id: `service-card-${serviceItem.id}`, className: `bg-white mx-auto relative ${(hasOfferText
|
|
269
|
+
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDpEnabled) && !isSoldOut && (React.createElement(OfferBanner, { offerGradient: offerGradient, isSoldOut: isSoldOut, serviceItem: serviceItem, renderIcon: renderIcon, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, viewersConfig: viewersConfig, getAnimationIcon: getAnimationIcon, showLoginOption: showLoginOption, isNewUiEnabled: isNewUiEnabled, colors: colors })),
|
|
270
|
+
React.createElement("div", { id: `service-card-${serviceItem.id}`, className: `bg-white mx-auto relative ${(hasOfferText && isNewUiEnabled) && !isSoldOut ||
|
|
271
|
+
hasDpEnabled
|
|
267
272
|
? "z-[3] rounded-[18px]"
|
|
268
273
|
: "rounded-[10px] border border-[#ccc]"}`, style: serviceCardStyle },
|
|
269
274
|
React.createElement("div", { className: " pt-[20px]", style: {
|
|
@@ -289,13 +294,9 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
289
294
|
backgroundColor: "#ccc",
|
|
290
295
|
} }),
|
|
291
296
|
React.createElement("div", { className: "content-center" },
|
|
292
|
-
React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon, discountSeatPriceColor: colors.discountSeatPriceColor
|
|
297
|
+
React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon, discountSeatPriceColor: colors.discountSeatPriceColor })),
|
|
293
298
|
React.createElement("div", { className: "relative" },
|
|
294
299
|
React.createElement(KuposButton, { isSoldOut: isSoldOut, isLoading: serviceDetailsLoading, buttonColor: colors.kuposButtonColor, buyLabel: translation === null || translation === void 0 ? void 0 : translation.buyButton, soldOutLabel: translation === null || translation === void 0 ? void 0 : translation.soldOutButton, soldOutIcon: renderIcon("soldOutIcon", "14px"), onClick: checkMidnight }),
|
|
295
|
-
showSeatSelectionError === serviceItem.id && isTrain && (React.createElement("div", { className: "flex justify-center mr-[11px] w-[100%] right-[0px] absolute left-[0] top-[40px]" },
|
|
296
|
-
React.createElement("div", { className: "text-[9px] text-center whitespace-nowrap", style: {
|
|
297
|
-
color: colors.seatPriceColor,
|
|
298
|
-
} }, "Selecciona el tipo de servicio"))),
|
|
299
300
|
showLastSeats ? (React.createElement("div", { className: "flex justify-center mr-[11px] w-[100%] right-[0px] absolute left-[0] top-[40px]" }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
|
|
300
301
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[12px] mt-1 text-center", style: {
|
|
301
302
|
color: colors.seatPriceColor,
|
|
@@ -308,11 +309,9 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
308
309
|
transition: "grid-template-rows 0.3s ease-in-out, opacity 0.25s ease-in-out",
|
|
309
310
|
position: "relative",
|
|
310
311
|
zIndex: hasOfferText || hasDpEnabled ? 0 : -1,
|
|
311
|
-
|
|
312
|
+
marginTop: isItemExpanded ? "" : "-10px",
|
|
312
313
|
} },
|
|
313
|
-
React.createElement("div", { style: Object.assign({ overflow: "hidden", minHeight: 0, marginTop:
|
|
314
|
-
? "-10px"
|
|
315
|
-
: "" }, (hasOfferText || hasDpEnabled
|
|
314
|
+
React.createElement("div", { style: Object.assign({ overflow: "hidden", minHeight: 0, marginTop: hasDpEnabled || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "" : "-10px" }, (hasOfferText || hasDpEnabled
|
|
316
315
|
? {
|
|
317
316
|
borderLeft: isSoldOut ? "" : "3px solid #ff5964",
|
|
318
317
|
borderRight: isSoldOut ? "" : "3px solid #ff8842",
|
|
@@ -320,7 +319,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
320
319
|
boxSizing: "border-box",
|
|
321
320
|
}
|
|
322
321
|
: {})) },
|
|
323
|
-
React.createElement(ExpandedDropdown, { serviceItem: serviceItem, isPeru: isPeru, translation: translation, getAnimationIcon: getAnimationIcon, isChangeTicket: serviceItem.is_change_ticket === true, isSoldOut: isSoldOut, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, renderIcon: renderIcon
|
|
322
|
+
React.createElement(ExpandedDropdown, { serviceItem: serviceItem, isPeru: isPeru, translation: translation, getAnimationIcon: getAnimationIcon, isChangeTicket: serviceItem.is_change_ticket === true, isSoldOut: isSoldOut, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, renderIcon: renderIcon })))),
|
|
324
323
|
children,
|
|
325
324
|
React.createElement(ServiceBadges, { showTopLabel: showTopLabel, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, translation: translation, serviceItem: serviceItem })))));
|
|
326
325
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { MobileServiceItemProps } from "./mobileTypes";
|
|
3
|
-
declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig,
|
|
3
|
+
declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, }: MobileServiceItemProps): React.ReactElement;
|
|
4
4
|
export default ServiceItemMobile;
|
|
@@ -5,6 +5,7 @@ import BottomAmenitiesMobile from "../../ui/mobileweb/BottomAmenitiesMobile";
|
|
|
5
5
|
import DateTimeSectionMobile from "../../ui/mobileweb/DateTimeSectionMobile";
|
|
6
6
|
import ExpandedDropdownMobile from "../../ui/mobileweb/ExpandedDropdownMobile";
|
|
7
7
|
import ServiceBadgesMobile from "../../ui/mobileweb/ServiceBadgesMobile";
|
|
8
|
+
import FeatureServiceUiMobile from "../../ui/FeaturServiceUiMobile/FeatureServiceUiMobile";
|
|
8
9
|
const SEAT_EXCEPTIONS = ["Asiento mascota"];
|
|
9
10
|
const exceptions = [
|
|
10
11
|
"gy",
|
|
@@ -17,21 +18,22 @@ const exceptions = [
|
|
|
17
18
|
"blanco",
|
|
18
19
|
"asiento_mascota",
|
|
19
20
|
];
|
|
20
|
-
function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig,
|
|
21
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
21
|
+
function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, }) {
|
|
22
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
22
23
|
const isItemExpanded = serviceItem.id === isExpanded;
|
|
23
24
|
const isPetSeat = (Object.keys(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.pet_seat_info) || []).length > 0;
|
|
25
|
+
const isNewUiEnabled = ((_b = (_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.new_ui_enabled) === true;
|
|
24
26
|
let isSoldOut = serviceItem.available_seats <= 0;
|
|
25
27
|
const seats = removeDuplicateSeats
|
|
26
|
-
? ((
|
|
28
|
+
? ((_c = serviceItem.seat_types) === null || _c === void 0 ? void 0 : _c.filter((seat, index, self) => index === self.findIndex((s) => s.label === seat.label))) || []
|
|
27
29
|
: serviceItem.seat_types || [];
|
|
28
30
|
const discountedSeats = seats.map((seat) => (Object.assign(Object.assign({}, seat), commonService.calculateDiscountedPrice(seat.fare, serviceItem))));
|
|
29
31
|
const hasDiscount = discountedSeats.some((seat) => seat.originalPrice !== seat.discountedPrice);
|
|
30
|
-
const isLongOfferText = (((
|
|
32
|
+
const isLongOfferText = (((_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) === null || _d === void 0 ? void 0 : _d.length) || 0) > 35;
|
|
31
33
|
const hasOfferText = Boolean(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text);
|
|
32
34
|
const offerGradient = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"} 0%, ${colors.leftGradiantColor || "#ff8842"} 100%)`;
|
|
33
35
|
const offerGradientWithOpacity = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"}80 0%, ${colors.leftGradiantColor || "#ff8842"}80 100%)`;
|
|
34
|
-
const serviceCardStyle = hasOfferText || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
|
|
36
|
+
const serviceCardStyle = (hasOfferText && isNewUiEnabled) || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
|
|
35
37
|
? {
|
|
36
38
|
borderColor: isSoldOut ? "#ccc" : "transparent",
|
|
37
39
|
borderStyle: "solid",
|
|
@@ -87,13 +89,17 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
87
89
|
if (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_transpordo) {
|
|
88
90
|
isConexion = true;
|
|
89
91
|
}
|
|
90
|
-
return (React.createElement(
|
|
92
|
+
return (React.createElement(React.Fragment, null, isNewUi ? (React.createElement(FeatureServiceUiMobile, { serviceItem: serviceItem, showTopLabel: showTopLabel, colors: colors, isSoldOut: isSoldOut, cityOrigin: cityOrigin, cityDestination: cityDestination, renderIcon: renderIcon, viewersConfig: viewersConfig, isFeatureDropDownExpand: isFeatureDropDownExpand, ticketQuantity: ticketQuantity, onIncreaseTicketQuantity: onIncreaseTicketQuantity, onDecreaseTicketQuantity: onDecreaseTicketQuantity, onBookButtonPress: onRemateUiButtonClick, onToggleExpand: () => setIsFeatureDropDownExpand &&
|
|
93
|
+
setIsFeatureDropDownExpand(isFeatureDropDownExpand === serviceItem.id ||
|
|
94
|
+
isFeatureDropDownExpand === true
|
|
95
|
+
? null
|
|
96
|
+
: serviceItem.id), selectedTimeSlot: selectedTimeSlot, onTimeSlotChange: onTimeSlotChange, isTimeDropdownOpen: isTimeDropdownOpen, onTimeDropdownToggle: onTimeDropdownToggle, wowDealData: wowDealData })) : (React.createElement("div", { className: `relative ${!serviceItem.offer_text || !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? "mb-[14px]" : showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "mb-[20px]" : "mb-[12px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
|
|
91
97
|
isConexion ||
|
|
92
98
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
|
|
93
99
|
showTopLabel
|
|
94
100
|
? "mt-[20px]"
|
|
95
101
|
: "mt-[10px]"} `, style: { zIndex: 1 } },
|
|
96
|
-
React.createElement("div", { className: `z-1 ${(hasOfferText || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) && !isSoldOut
|
|
102
|
+
React.createElement("div", { className: `z-1 ${((hasOfferText && isNewUiEnabled) || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) && !isSoldOut
|
|
97
103
|
? "rounded-[18px]"
|
|
98
104
|
: "rounded-[10px] border border-[#ccc]"}`, style: Object.assign(Object.assign({}, serviceCardStyle), { backgroundColor: "#fff" }) },
|
|
99
105
|
React.createElement("div", { style: { padding: "12px 12px 8px 12px" } },
|
|
@@ -101,29 +107,49 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
101
107
|
React.createElement("div", { className: "flex items-center justify-center gap-x-4", style: {
|
|
102
108
|
marginBottom: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDiscount ? "10px" : "",
|
|
103
109
|
} },
|
|
104
|
-
React.createElement("div", { className:
|
|
110
|
+
React.createElement("div", { className: `w-[115px] ${isFlores ? "" : "overflow-y-hidden"} h-[22px]` },
|
|
105
111
|
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `w-[100px] h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
|
|
106
112
|
isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[12px] text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[12px] h-[22px] items-center" },
|
|
107
113
|
React.createElement("div", { className: "flex items-center" },
|
|
108
114
|
React.createElement("div", { className: "flex items-center" },
|
|
109
115
|
React.createElement("img", { src: serviceItem.icons.rating, alt: "origin", className: `w-[12px] h-[12px] mr-[4px] object-contain ${isSoldOut ? "grayscale" : ""}` }),
|
|
110
116
|
React.createElement("span", { style: { lineHeight: "normal" } }, getServiceStars(serviceItem))),
|
|
111
|
-
React.createElement("div", { className: "flex items-center cursor-pointer ", style: {
|
|
117
|
+
React.createElement("div", { className: "flex items-center cursor-pointer ", style: {
|
|
118
|
+
color: isSoldOut ? "#bbb" : "text-[#464647]",
|
|
119
|
+
} },
|
|
112
120
|
React.createElement("span", { className: "ml-[3px] min-[420]:text-[13px] text-[12px] text-ellipsis overflow-hidden whitespace-nowrap max-w-[120px]" }, serviceItem.operator_details[2]))))) : null)),
|
|
113
|
-
React.createElement(DateTimeSectionMobile, { onBookButtonPress: onBookButtonPress, isCiva: isCiva, isSoldOut: isSoldOut, isLinatal: isLinatal, isPeru: isPeru, orignLabel: orignLabel, destinationLabel: destinationLabel, originIcon: (
|
|
121
|
+
React.createElement(DateTimeSectionMobile, { onBookButtonPress: onBookButtonPress, isCiva: isCiva, isSoldOut: isSoldOut, isLinatal: isLinatal, isPeru: isPeru, orignLabel: orignLabel, destinationLabel: destinationLabel, originIcon: (_e = serviceItem.icons) === null || _e === void 0 ? void 0 : _e.origin, destinationIcon: (_f = serviceItem.icons) === null || _f === void 0 ? void 0 : _f.destination, travelDate: serviceItem.travel_date, arrivalDate: serviceItem.arrival_date, depTime: serviceItem.dep_time, arrTime: serviceItem.arr_time, seatTypes: serviceItem.seat_types, seatPriceColor: colors.seatPriceColor, tooltipBgColor: colors.tooltipBgColor, currencySign: currencySign, availableSeats: serviceItem.available_seats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, showLastSeats: showLastSeats, discountSeatPriceColor: colors.discountSeatPriceColor }),
|
|
114
122
|
hasDiscount && (React.createElement("div", { className: "flex justify-end" }, isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)),
|
|
115
123
|
showLastSeats ? (React.createElement("div", { className: "flex justify-end " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
|
|
116
124
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[10px] text-center", style: {
|
|
117
125
|
color: colors.tooltipBgColor,
|
|
118
126
|
} }, "\u00A1\u00DAltimos Asientos!")))) : null,
|
|
119
127
|
React.createElement("div", { className: "bg-[#E6E6E6] mt-[10px] mb-[8px] h-[1px]" }),
|
|
120
|
-
React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (
|
|
128
|
+
React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (_g = serviceItem.duration) === null || _g === void 0 ? void 0 : _g.toString(), isDirectTrip: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip, directoColor: colors.directoColor, directoAnim: serviceItem.icons.directoAnim, isChangeTicket: serviceItem.is_change_ticket, isPetSeat: isPetSeat, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, flexibleAnim: serviceItem.icons.flexibleAnim, isTrackingEnabled: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled, locationAnim: serviceItem.icons.locationAnim, downArrowIcon: serviceItem.icons.downArrow, showDropdown: isItemExpanded, setShowDropdown: () => setIsExpanded(isItemExpanded ? null : serviceItem.id), onDropdownToggle: () => {
|
|
121
129
|
setIsExpanded(isItemExpanded ? null : serviceItem.id);
|
|
122
130
|
}, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })),
|
|
123
131
|
React.createElement(ServiceBadgesMobile, { showTopLabel: showTopLabel, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, serviceItem: serviceItem, isConexion: isConexion })),
|
|
124
|
-
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text)
|
|
132
|
+
(((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && !isNewUiEnabled)) &&
|
|
125
133
|
!isSoldOut && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
|
|
126
|
-
background:
|
|
134
|
+
background: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor,
|
|
135
|
+
borderRadius: "0 0 14px 14px",
|
|
136
|
+
zIndex: -1,
|
|
137
|
+
} },
|
|
138
|
+
React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
|
|
139
|
+
React.createElement("div", { className: "flex justify-between items-center" },
|
|
140
|
+
React.createElement("div", { className: `flex ${((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 10 ? "items-start" : "items-center"}` },
|
|
141
|
+
React.createElement("div", { className: isLongOfferText ? "mt-[2px]" : "" },
|
|
142
|
+
React.createElement(LottiePlayer, { animationData: serviceItem.icons.promoAnim, width: "14px", height: "14px" })),
|
|
143
|
+
React.createElement("div", { className: `ml-[4px] flex-1 outline-none ${isLongOfferText ? "mt-[2px]" : ""}`, style: {
|
|
144
|
+
color: "#fff",
|
|
145
|
+
lineHeight: 1.4,
|
|
146
|
+
} },
|
|
147
|
+
React.createElement("span", { className: "whitespace-nowrap min-[380px]:text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text))))))),
|
|
148
|
+
(((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && isNewUiEnabled) || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) &&
|
|
149
|
+
!isSoldOut && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
|
|
150
|
+
background: isSoldOut
|
|
151
|
+
? offerGradientWithOpacity
|
|
152
|
+
: offerGradient,
|
|
127
153
|
// opacity: isSoldOut ? 0.5 : 1,
|
|
128
154
|
borderRadius: "0 0 14px 14px",
|
|
129
155
|
zIndex: -1,
|
|
@@ -131,9 +157,9 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
131
157
|
React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
|
|
132
158
|
React.createElement("div", { className: "flex justify-between items-center" },
|
|
133
159
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
|
|
134
|
-
Object.keys((
|
|
135
|
-
0 &&
|
|
136
|
-
((
|
|
160
|
+
Object.keys((_h = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _h !== void 0 ? _h : {})
|
|
161
|
+
.length === 0 &&
|
|
162
|
+
((_j = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _j !== void 0 ? _j : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
|
|
137
163
|
React.createElement(LottiePlayer, { animationData: serviceItem.icons.starAnimation, width: "14px", height: "14px" }),
|
|
138
164
|
React.createElement("span", { className: "text-[#fff]" }, "M\u00E1s elegido"))) : (React.createElement("div", { className: `flex ${((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 10 ? "items-start" : "items-center"}` },
|
|
139
165
|
React.createElement("div", { className: isLongOfferText ? "mt-[2px]" : "" },
|
|
@@ -180,6 +206,6 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
180
206
|
zIndex: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? -3 : undefined,
|
|
181
207
|
marginTop: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "-15px" : "-10px",
|
|
182
208
|
} },
|
|
183
|
-
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, femaleAnim: serviceItem.icons.femaleAnim, flexibleAnim: serviceItem.icons.flexibleAnim, renderIcon: renderIcon
|
|
209
|
+
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, femaleAnim: serviceItem.icons.femaleAnim, flexibleAnim: serviceItem.icons.flexibleAnim, renderIcon: renderIcon })))))));
|
|
184
210
|
}
|
|
185
211
|
export default ServiceItemMobile;
|
|
@@ -43,6 +43,20 @@ export interface MobileServiceItemProps {
|
|
|
43
43
|
dp_discount_percents?: Record<string, number>;
|
|
44
44
|
dp_discounted_seats?: string[];
|
|
45
45
|
dep_validation_text?: string;
|
|
46
|
+
discount_type?: string;
|
|
47
|
+
discount_value?: number;
|
|
48
|
+
max_discount?: number;
|
|
49
|
+
discounts?: Array<{
|
|
50
|
+
id?: number;
|
|
51
|
+
name?: string;
|
|
52
|
+
send_discount_to_api?: boolean;
|
|
53
|
+
new_ui_enabled?: boolean;
|
|
54
|
+
discount?: number;
|
|
55
|
+
seatwise_breakdown?: any;
|
|
56
|
+
seat_wise_discounts?: any;
|
|
57
|
+
total_amount?: number;
|
|
58
|
+
promotional_text?: string;
|
|
59
|
+
}>;
|
|
46
60
|
metaData?: {};
|
|
47
61
|
is_tracking_enabled?: boolean;
|
|
48
62
|
show_top_label?: boolean;
|
|
@@ -124,6 +138,19 @@ export interface MobileServiceItemProps {
|
|
|
124
138
|
directoIcon?: string;
|
|
125
139
|
whiteFireIcon?: string;
|
|
126
140
|
femaleAnim?: string;
|
|
141
|
+
thunderAnim?: string;
|
|
142
|
+
personsAnim?: string;
|
|
143
|
+
whiteOrigin?: string;
|
|
144
|
+
whiteDestination?: string;
|
|
145
|
+
userIcon?: string;
|
|
146
|
+
sheildIcon?: string;
|
|
147
|
+
busIcon?: string;
|
|
148
|
+
whiteDownArrow?: string;
|
|
149
|
+
empressaIcon?: string;
|
|
150
|
+
flexibleIcon?: string;
|
|
151
|
+
listoIcon?: string;
|
|
152
|
+
precioIcon?: string;
|
|
153
|
+
confirmarIcon?: string;
|
|
127
154
|
cancelTicketIcon?: string;
|
|
128
155
|
changeTicketIcon?: string;
|
|
129
156
|
petFriendlyIcon?: string;
|
|
@@ -133,6 +160,7 @@ export interface MobileServiceItemProps {
|
|
|
133
160
|
useLottieFor?: string[];
|
|
134
161
|
};
|
|
135
162
|
onBookButtonPress?: () => void;
|
|
163
|
+
onRemateUiButtonClick?: () => void;
|
|
136
164
|
terminals?: any[];
|
|
137
165
|
showDropdown?: boolean;
|
|
138
166
|
setShowDropdown?: (value: boolean) => void;
|
|
@@ -187,5 +215,24 @@ export interface MobileServiceItemProps {
|
|
|
187
215
|
label?: string;
|
|
188
216
|
icon?: string;
|
|
189
217
|
};
|
|
190
|
-
|
|
218
|
+
isFeatureDropDownExpand?: any;
|
|
219
|
+
setIsFeatureDropDownExpand?: (value: any) => void;
|
|
220
|
+
ticketQuantity?: number;
|
|
221
|
+
onIncreaseTicketQuantity?: (serviceItem: MobileServiceItemProps["serviceItem"]) => void;
|
|
222
|
+
onDecreaseTicketQuantity?: (serviceItem: MobileServiceItemProps["serviceItem"]) => void;
|
|
223
|
+
cityOrigin?: {
|
|
224
|
+
value: number;
|
|
225
|
+
label: string;
|
|
226
|
+
};
|
|
227
|
+
cityDestination?: {
|
|
228
|
+
value: number;
|
|
229
|
+
label: string;
|
|
230
|
+
};
|
|
231
|
+
isNewUi?: boolean;
|
|
232
|
+
selectedTimeSlot?: string;
|
|
233
|
+
onTimeSlotChange?: (slot: string) => void;
|
|
234
|
+
isTimeDropdownOpen?: string | number | null;
|
|
235
|
+
onTimeDropdownToggle?: (id?: string | number | null) => void;
|
|
236
|
+
wowDealData?: any;
|
|
237
|
+
isFlores?: boolean;
|
|
191
238
|
}
|
|
@@ -45,6 +45,9 @@ export interface ServiceItemProps {
|
|
|
45
45
|
discount_type?: string;
|
|
46
46
|
discount_value?: number;
|
|
47
47
|
max_discount?: number;
|
|
48
|
+
discounts?: Array<{
|
|
49
|
+
new_ui_enabled?: boolean;
|
|
50
|
+
}>;
|
|
48
51
|
is_transpordo?: boolean;
|
|
49
52
|
is_train_type?: boolean;
|
|
50
53
|
operator_service_name?: string;
|
|
@@ -129,11 +132,23 @@ export interface ServiceItemProps {
|
|
|
129
132
|
personIcon?: string;
|
|
130
133
|
whiteFireIcon?: string;
|
|
131
134
|
fireIcon?: string;
|
|
135
|
+
whiteOrigin?: string;
|
|
136
|
+
whiteDestination?: string;
|
|
137
|
+
userIcon?: string;
|
|
138
|
+
sheildIcon?: string;
|
|
139
|
+
busIcon?: string;
|
|
140
|
+
whiteDownArrow?: string;
|
|
141
|
+
empressaIcon?: string;
|
|
142
|
+
flexibleIcon?: string;
|
|
143
|
+
listoIcon?: string;
|
|
144
|
+
precioIcon?: string;
|
|
145
|
+
confirmarIcon?: string;
|
|
132
146
|
[key: string]: string | Record<string, string | undefined> | undefined;
|
|
133
147
|
};
|
|
134
148
|
useLottieFor?: string[];
|
|
135
149
|
};
|
|
136
150
|
onBookButtonPress?: () => void;
|
|
151
|
+
onRemateUiButtonClick?: () => void;
|
|
137
152
|
terminals?: any[];
|
|
138
153
|
t?: (key: string) => string;
|
|
139
154
|
serviceDetailsLoading?: boolean;
|
|
@@ -213,6 +228,11 @@ export interface ServiceItemProps {
|
|
|
213
228
|
isAllinBus?: boolean;
|
|
214
229
|
isExpand?: any;
|
|
215
230
|
setIsExpand?: (value: any) => void;
|
|
231
|
+
isFeatureDropDownExpand?: any;
|
|
232
|
+
setIsFeatureDropDownExpand?: (value: any) => void;
|
|
233
|
+
ticketQuantity?: number;
|
|
234
|
+
onIncreaseTicketQuantity?: (serviceItem: ServiceItemProps["serviceItem"]) => void;
|
|
235
|
+
onDecreaseTicketQuantity?: (serviceItem: ServiceItemProps["serviceItem"]) => void;
|
|
216
236
|
coachKey?: number;
|
|
217
237
|
viewersConfig?: {
|
|
218
238
|
min: number;
|
|
@@ -221,16 +241,14 @@ export interface ServiceItemProps {
|
|
|
221
241
|
label?: string;
|
|
222
242
|
icon?: string;
|
|
223
243
|
};
|
|
244
|
+
isNewUi?: boolean;
|
|
224
245
|
showLoginModal?: any;
|
|
225
246
|
isLoggedIn?: any;
|
|
226
247
|
showLoginOption?: boolean;
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
onClearSeatSelectionError?: () => void;
|
|
234
|
-
isFlores?: boolean;
|
|
235
|
-
operatorLabel?: string;
|
|
248
|
+
selectedTimeSlot?: string;
|
|
249
|
+
onTimeSlotChange?: (slot: string) => void;
|
|
250
|
+
isTimeDropdownOpen?: string | number | null;
|
|
251
|
+
onTimeDropdownToggle?: (id?: string | number | null) => void;
|
|
252
|
+
wowDealData?: any;
|
|
253
|
+
isNewUiEnabled?: boolean;
|
|
236
254
|
}
|