kupos-ui-components-lib 10.3.1 → 10.3.3
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/components/PaymentSideBar/PaymentSideBarDesktop.js +1 -2
- package/dist/components/PaymentSideBar/PaymentSideBarMobile.js +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +2 -2
- package/dist/ui/BottomAmenities/BottomAmenities.d.ts +2 -1
- package/dist/ui/BottomAmenities/BottomAmenities.js +2 -2
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +2 -2
- package/dist/ui/RatingBlock.d.ts +1 -1
- package/dist/ui/RatingBlock.js +15 -10
- package/dist/ui/mobileweb/BottomAmenitiesMobile.js +1 -1
- package/dist/ui/mobileweb/ExpandedDropdownMobile.js +2 -2
- package/package.json +1 -1
- package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx +1 -2
- package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx +1 -1
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +2 -0
- package/src/ui/BottomAmenities/BottomAmenities.tsx +3 -1
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +2 -2
- package/src/ui/RatingBlock.tsx +43 -34
- package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +1 -1
- package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +2 -2
|
@@ -179,7 +179,6 @@ const renderSummaryDetailsCard = ({ serviceName, date, source, dest, boardingSta
|
|
|
179
179
|
};
|
|
180
180
|
const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData, currencySign, dateOnward, dateReturn, sourceOnward, sourceReturn, destinationOnward, destinationReturn, boardingStageOnward, boardingStageReturn, droppingStageOnward, droppingStageReturn, boardingTimeOnward, boardingTimeReturn, droppingTimeOnward, droppingTimeReturn, durationOnward, durationReturn, selectSeatOnward, selectSeatReturn, journeyTypeActive, setJourneyTypeActive, translation, trainTypeOnward, trainTypeReturn, colors, trainType, icons, selectedOnward, selectedReturn, conexionChecked, conexionPassengers, returnConexionFare, conexionFare, loginData, checkWhatsappEligibility, removeDiscountAtomValue, netFare, promoCode, onPromoRemove, isAgency, agencyFee, walletMoney, virtualMoney, virtualLimit, showUsd, netFareInUsd, renderDiscount, discountAmount, walletLabel, creditosLabel, currency, customSideBarwidth, isLinatal, insuranceData, isPeru, serviceFeeDataStateValue, isOpsite, }) => {
|
|
181
181
|
var _a, _b, _c, _d, _e;
|
|
182
|
-
console.log("🚀 ~ PaymentSideBarDesktop ~ walletMoney:", walletMoney);
|
|
183
182
|
// REMOVED AM/PM DUPLICATION AND ADDED 24 HOUR TIME FORMAT IN BOARDING STAGE
|
|
184
183
|
const depTime = droppingTimeOnward || "";
|
|
185
184
|
const returnTime = droppingTimeReturn || "";
|
|
@@ -446,7 +445,7 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
446
445
|
React.createElement("div", null, promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCode),
|
|
447
446
|
React.createElement("span", { className: "promo-remove", onClick: onPromoRemove },
|
|
448
447
|
React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.closeIcon, alt: "close", className: "w-[16px] h-[16px]" })))) : null)),
|
|
449
|
-
(serviceFeeDataStateValue === null || serviceFeeDataStateValue === void 0 ? void 0 : serviceFeeDataStateValue.total_convenience_fee_amount) && (React.createElement(PaymentItem, { label: React.createElement("div", { style: { display: "flex", alignItems: "center" } },
|
|
448
|
+
!!(serviceFeeDataStateValue === null || serviceFeeDataStateValue === void 0 ? void 0 : serviceFeeDataStateValue.total_convenience_fee_amount) && (React.createElement(PaymentItem, { label: React.createElement("div", { style: { display: "flex", alignItems: "center" } },
|
|
450
449
|
React.createElement("div", { className: "font10" }, translation === null || translation === void 0 ? void 0 : translation.serviceFeeLabel),
|
|
451
450
|
React.createElement("div", { className: "img-hover" },
|
|
452
451
|
React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.whatsappInfoIcon, alt: "", style: {
|
|
@@ -231,7 +231,7 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
231
231
|
React.createElement("div", null, promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCode),
|
|
232
232
|
React.createElement("span", { className: "promo-remove", onClick: onPromoRemove },
|
|
233
233
|
React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.closeIcon, alt: "close", className: "w-[16px] h-[16px]" })))) : null)),
|
|
234
|
-
(serviceFeeDataStateValue === null || serviceFeeDataStateValue === void 0 ? void 0 : serviceFeeDataStateValue.total_convenience_fee_amount) && (React.createElement(PaymentItem, { label: React.createElement("div", { style: { display: "flex", alignItems: "center" } },
|
|
234
|
+
!!(serviceFeeDataStateValue === null || serviceFeeDataStateValue === void 0 ? void 0 : serviceFeeDataStateValue.total_convenience_fee_amount) && (React.createElement(PaymentItem, { label: React.createElement("div", { style: { display: "flex", alignItems: "center" } },
|
|
235
235
|
React.createElement("div", { className: " font14 flex items-center gap-[5px]" }, translation === null || translation === void 0 ? void 0 : translation.serviceFeeLabel),
|
|
236
236
|
React.createElement("div", { className: "img-hover", onClick: () => setShowServicefeeModal(true) },
|
|
237
237
|
React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.whatsappInfoIcon, alt: "", style: {
|
|
@@ -319,7 +319,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
319
319
|
React.createElement("div", null,
|
|
320
320
|
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `h-[30px] w-[auto] ${isSoldOut ? "grayscale" : ""}` }),
|
|
321
321
|
isCiva ? (React.createElement("div", { className: "text-[13.33px] black-text ml-2" }, serviceItem.operator_details[2])) : null),
|
|
322
|
-
React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru })),
|
|
322
|
+
React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru, isTrain: isTrain })),
|
|
323
323
|
React.createElement(DateTimeSection, { serviceItem: serviceItem, isSoldOut: isSoldOut, isCiva: isCiva, isLinatal: isLinatal, removeArrivalTime: removeArrivalTime, orignLabel: orignLabel, destinationLabel: destinationLabel, busStage: busStage, metaData: metaData, colors: colors }),
|
|
324
324
|
React.createElement("div", { style: {
|
|
325
325
|
width: "1px",
|
|
@@ -339,7 +339,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
339
339
|
color: colors.seatPriceColor,
|
|
340
340
|
} }, "\u00A1\u00DAltimos Asientos!")))) : null)),
|
|
341
341
|
React.createElement(BottomAmenities, { otherItems: otherItems, serviceItem: serviceItem, grayscaleClass: grayscaleClass, isSoldOut: isSoldOut, isItemExpanded: isItemExpanded, colors: colors, translation: translation, getAnimationIcon: getAnimationIcon, downArrowIcon: renderIcon("downArrow", "10px"), onToggleExpand: () => setIsExpand &&
|
|
342
|
-
setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain }))),
|
|
342
|
+
setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain, isDpEnabled: serviceItem.is_dp_enabled }))),
|
|
343
343
|
isPeru ? null : (React.createElement("div", { style: {
|
|
344
344
|
display: "grid",
|
|
345
345
|
gridTemplateRows: isItemExpanded ? "1fr" : "0fr",
|
|
@@ -25,6 +25,7 @@ interface BottomAmenitiesProps {
|
|
|
25
25
|
onToggleExpand: () => void;
|
|
26
26
|
isPeru?: boolean;
|
|
27
27
|
isTrain?: boolean;
|
|
28
|
+
isDpEnabled?: boolean;
|
|
28
29
|
}
|
|
29
|
-
declare function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, }: BottomAmenitiesProps): React.ReactElement;
|
|
30
|
+
declare function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, isDpEnabled, }: BottomAmenitiesProps): React.ReactElement;
|
|
30
31
|
export default BottomAmenities;
|
|
@@ -3,7 +3,7 @@ import LottiePlayer from "../../assets/LottiePlayer";
|
|
|
3
3
|
import FlexibleBlock from "../FlexibleBlock";
|
|
4
4
|
import PetBlock from "../PetBlock";
|
|
5
5
|
import FemaleBlock from "../FemaleBlock";
|
|
6
|
-
function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, }) {
|
|
6
|
+
function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, isDpEnabled, }) {
|
|
7
7
|
const hasPetInfo = serviceItem.pet_seat_info &&
|
|
8
8
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
9
9
|
const showDownArrow = ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_change_ticket) && serviceItem.pet_seat_info) ||
|
|
@@ -19,7 +19,7 @@ function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, i
|
|
|
19
19
|
React.createElement("div", { className: "flex items-center justify-end shrink-0 ml-[5px] w-[150px]" },
|
|
20
20
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled) && (React.createElement("div", { className: grayscaleClass + " mr-[10px]" },
|
|
21
21
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("locationAnim"), width: "20px", height: "20px" }))),
|
|
22
|
-
serviceItem.is_change_ticket && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
22
|
+
serviceItem.is_change_ticket && !isDpEnabled && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
23
23
|
serviceItem.ladies_booked_seats &&
|
|
24
24
|
String(serviceItem.ladies_booked_seats).trim() !== "" &&
|
|
25
25
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true && (React.createElement(FemaleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
@@ -7,7 +7,7 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
|
|
|
7
7
|
borderRadius: "0 0 10px 10px",
|
|
8
8
|
} },
|
|
9
9
|
React.createElement("div", { className: "flex flex-col gap-[6px] text-[13px] text-[#464647]", style: { lineHeight: 1.5, opacity: isSoldOut ? 0.5 : 1 } },
|
|
10
|
-
isPeru ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
|
|
10
|
+
isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
|
|
11
11
|
React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
|
|
12
12
|
React.createElement("span", null,
|
|
13
13
|
React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
|
|
@@ -41,7 +41,7 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
|
|
|
41
41
|
React.createElement("span", null, renderIcon("cancelTicketIcon", "16px")),
|
|
42
42
|
React.createElement("span", null,
|
|
43
43
|
React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n: "),
|
|
44
|
-
isDpEnabled ? (React.createElement("span", null, "Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
44
|
+
isDpEnabled ? (React.createElement("span", null, "Tu pasaje no podr\u00E1 ser anulado o cambiado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
45
45
|
" ",
|
|
46
46
|
"Tu pasaje puede ser anulado de forma online",
|
|
47
47
|
" ",
|
package/dist/ui/RatingBlock.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
declare const RatingBlock: ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru, }: any) => React.JSX.Element;
|
|
2
|
+
declare const RatingBlock: ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru, isTrain, }: any) => React.JSX.Element;
|
|
3
3
|
export default RatingBlock;
|
package/dist/ui/RatingBlock.js
CHANGED
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import RatingHover from "../components/ServiceItem/RatingHover";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
React.createElement("div", { className: "
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
React.createElement("
|
|
12
|
-
|
|
3
|
+
import commonService from "../utils/CommonService";
|
|
4
|
+
const RatingBlock = ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru = false, isTrain = false, }) => {
|
|
5
|
+
return (React.createElement("div", { className: "flex items-center whitespace-nowrap" },
|
|
6
|
+
showRating && (React.createElement(RatingHover, { serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru })),
|
|
7
|
+
React.createElement("div", { className: "group relative ml-[10px] text-[12px]", style: {
|
|
8
|
+
marginLeft: showRating ? "6px" : "0",
|
|
9
|
+
color: isSoldOut ? "#c0c0c0" : "#464647",
|
|
10
|
+
} },
|
|
11
|
+
React.createElement("span", { className: `block max-w-[120px] cursor-pointer text-[12px] ${isPeru || isTrain ? "overflow-hidden text-ellipsis whitespace-nowrap" : ""}` }, isTrain
|
|
12
|
+
? commonService.truncateSeatLabel(serviceItem.operator_details[2], 14)
|
|
13
|
+
: commonService.capitalize(serviceItem.operator_details[2])),
|
|
14
|
+
React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-nowrap z-10 mt-2.5 w-max text-center shadow-service text-[12px]", style: { backgroundColor: colors.bottomStripColor, zIndex: "300" } },
|
|
15
|
+
React.createElement("div", { className: "tooltip-arrow absolute -top-[7px] left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-l-transparent border-r-transparent ", style: { borderBottomColor: colors.bottomStripColor } }),
|
|
16
|
+
serviceItem.operator_details[2]))));
|
|
17
|
+
};
|
|
13
18
|
export default RatingBlock;
|
|
@@ -18,7 +18,7 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
|
|
|
18
18
|
React.createElement("div", { className: "flex items-center" },
|
|
19
19
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
20
20
|
React.createElement(LottiePlayer, { animationData: petFriendlyAnim, width: "16px", height: "16px" })))))) : null,
|
|
21
|
-
isChangeTicket && (React.createElement("div", { className: "flex items-center" },
|
|
21
|
+
isChangeTicket && !isDpEnabled && (React.createElement("div", { className: "flex items-center" },
|
|
22
22
|
React.createElement("div", { className: "relative group cursor-default" },
|
|
23
23
|
React.createElement("div", { className: "flex items-center" },
|
|
24
24
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
@@ -6,7 +6,7 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
|
|
|
6
6
|
opacity: isSoldOut ? 0.5 : 1,
|
|
7
7
|
} },
|
|
8
8
|
React.createElement("div", { className: "flex flex-col gap-[8px] text-[11px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
|
|
9
|
-
isPeru ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
|
|
9
|
+
isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
|
|
10
10
|
React.createElement("span", { className: "mt-[3px]" }, renderIcon("changeTicketIcon", "14px")),
|
|
11
11
|
React.createElement("span", null,
|
|
12
12
|
React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
|
|
@@ -50,7 +50,7 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
|
|
|
50
50
|
React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n: "),
|
|
51
51
|
isDpEnabled ? (React.createElement("span", null,
|
|
52
52
|
" ",
|
|
53
|
-
"Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
53
|
+
"Tu pasaje no podr\u00E1 ser anulado o cambiado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
54
54
|
"Tu pasaje puede ser anulado de forma online",
|
|
55
55
|
" ",
|
|
56
56
|
React.createElement("span", { className: "bold-text" }, " hasta 4 horas antes"),
|
package/package.json
CHANGED
|
@@ -339,7 +339,6 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
|
|
|
339
339
|
serviceFeeDataStateValue,
|
|
340
340
|
isOpsite,
|
|
341
341
|
}) => {
|
|
342
|
-
console.log("🚀 ~ PaymentSideBarDesktop ~ walletMoney:", walletMoney);
|
|
343
342
|
// REMOVED AM/PM DUPLICATION AND ADDED 24 HOUR TIME FORMAT IN BOARDING STAGE
|
|
344
343
|
const depTime = droppingTimeOnward || "";
|
|
345
344
|
const returnTime = droppingTimeReturn || "";
|
|
@@ -813,7 +812,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
|
|
|
813
812
|
</>
|
|
814
813
|
)}
|
|
815
814
|
|
|
816
|
-
{serviceFeeDataStateValue?.total_convenience_fee_amount && (
|
|
815
|
+
{!!serviceFeeDataStateValue?.total_convenience_fee_amount && (
|
|
817
816
|
<PaymentItem
|
|
818
817
|
label={
|
|
819
818
|
<div style={{ display: "flex", alignItems: "center" }}>
|
|
@@ -588,7 +588,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
|
|
|
588
588
|
</>
|
|
589
589
|
)}
|
|
590
590
|
|
|
591
|
-
{serviceFeeDataStateValue?.total_convenience_fee_amount && (
|
|
591
|
+
{!!serviceFeeDataStateValue?.total_convenience_fee_amount && (
|
|
592
592
|
<PaymentItem
|
|
593
593
|
label={
|
|
594
594
|
<div style={{ display: "flex", alignItems: "center" }}>
|
|
@@ -619,6 +619,7 @@ function ServiceItemPB({
|
|
|
619
619
|
t={t}
|
|
620
620
|
translation={translation}
|
|
621
621
|
isPeru={isPeru}
|
|
622
|
+
isTrain={isTrain}
|
|
622
623
|
/>
|
|
623
624
|
</div>
|
|
624
625
|
|
|
@@ -722,6 +723,7 @@ function ServiceItemPB({
|
|
|
722
723
|
}
|
|
723
724
|
isPeru={isPeru}
|
|
724
725
|
isTrain={isTrain}
|
|
726
|
+
isDpEnabled={serviceItem.is_dp_enabled}
|
|
725
727
|
/>
|
|
726
728
|
</div>
|
|
727
729
|
</div>
|
|
@@ -29,6 +29,7 @@ interface BottomAmenitiesProps {
|
|
|
29
29
|
onToggleExpand: () => void;
|
|
30
30
|
isPeru?: boolean;
|
|
31
31
|
isTrain?: boolean;
|
|
32
|
+
isDpEnabled?: boolean;
|
|
32
33
|
}
|
|
33
34
|
|
|
34
35
|
function BottomAmenities({
|
|
@@ -44,6 +45,7 @@ function BottomAmenities({
|
|
|
44
45
|
onToggleExpand,
|
|
45
46
|
isPeru,
|
|
46
47
|
isTrain,
|
|
48
|
+
isDpEnabled,
|
|
47
49
|
}: BottomAmenitiesProps): React.ReactElement {
|
|
48
50
|
const hasPetInfo =
|
|
49
51
|
serviceItem.pet_seat_info &&
|
|
@@ -84,7 +86,7 @@ function BottomAmenities({
|
|
|
84
86
|
/>
|
|
85
87
|
</div>
|
|
86
88
|
)}
|
|
87
|
-
{serviceItem.is_change_ticket && (
|
|
89
|
+
{serviceItem.is_change_ticket && !isDpEnabled && (
|
|
88
90
|
<FlexibleBlock
|
|
89
91
|
translation={translation}
|
|
90
92
|
getAnimationIcon={getAnimationIcon}
|
|
@@ -47,7 +47,7 @@ function ExpandedDropdown({
|
|
|
47
47
|
className="flex flex-col gap-[6px] text-[13px] text-[#464647]"
|
|
48
48
|
style={{ lineHeight: 1.5, opacity: isSoldOut ? 0.5 : 1 }}
|
|
49
49
|
>
|
|
50
|
-
{isPeru ? null : isChangeTicket ? (
|
|
50
|
+
{isPeru || isDpEnabled ? null : isChangeTicket ? (
|
|
51
51
|
<div className="flex gap-[8px]" style={{ lineHeight: 1.5 }}>
|
|
52
52
|
<span>{renderIcon("changeTicketIcon", "16px")}</span>
|
|
53
53
|
{/* <span style={{ marginTop: "2px" }}>
|
|
@@ -110,7 +110,7 @@ function ExpandedDropdown({
|
|
|
110
110
|
<span className="bold-text">Políticas de anulación: </span>
|
|
111
111
|
{isDpEnabled ? (
|
|
112
112
|
<span>
|
|
113
|
-
Tu pasaje no podrá ser anulado por tener una tarifa
|
|
113
|
+
Tu pasaje no podrá ser anulado o cambiado por tener una tarifa
|
|
114
114
|
preferencial.
|
|
115
115
|
</span>
|
|
116
116
|
) : (
|
package/src/ui/RatingBlock.tsx
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import RatingHover from "../components/ServiceItem/RatingHover";
|
|
3
|
+
import commonService from "../utils/CommonService";
|
|
3
4
|
|
|
4
5
|
const RatingBlock = ({
|
|
5
6
|
showRating,
|
|
@@ -9,46 +10,54 @@ const RatingBlock = ({
|
|
|
9
10
|
t,
|
|
10
11
|
translation,
|
|
11
12
|
isPeru = false,
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
// style={{ opacity: isSoldOut ? 0.5 : 1 }}
|
|
16
|
-
>
|
|
17
|
-
{showRating && (
|
|
18
|
-
<RatingHover
|
|
19
|
-
serviceItem={serviceItem}
|
|
20
|
-
isSoldOut={isSoldOut}
|
|
21
|
-
colors={colors}
|
|
22
|
-
t={t}
|
|
23
|
-
translation={translation}
|
|
24
|
-
isPeru={isPeru}
|
|
25
|
-
/>
|
|
26
|
-
)}
|
|
27
|
-
|
|
13
|
+
isTrain = false,
|
|
14
|
+
}: any) => {
|
|
15
|
+
return (
|
|
28
16
|
<div
|
|
29
|
-
className="
|
|
30
|
-
style={{
|
|
31
|
-
marginLeft: showRating ? "6px" : "0",
|
|
32
|
-
color: isSoldOut ? "#c0c0c0" : "#464647",
|
|
33
|
-
}}
|
|
17
|
+
className="flex items-center whitespace-nowrap"
|
|
18
|
+
// style={{ opacity: isSoldOut ? 0.5 : 1 }}
|
|
34
19
|
>
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
20
|
+
{showRating && (
|
|
21
|
+
<RatingHover
|
|
22
|
+
serviceItem={serviceItem}
|
|
23
|
+
isSoldOut={isSoldOut}
|
|
24
|
+
colors={colors}
|
|
25
|
+
t={t}
|
|
26
|
+
translation={translation}
|
|
27
|
+
isPeru={isPeru}
|
|
28
|
+
/>
|
|
29
|
+
)}
|
|
30
|
+
|
|
40
31
|
<div
|
|
41
|
-
className="
|
|
42
|
-
style={{
|
|
32
|
+
className="group relative ml-[10px] text-[12px]"
|
|
33
|
+
style={{
|
|
34
|
+
marginLeft: showRating ? "6px" : "0",
|
|
35
|
+
color: isSoldOut ? "#c0c0c0" : "#464647",
|
|
36
|
+
}}
|
|
43
37
|
>
|
|
38
|
+
<span
|
|
39
|
+
className={`block max-w-[120px] cursor-pointer text-[12px] ${isPeru || isTrain ? "overflow-hidden text-ellipsis whitespace-nowrap" : ""}`}
|
|
40
|
+
>
|
|
41
|
+
{isTrain
|
|
42
|
+
? commonService.truncateSeatLabel(
|
|
43
|
+
serviceItem.operator_details[2],
|
|
44
|
+
14,
|
|
45
|
+
)
|
|
46
|
+
: commonService.capitalize(serviceItem.operator_details[2])}
|
|
47
|
+
</span>
|
|
44
48
|
<div
|
|
45
|
-
className="
|
|
46
|
-
style={{
|
|
47
|
-
|
|
48
|
-
|
|
49
|
+
className="hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-nowrap z-10 mt-2.5 w-max text-center shadow-service text-[12px]"
|
|
50
|
+
style={{ backgroundColor: colors.bottomStripColor, zIndex: "300" }}
|
|
51
|
+
>
|
|
52
|
+
<div
|
|
53
|
+
className="tooltip-arrow absolute -top-[7px] left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-l-transparent border-r-transparent "
|
|
54
|
+
style={{ borderBottomColor: colors.bottomStripColor }}
|
|
55
|
+
></div>
|
|
56
|
+
{serviceItem.operator_details[2]}
|
|
57
|
+
</div>
|
|
49
58
|
</div>
|
|
50
59
|
</div>
|
|
51
|
-
|
|
52
|
-
|
|
60
|
+
);
|
|
61
|
+
};
|
|
53
62
|
|
|
54
63
|
export default RatingBlock;
|
|
@@ -123,7 +123,7 @@ function BottomAmenitiesMobile({
|
|
|
123
123
|
) : null}
|
|
124
124
|
|
|
125
125
|
{/* Flexible ticket */}
|
|
126
|
-
{isChangeTicket && (
|
|
126
|
+
{isChangeTicket && !isDpEnabled && (
|
|
127
127
|
<div className="flex items-center">
|
|
128
128
|
<div className="relative group cursor-default">
|
|
129
129
|
<div className="flex items-center">
|
|
@@ -48,7 +48,7 @@ function ExpandedDropdownMobile({
|
|
|
48
48
|
className="flex flex-col gap-[8px] text-[11px] min-[420px]:text-[12px] text-[#464647]"
|
|
49
49
|
style={{ lineHeight: 1.6 }}
|
|
50
50
|
>
|
|
51
|
-
{isPeru ? null : isChangeTicket ? (
|
|
51
|
+
{isPeru || isDpEnabled ? null : isChangeTicket ? (
|
|
52
52
|
<div className="flex gap-[6px]">
|
|
53
53
|
<span className="mt-[3px]">
|
|
54
54
|
{renderIcon("changeTicketIcon", "14px")}
|
|
@@ -126,7 +126,7 @@ function ExpandedDropdownMobile({
|
|
|
126
126
|
{isDpEnabled ? (
|
|
127
127
|
<span>
|
|
128
128
|
{" "}
|
|
129
|
-
Tu pasaje no podrá ser anulado por tener una tarifa
|
|
129
|
+
Tu pasaje no podrá ser anulado o cambiado por tener una tarifa
|
|
130
130
|
preferencial.
|
|
131
131
|
</span>
|
|
132
132
|
) : (
|