kupos-ui-components-lib 1.1.9 → 2.0.0

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.
Files changed (24) hide show
  1. package/dist/components/FilterBar/FilterBarDesktop.js +24 -127
  2. package/dist/components/FilterBar/FilterBarMobile.js +3 -6
  3. package/dist/components/FilterBar/ServiceFilter.d.ts +1 -0
  4. package/dist/components/FilterBar/ServiceFilter.js +39 -14
  5. package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js +19 -12
  6. package/dist/components/PaymentSideBar/PaymentSideBarMobile.js +4 -4
  7. package/dist/components/PaymentSideBar/types.d.ts +5 -0
  8. package/dist/components/ServiceItem/ServiceItemDesktop.js +3 -1
  9. package/dist/components/ServiceItem/ServiceItemMobile.js +1 -1
  10. package/dist/components/ServiceItem/mobileTypes.d.ts +1 -0
  11. package/dist/components/ServiceItem/types.d.ts +1 -0
  12. package/dist/styles.css +7 -4
  13. package/package.json +1 -1
  14. package/src/components/FilterBar/FilterBarDesktop.tsx +33 -141
  15. package/src/components/FilterBar/FilterBarMobile.tsx +3 -8
  16. package/src/components/FilterBar/ServiceFilter.tsx +57 -22
  17. package/src/components/FilterBar/tyoes.ts +1 -0
  18. package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx +20 -6
  19. package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx +4 -2
  20. package/src/components/PaymentSideBar/types.ts +7 -0
  21. package/src/components/ServiceItem/ServiceItemDesktop.tsx +3 -1
  22. package/src/components/ServiceItem/ServiceItemMobile.tsx +1 -1
  23. package/src/components/ServiceItem/mobileTypes.ts +2 -0
  24. package/src/components/ServiceItem/types.ts +2 -0
package/dist/components/FilterBar/FilterBarDesktop.js CHANGED
@@ -3,6 +3,7 @@ import commonService from "../../utils/CommonService";
3
3
  import ServiceFilter from "./ServiceFilter";
4
4
  const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showReturnTripModal, filterArrData, isBlankTicket, operatorId, filtersArray, setFiltersArray, metaData, busTerminals, setTypes, colors, icons, translation, isTrain, isPeru, }) => {
5
5
  const filterBy = (filters) => {
6
+ console.log("🚀 ~ filterBy ~ filters:", filters);
6
7
  try {
7
8
  let routes = allSchedules;
8
9
  let filteredRoutes = commonService.copyObject(routes);
@@ -372,180 +373,76 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
372
373
  let activeOptions = fil.options.filter((it) => it.active);
373
374
  // if (activeOptions && activeOptions.length > 0) {
374
375
  filteredRoutes = filteredRoutes.filter((it) => {
375
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
376
376
  if (activeOptions && activeOptions.length)
377
377
  for (let f of activeOptions) {
378
- console.log("ffffffffffff", f.value.toLowerCase());
379
378
  if (f.active) {
380
- if (f.value.toLowerCase().indexOf("salon cama low") > -1) {
381
- for (let bt of it.seat_types) {
382
- if (((_a = bt === null || bt === void 0 ? void 0 : bt.label) === null || _a === void 0 ? void 0 : _a.toLowerCase().indexOf("salon cama low")) >
383
- -1) {
384
- return true;
385
- }
386
- }
387
- }
388
- else if (f.value.toLowerCase().indexOf("salón cama low") > -1) {
389
- for (let bt of it.seat_types) {
390
- if (((_b = bt === null || bt === void 0 ? void 0 : bt.label) === null || _b === void 0 ? void 0 : _b.toLowerCase().indexOf("salón cama low")) >
391
- -1) {
392
- return true;
393
- }
394
- }
395
- }
396
- else if (f.value.toLowerCase().indexOf("semi cama low") > -1) {
397
- for (let bt of it.seat_types) {
398
- if (((_c = bt === null || bt === void 0 ? void 0 : bt.label) === null || _c === void 0 ? void 0 : _c.toLowerCase().indexOf("semi cama low")) > -1) {
399
- return true;
400
- }
401
- }
402
- }
403
- else if (f.value.toLowerCase().indexOf("cama premium (i)") > -1) {
404
- for (let bt of it.seat_types) {
405
- if (((_d = bt === null || bt === void 0 ? void 0 : bt.label) === null || _d === void 0 ? void 0 : _d.toLowerCase().indexOf("cama premium (i)")) >
406
- -1) {
407
- return true;
408
- }
409
- }
410
- }
411
- else if (f.value.toLowerCase().indexOf("ejecutivo") > -1) {
412
- // for (let bt of it.fare_str.split(",")) {
413
- // if (
414
- // bt.toLowerCase().split(":")[0].indexOf("ejecutivo") > -1
415
- // ) {
416
- // return true;
417
- // }
418
- // }
419
- for (let bt of it.seat_types) {
420
- if (((_e = bt === null || bt === void 0 ? void 0 : bt.label) === null || _e === void 0 ? void 0 : _e.toLowerCase().indexOf("ejecutivo")) > -1) {
421
- return true;
422
- }
423
- }
424
- }
425
- else if (f.value.toLowerCase().indexOf("semi") > -1) {
426
- // for (let bt of it.fare_str.split(",")) {
427
- // if (bt.toLowerCase().split(":")[0].indexOf("semi") > -1) {
428
- // return true;
429
- // }
430
- // }
431
- for (let bt of it.seat_types) {
432
- if (((_f = bt === null || bt === void 0 ? void 0 : bt.label) === null || _f === void 0 ? void 0 : _f.toLowerCase().indexOf("semi")) > -1) {
379
+ if (f.value.toLowerCase().indexOf("semi") > -1) {
380
+ for (let bt of it.fare_str.split(",")) {
381
+ if (bt.toLowerCase().split(":")[0].indexOf("semi") > -1) {
433
382
  return true;
434
383
  }
435
384
  }
436
385
  }
437
386
  else if (f.value.toLowerCase().indexOf("salon") > -1) {
438
- // for (let bt of it.fare_str.split(",")) {
439
- // if (
440
- // bt.toLowerCase().split(":")[0].indexOf("salon") > -1
441
- // ) {
442
- // return true;
443
- // }
444
- // }
445
- for (let bt of it.seat_types) {
446
- if (((_g = bt === null || bt === void 0 ? void 0 : bt.label) === null || _g === void 0 ? void 0 : _g.toLowerCase().indexOf("salon")) > -1) {
387
+ for (let bt of it.fare_str.split(",")) {
388
+ if (bt.toLowerCase().split(":")[0].indexOf("salon") > -1) {
447
389
  return true;
448
390
  }
449
391
  }
450
392
  }
451
- else if (f.value.toLowerCase().indexOf("salón") > -1) {
452
- // for (let bt of it.fare_str.split(",")) {
453
- // if (
454
- // bt.toLowerCase().split(":")[0].indexOf("salon") > -1
455
- // ) {
456
- // return true;
457
- // }
458
- // }
459
- for (let bt of it.seat_types) {
460
- if (((_h = bt === null || bt === void 0 ? void 0 : bt.label) === null || _h === void 0 ? void 0 : _h.toLowerCase().indexOf("salón")) > -1) {
393
+ else if (f.value.toLowerCase().indexOf("ejecutivo") > -1) {
394
+ for (let bt of it.fare_str.split(",")) {
395
+ if (bt.toLowerCase().split(":")[0].indexOf("ejecutivo") >
396
+ -1) {
461
397
  return true;
462
398
  }
463
399
  }
464
400
  }
465
401
  else if (f.value.toLowerCase().indexOf("suite") > -1) {
466
- // for (let bt of it.fare_str.split(",")) {
467
- // if (
468
- // bt.toLowerCase().split(":")[0].indexOf("suite") > -1
469
- // ) {
470
- // return true;
471
- // }
472
- // }
473
- for (let bt of it.seat_types) {
474
- if (((_j = bt === null || bt === void 0 ? void 0 : bt.label) === null || _j === void 0 ? void 0 : _j.toLowerCase().indexOf("suite")) > -1) {
402
+ for (let bt of it.fare_str.split(",")) {
403
+ if (bt.toLowerCase().split(":")[0].indexOf("suite") > -1) {
475
404
  return true;
476
405
  }
477
406
  }
478
407
  }
479
408
  else if (f.value.toLowerCase().indexOf("premium") > -1) {
480
- // for (let bt of it.fare_str.split(",")) {
481
- // if (bt.toLowerCase().split(":")[0].indexOf("premium") > -1) {
482
- // return true;
483
- // }
484
- // }
485
- for (let bt of it.seat_types) {
486
- if (((_k = bt === null || bt === void 0 ? void 0 : bt.label) === null || _k === void 0 ? void 0 : _k.toLowerCase().indexOf("premium")) > -1) {
409
+ for (let bt of it.fare_str.split(",")) {
410
+ if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
487
411
  return true;
488
412
  }
489
413
  }
490
414
  }
491
415
  else if (f.value.toLowerCase().indexOf("vip") > -1) {
492
- // for (let bt of it.fare_str.split(",")) {
493
- // if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
494
- // return true;
495
- // }
496
- // }
497
- for (let bt of it.seat_types) {
498
- if (((_l = bt === null || bt === void 0 ? void 0 : bt.label) === null || _l === void 0 ? void 0 : _l.toLowerCase().indexOf("vip")) > -1) {
416
+ for (let bt of it.fare_str.split(",")) {
417
+ if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
499
418
  return true;
500
419
  }
501
420
  }
502
421
  }
503
422
  else if (f.value.toLowerCase() == "cama") {
504
- // for (let bt of it.fare_str.split(",")) {
505
- // if (bt.toLowerCase().split(":")[0] == "cama") {
506
- // return true;
507
- // }
508
- // }
509
- for (let bt of it.seat_types) {
510
- if (((_m = bt === null || bt === void 0 ? void 0 : bt.label) === null || _m === void 0 ? void 0 : _m.toLowerCase().indexOf("cama")) > -1) {
423
+ for (let bt of it.fare_str.split(",")) {
424
+ if (bt.toLowerCase().split(":")[0] == "cama") {
511
425
  return true;
512
426
  }
513
427
  }
514
428
  }
515
429
  else if (f.value.toLowerCase() == "preferente") {
516
- // for (let bt of it.fare_str.split(",")) {
517
- // if (bt.toLowerCase().split(":")[0] == "preferente") {
518
- // return true;
519
- // }
520
- // }
521
- for (let bt of it.seat_types) {
522
- if (((_o = bt === null || bt === void 0 ? void 0 : bt.label) === null || _o === void 0 ? void 0 : _o.toLowerCase().indexOf("preferente")) > -1) {
430
+ for (let bt of it.fare_str.split(",")) {
431
+ if (bt.toLowerCase().split(":")[0] == "preferente") {
523
432
  return true;
524
433
  }
525
434
  }
526
435
  }
527
436
  else if (f.value.toLowerCase().indexOf("vent") > -1) {
528
- // for (let bt of it.fare_str.split(",")) {
529
- // if (bt.toLowerCase().split(":")[0].indexOf("vent") > -1) {
530
- // return true;
531
- // }
532
- // }
533
- for (let bt of it.seat_types) {
534
- if (((_p = bt === null || bt === void 0 ? void 0 : bt.label) === null || _p === void 0 ? void 0 : _p.toLowerCase().indexOf("vent")) > -1) {
437
+ for (let bt of it.fare_str.split(",")) {
438
+ if (bt.toLowerCase().split(":")[0].indexOf("vent") > -1) {
535
439
  return true;
536
440
  }
537
441
  }
538
442
  }
539
443
  else if (f.value.toLowerCase().indexOf("clasico") > -1) {
540
- // for (let bt of it.fare_str.split(",")) {
541
- // if (
542
- // bt.toLowerCase().split(":")[0].indexOf("clasico") > -1
543
- // ) {
544
- // return true;
545
- // }
546
- // }
547
- for (let bt of it.seat_types) {
548
- if (((_q = bt === null || bt === void 0 ? void 0 : bt.label) === null || _q === void 0 ? void 0 : _q.toLowerCase().indexOf("clasico")) > -1) {
444
+ for (let bt of it.fare_str.split(",")) {
445
+ if (bt.toLowerCase().split(":")[0].indexOf("clasico") > -1) {
549
446
  return true;
550
447
  }
551
448
  }
package/dist/components/FilterBar/FilterBarMobile.js CHANGED
@@ -361,14 +361,13 @@ const FilterBarMobile = ({ tripStep, isOpen, setIsOpen, icons, busTerminals, myF
361
361
  } },
362
362
  React.createElement("div", { className: " h-full bg-white flex-col flex justify-between p-5" },
363
363
  React.createElement("div", null,
364
- React.createElement("div", { className: "flex items-center mb-4" },
364
+ React.createElement("div", { className: "flex items-center mb-[16px]" },
365
365
  React.createElement("img", { src: icons.crossIcon, alt: "cross", onClick: () => setIsOpen(false), className: "cursor-pointer w-[14px] h-[14px]" }),
366
366
  React.createElement("span", { className: "text-[14px] bold-text ml-[50px]" },
367
367
  " ",
368
368
  "Filtrar por")),
369
369
  Object.keys(myFilters)
370
370
  .sort((a, b) => {
371
- // sort to show service type first then special departure and then seat type
372
371
  if (a === "service_type")
373
372
  return -1;
374
373
  if (b === "service_type")
@@ -385,15 +384,13 @@ const FilterBarMobile = ({ tripStep, isOpen, setIsOpen, icons, busTerminals, myF
385
384
  })
386
385
  .map((key, index) => {
387
386
  var _a, _b, _c;
388
- return (React.createElement("div", { key: index, style: ((_a = myFilters[key]) === null || _a === void 0 ? void 0 : _a.length)
389
- ? { marginTop: 10, padding: 10 }
390
- : {} },
387
+ return (React.createElement("div", { key: index, style: ((_a = myFilters[key]) === null || _a === void 0 ? void 0 : _a.length) ? { padding: 10 } : {} },
391
388
  ((_b = myFilters[key]) === null || _b === void 0 ? void 0 : _b.length) ? (React.createElement("div", { style: {
392
389
  padding: "10px 0px 6px",
393
390
  // marginLeft: "10px",
394
391
  }, className: "bold-text" },
395
392
  React.createElement("span", null, commonService.getServiceTypeLabelForFilters(key)))) : null, (_c = myFilters[key]) === null || _c === void 0 ? void 0 :
396
- _c.map((filter, index) => (filter === null || filter === void 0 ? void 0 : filter.name) !== "" && (React.createElement("div", { key: index, className: "p-[6px] flex items-center justify-between" },
393
+ _c.map((filter, index) => (filter === null || filter === void 0 ? void 0 : filter.name) !== "" && (React.createElement("div", { key: index, className: "p-[6px_0px] flex items-center justify-between" },
397
394
  React.createElement("span", null, filter.name),
398
395
  React.createElement(CheckBox
399
396
  // label={"Aplicar filtros"}
package/dist/components/FilterBar/ServiceFilter.d.ts CHANGED
@@ -8,6 +8,7 @@ interface ServiceFilterBarDesktopState {
8
8
  showSpecialDeparture: boolean;
9
9
  showTrainType: boolean;
10
10
  addMargin: boolean;
11
+ showAmenities: boolean;
11
12
  sortedFilters: any[];
12
13
  }
13
14
  declare class ServiceFilter extends React.Component<ServiceFilterProps, ServiceFilterBarDesktopState> {
package/dist/components/FilterBar/ServiceFilter.js CHANGED
@@ -12,7 +12,7 @@ let SEAT_ORDER = [
12
12
  ];
13
13
  class ServiceFilter extends React.Component {
14
14
  constructor(props) {
15
- var _a, _b, _c, _d, _e, _f;
15
+ var _a, _b, _c, _d, _e, _f, _g;
16
16
  super(props);
17
17
  this.state = {
18
18
  showOperators: ((_a = props.initialOpenFilters) === null || _a === void 0 ? void 0 : _a.includes("operator")) || false,
@@ -22,6 +22,7 @@ class ServiceFilter extends React.Component {
22
22
  showSpecialDeparture: ((_e = props.initialOpenFilters) === null || _e === void 0 ? void 0 : _e.includes("special_departure")) || false,
23
23
  showTrainType: ((_f = props.initialOpenFilters) === null || _f === void 0 ? void 0 : _f.includes("train_type")) || false,
24
24
  addMargin: false,
25
+ showAmenities: ((_g = props.initialOpenFilters) === null || _g === void 0 ? void 0 : _g.includes("amenities")) || false,
25
26
  sortedFilters: this.sortFilters(props.filtersArray),
26
27
  };
27
28
  this.handleScroll = this.handleScroll.bind(this);
@@ -93,31 +94,47 @@ class ServiceFilter extends React.Component {
93
94
  ? !prevState.showSpecialDeparture
94
95
  : prevState.showSpecialDeparture, showTrainType: type === "train_type"
95
96
  ? !prevState.showTrainType
96
- : prevState.showTrainType });
97
+ : prevState.showTrainType, showAmenities: type === "amenities"
98
+ ? !prevState.showAmenities
99
+ : prevState.showAmenities });
97
100
  });
98
101
  }
99
102
  renderFilterItem(option, onClick, key) {
100
- const { showOperators, showTimeOptions, showSeatOptions, showTypeOptions, showSpecialDeparture, showTrainType, } = this.state;
103
+ const { showOperators, showTimeOptions, showSeatOptions, showTypeOptions, showSpecialDeparture, showTrainType, showAmenities, } = this.state;
101
104
  const isOpen = (option.type === "operator" && showOperators) ||
102
105
  (option.type === "time" && showTimeOptions) ||
103
106
  (option.type === "seat_types" && showSeatOptions) ||
104
107
  (option.type === "tipo" && showTypeOptions) ||
105
108
  (option.type === "special_departure" && showSpecialDeparture) ||
106
- (option.type === "train_type" && showTrainType);
109
+ (option.type === "train_type" && showTrainType) ||
110
+ (option.type === "amenities" && showAmenities);
111
+ // Return null for train_type if not a train
107
112
  if ((option === null || option === void 0 ? void 0 : option.type) === "train_type" && !this.props.isTrain) {
108
113
  return null;
109
114
  }
110
- // if (
111
- // this.props.isTrain &&
112
- // ["operator", "seat_types", "special_departure"].includes(option?.type)
113
- // ) {
114
- // return null;
115
- // }
115
+ // For trains, only show time, tipo, and train_type filters
116
+ if (this.props.isTrain &&
117
+ !["time", "tipo", "train_type"].includes(option === null || option === void 0 ? void 0 : option.type)) {
118
+ return null;
119
+ }
120
+ // This logic is similar to the functional component's conditional rendering
121
+ // Only show certain filter types for trains, similar to the functional component
122
+ const shouldShowHeader = (option === null || option === void 0 ? void 0 : option.type) === "time" ||
123
+ ((option === null || option === void 0 ? void 0 : option.type) === "train_type" && this.props.isTrain) ||
124
+ ((option === null || option === void 0 ? void 0 : option.type) === "tipo" && this.props.isTrain) ||
125
+ !this.props.isTrain;
116
126
  return (React.createElement("div", { key: key },
117
- React.createElement("div", { onClick: () => this.toggleFilter(option.type), className: "bold-text flex items-center justify-between mt-[16px]" },
127
+ shouldShowHeader && (React.createElement("div", { onClick: () => this.toggleFilter(option.type), className: "bold-text flex items-center justify-between mt-[16px]" },
118
128
  this.props.t("RESULTS_PAGE." + option.title),
119
- React.createElement("img", { src: this.props.icons.downArrow, alt: "downArrow", className: `${isOpen ? "rotate-180" : ""} w-[auto] h-[9px] transition-all duration-300` })),
120
- isOpen &&
129
+ React.createElement("img", { src: this.props.icons.downArrow, alt: "downArrow", className: `${isOpen ? "rotate-180" : ""} w-[auto] h-[9px] transition-all duration-300 cursor-pointer` }))),
130
+ (isOpen ||
131
+ (!this.props.isTrain &&
132
+ option.type !== "operator" &&
133
+ option.type !== "time" &&
134
+ option.type !== "seat_types" &&
135
+ option.type !== "tipo" &&
136
+ option.type !== "special_departure" &&
137
+ option.type !== "train_type")) &&
121
138
  option.options.map((val, i) => {
122
139
  var _a, _b, _c, _d, _e, _f, _g;
123
140
  let iconKey = "";
@@ -163,7 +180,14 @@ class ServiceFilter extends React.Component {
163
180
  else if (val.label === "FLEXIBLE") {
164
181
  label = (_g = this.props.translation) === null || _g === void 0 ? void 0 : _g.flexible;
165
182
  }
183
+ else if (val.label === "Regular") {
184
+ label = "Tren regular";
185
+ }
186
+ else if (val.label === "Expreso") {
187
+ label = "Tren express";
188
+ }
166
189
  else {
190
+ // Use translation if available, otherwise use the label
167
191
  label = val.trText
168
192
  ? val.trText
169
193
  : val.spText
@@ -178,7 +202,7 @@ class ServiceFilter extends React.Component {
178
202
  padding: "2px 6px",
179
203
  paddingLeft: val.active ? "11px" : "",
180
204
  marginLeft: val.active ? "-10px" : "",
181
- }, className: `flex items-center h-[26px] rounded-[15px] cursor-pointer pt-[4px] capitalize ${val.active
205
+ }, className: `flex items-center h-[24px] rounded-[15px] cursor-pointer pt-[4px] ${val.active
182
206
  ? `text-[${this.props.colors.selectedTextColor}]`
183
207
  : ""} ${val.active ? "bold-text" : ""}` },
184
208
  val.icon && this.props.icons && (React.createElement("img", { src: iconKey, alt: val.icon, className: "w-[20px] h-[20px] mr-[10px]" })),
@@ -189,6 +213,7 @@ class ServiceFilter extends React.Component {
189
213
  var _a, _b;
190
214
  const { onFilterSelected } = this.props;
191
215
  const { sortedFilters } = this.state;
216
+ // console.log(this.props, "sortedFilters");
192
217
  return (React.createElement("div", null,
193
218
  React.createElement("div", { style: {
194
219
  overflowY: "scroll",
package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js CHANGED
@@ -112,7 +112,9 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
112
112
  // )
113
113
  ,
114
114
  ":"),
115
- React.createElement("div", { className: "bold-text" },
115
+ React.createElement("div", { className: "bold-text", style: {
116
+ color: colors === null || colors === void 0 ? void 0 : colors.seatPriceColor,
117
+ } },
116
118
  currency ? currency : "",
117
119
  " ",
118
120
  CommonService.currency(val.fare * selectedOnward[1][key], currencySign))));
@@ -132,7 +134,9 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
132
134
  // )
133
135
  ,
134
136
  ":"),
135
- React.createElement("div", { className: "bold-text" },
137
+ React.createElement("div", { className: "bold-text", style: {
138
+ color: colors === null || colors === void 0 ? void 0 : colors.seatPriceColor,
139
+ } },
136
140
  currency ? currency : "",
137
141
  " ",
138
142
  CommonService.currency(val.fare * selectedReturn[1][key], currencySign))));
@@ -140,7 +144,7 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
140
144
  : null),
141
145
  conexionChecked && conexionFare && returnConexionFare ? (React.createElement(PaymentItem, { label: "Conexi\u00F3n Aeropuerto:", amount: CommonService.currency(dateReturn
142
146
  ? returnConexionFare * conexionPassengers
143
- : conexionFare, currencySign), className: "subtotal-row font10" })) : null,
147
+ : conexionFare, currencySign), className: "subtotal-row font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.seatPriceColor } })) : null,
144
148
  metaData &&
145
149
  metaData.whatsapp_delivery_charges &&
146
150
  !loginData &&
@@ -153,18 +157,18 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
153
157
  width: "15px",
154
158
  } }),
155
159
  React.createElement("div", { className: "duration-mouseover font9", style: { lineHeight: "1.3" } },
156
- React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "font10", customStyle: { color: "var(--secondary-color)" } })) : null,
160
+ React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor } })) : null,
157
161
  removeDiscountAtomValue && (React.createElement(PaymentItem, { label: "Cup\u00F3n", amount: CommonService.currency(netFare, currencySign), isNegative: true, currency: "" })),
158
162
  React.createElement("div", { style: { margin: "6px 0" } }, renderDiscount(discountAmount)),
159
- React.createElement(PaymentItem, { label: `${translation === null || translation === void 0 ? void 0 : translation.promotionalCode}:`, amount: CommonService.currency((promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount : 0, currencySign), className: "text-[13.33px]", currency: currency }),
163
+ React.createElement(PaymentItem, { label: `${translation === null || translation === void 0 ? void 0 : translation.promotionalCode}:`, amount: CommonService.currency((promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount : 0, currencySign), className: "text-[13.33px]", currency: currency, customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.promoCodePriceColor } }),
160
164
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? (React.createElement("div", { className: "promocode font10" },
161
165
  React.createElement("div", null, promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCode),
162
166
  React.createElement("span", { className: "promo-remove", onClick: onPromoRemove },
163
167
  React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.closeIcon, alt: "close", className: "w-[16px] h-[16px]" })))) : null,
164
- isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), currency: "" })),
168
+ isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), currency: "", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.agencyFeePriceColor } })),
165
169
  walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: CommonService.currency(walletMoney, currencySign) })) : null,
166
170
  virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text " }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(virtualMoney, currencySign), customStyle: { color: "var(--secondary-color)" }, currency: "" })) : null,
167
- showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "primary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), className: "text-[14px]", amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--primary-color)" } })) : null),
171
+ showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), className: "text-[13.33px]", amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--secondary-color)" } })) : null),
168
172
  React.createElement("div", { className: ` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[9%] pt-[50px] -z-10 rounded-b-[14px] text-[14px]`, style: { backgroundColor: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor } },
169
173
  React.createElement("div", { className: "flex justify-between items-center w-full" },
170
174
  React.createElement("div", { className: "black-text" }, "Total"),
@@ -172,10 +176,13 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
172
176
  minWidth: 80,
173
177
  display: "flex",
174
178
  justifyContent: "flex-end",
175
- } }, CommonService.currency(removeDiscountAtomValue
176
- ? 0
177
- : isAgency
178
- ? netFare + agencyFee
179
- : netFare, currencySign)))))));
179
+ } },
180
+ currency ? currency : "",
181
+ " ",
182
+ CommonService.currency(removeDiscountAtomValue
183
+ ? 0
184
+ : isAgency
185
+ ? netFare + agencyFee
186
+ : netFare, currencySign)))))));
180
187
  };
181
188
  export default PaymentSideBarDesktop;
package/dist/components/PaymentSideBar/PaymentSideBarMobile.js CHANGED
@@ -159,17 +159,17 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
159
159
  lineHeight: "1.3",
160
160
  backgroundColor: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesBgColor,
161
161
  color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesTextColor,
162
- } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: "var(--secondary-color)" } })) : null,
163
- React.createElement(PaymentItem, { label: `${translation === null || translation === void 0 ? void 0 : translation.promotionalCode}:`, amount: CommonService.currency((promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount : 0, currencySign), className: "text-[14px]", showCurrency: false, customStyle: { color: "var(--secondary-color)" }, currency: "" }),
162
+ } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor } })) : null,
163
+ React.createElement(PaymentItem, { label: `${translation === null || translation === void 0 ? void 0 : translation.promotionalCode}:`, amount: CommonService.currency((promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount : 0, currencySign), className: "text-[14px]", showCurrency: false, customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.promoCodePriceColor }, currency: "" }),
164
164
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount) ? (React.createElement("div", { className: "promocode font10" },
165
165
  React.createElement("div", null, promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCode),
166
166
  React.createElement("span", { className: "promo-remove", onClick: onPromoRemove },
167
167
  React.createElement("img", { src: icons === null || icons === void 0 ? void 0 : icons.closeIcon, alt: "close", className: "w-[16px] h-[16px]" })))) : null,
168
168
  conexionChecked && conexionFare && returnConexionFare ? (React.createElement(PaymentItem, { label: "Conexi\u00F3n Aeropuerto:", amount: CommonService.currency(dateReturn
169
169
  ? returnConexionFare * conexionPassengers
170
- : conexionFare, currencySign), className: "subtotal-row text-[14px]" })) : null,
170
+ : conexionFare, currencySign), className: "subtotal-row text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.seatPriceColor } })) : null,
171
171
  removeDiscountAtomValue && (React.createElement(PaymentItem, { label: "Cup\u00F3n", amount: CommonService.currency(netFare, currencySign), isNegative: true, customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]" })),
172
- isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), className: "text-[14px" })),
172
+ isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), className: "text-[14px", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.agencyFeePriceColor } })),
173
173
  walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: CommonService.currency(walletMoney, currencySign), className: "text-[14px]", customStyle: { color: "var(--secondary-color)" }, currency: "" })) : null,
174
174
  virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text", style: { color: "var(--secondary-color)" } }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(virtualMoney, currencySign), customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]", currency: "" })) : null,
175
175
  showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "primary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--primary-color)" }, className: "text-[14px]" })) : null)),
package/dist/components/PaymentSideBar/types.d.ts CHANGED
@@ -50,6 +50,11 @@ export interface PaymentSideBarProps {
50
50
  whatsappDeliveryChargesBgColor?: string;
51
51
  whatsappDeliveryChargesTextColor?: string;
52
52
  countdownTimerColor?: string;
53
+ seatPriceColor?: string;
54
+ discountPriceColor?: string;
55
+ promoCodePriceColor?: string;
56
+ agencyFeePriceColor?: string;
57
+ whatsappDeliveryChargesColor?: string;
53
58
  };
54
59
  trainType?: boolean;
55
60
  icons?: {
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -339,7 +339,9 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
339
339
  // className={`flex flex-col ${
340
340
  // getNumberOfSeats() < 3 ? "justify-between" : ""
341
341
  // }`}
342
- style: { color: isSoldOut ? "#c0c0c0" : colors.priceColor } }, getSeatPrice()))),
342
+ style: {
343
+ color: isSoldOut ? "#c0c0c0" : colors.seatPriceColor,
344
+ } }, getSeatPrice()))),
343
345
  React.createElement("div", null,
344
346
  React.createElement("button", { onClick: () => (!isSoldOut ? checkMidnight() : null), disabled: serviceDetailsLoading, className: `w-full ${serviceDetailsLoading || isSoldOut ? "py-[12px]" : "py-[12px]"} text-[13.33px] font-bold text-white rounded-[10px] border-none px-[20px] flex items-center justify-center`, style: {
345
347
  backgroundColor: serviceDetailsLoading || isSoldOut
package/dist/components/ServiceItem/ServiceItemMobile.js CHANGED
@@ -47,7 +47,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
47
47
  // marginLeft: "10px",
48
48
  color: isSoldOut ? "#bbb" : "#464647",
49
49
  } }, type.label),
50
- React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] bold-text", style: { color: isSoldOut ? "#bbb" : colors.priceColor } }, commonService.currency(type.fare, currencySign))));
50
+ React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] bold-text", style: { color: isSoldOut ? "#bbb" : colors.seatPriceColor } }, commonService.currency(type.fare, currencySign))));
51
51
  });
52
52
  return seatTypes;
53
53
  };
package/dist/components/ServiceItem/mobileTypes.d.ts CHANGED
@@ -126,6 +126,7 @@ export interface MobileServiceItemProps {
126
126
  tooltipBgColor?: string;
127
127
  lastSeatText?: string;
128
128
  lastSeatBg?: string;
129
+ seatPriceColor?: string;
129
130
  };
130
131
  isCiva?: boolean;
131
132
  currencySign?: string;
package/dist/components/ServiceItem/types.d.ts CHANGED
@@ -121,6 +121,7 @@ export interface ServiceItemProps {
121
121
  primaryButtonTextColor?: string;
122
122
  bottomStripColor?: string;
123
123
  directoColor?: string;
124
+ seatPriceColor?: string;
124
125
  };
125
126
  cityOrigin?: {
126
127
  value: number;
package/dist/styles.css CHANGED
@@ -192,6 +192,9 @@
192
192
  .mb-\[15px\] {
193
193
  margin-bottom: 15px;
194
194
  }
195
+ .mb-\[16px\] {
196
+ margin-bottom: 16px;
197
+ }
195
198
  .mb-\[20px\] {
196
199
  margin-bottom: 20px;
197
200
  }
@@ -270,8 +273,8 @@
270
273
  .h-\[20px\] {
271
274
  height: 20px;
272
275
  }
273
- .h-\[26px\] {
274
- height: 26px;
276
+ .h-\[24px\] {
277
+ height: 24px;
275
278
  }
276
279
  .h-\[100\%\] {
277
280
  height: 100%;
@@ -569,8 +572,8 @@
569
572
  -o-object-fit: contain;
570
573
  object-fit: contain;
571
574
  }
572
- .p-\[6px\] {
573
- padding: 6px;
575
+ .p-\[6px_0px\] {
576
+ padding: 6px 0px;
574
577
  }
575
578
  .p-\[6px_20px\] {
576
579
  padding: 6px 20px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "1.1.9",
3
+ "version": "2.0.0",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/FilterBar/FilterBarDesktop.tsx CHANGED
@@ -24,6 +24,7 @@ const FilterBarDesktop = ({
24
24
  isPeru,
25
25
  }: FilterBarProps) => {
26
26
  const filterBy = (filters) => {
27
+ console.log("🚀 ~ filterBy ~ filters:", filters);
27
28
  try {
28
29
  let routes = allSchedules;
29
30
  let filteredRoutes = commonService.copyObject(routes);
@@ -421,192 +422,83 @@ const FilterBarDesktop = ({
421
422
  filteredRoutes = filteredRoutes.filter((it) => {
422
423
  if (activeOptions && activeOptions.length)
423
424
  for (let f of activeOptions) {
424
- console.log("ffffffffffff", f.value.toLowerCase());
425
425
  if (f.active) {
426
- if (f.value.toLowerCase().indexOf("salon cama low") > -1) {
427
- for (let bt of it.seat_types) {
426
+ if (f.value.toLowerCase().indexOf("semi") > -1) {
427
+ for (let bt of it.fare_str.split(",")) {
428
428
  if (
429
- bt?.label?.toLowerCase().indexOf("salon cama low") >
430
- -1
429
+ bt.toLowerCase().split(":")[0].indexOf("semi") > -1
431
430
  ) {
432
431
  return true;
433
432
  }
434
433
  }
435
- } else if (
436
- f.value.toLowerCase().indexOf("salón cama low") > -1
437
- ) {
438
- for (let bt of it.seat_types) {
439
- if (
440
- bt?.label?.toLowerCase().indexOf("salón cama low") >
441
- -1
442
- ) {
443
- return true;
444
- }
445
- }
446
- } else if (
447
- f.value.toLowerCase().indexOf("semi cama low") > -1
448
- ) {
449
- for (let bt of it.seat_types) {
434
+ } else if (f.value.toLowerCase().indexOf("salon") > -1) {
435
+ for (let bt of it.fare_str.split(",")) {
450
436
  if (
451
- bt?.label?.toLowerCase().indexOf("semi cama low") > -1
437
+ bt.toLowerCase().split(":")[0].indexOf("salon") > -1
452
438
  ) {
453
439
  return true;
454
440
  }
455
441
  }
456
442
  } else if (
457
- f.value.toLowerCase().indexOf("cama premium (i)") > -1
443
+ f.value.toLowerCase().indexOf("ejecutivo") > -1
458
444
  ) {
459
- for (let bt of it.seat_types) {
445
+ for (let bt of it.fare_str.split(",")) {
460
446
  if (
461
- bt?.label?.toLowerCase().indexOf("cama premium (i)") >
447
+ bt.toLowerCase().split(":")[0].indexOf("ejecutivo") >
462
448
  -1
463
449
  ) {
464
450
  return true;
465
451
  }
466
452
  }
467
- } else if (
468
- f.value.toLowerCase().indexOf("ejecutivo") > -1
469
- ) {
470
- // for (let bt of it.fare_str.split(",")) {
471
- // if (
472
- // bt.toLowerCase().split(":")[0].indexOf("ejecutivo") > -1
473
- // ) {
474
- // return true;
475
- // }
476
- // }
477
- for (let bt of it.seat_types) {
453
+ } else if (f.value.toLowerCase().indexOf("suite") > -1) {
454
+ for (let bt of it.fare_str.split(",")) {
478
455
  if (
479
- bt?.label?.toLowerCase().indexOf("ejecutivo") > -1
456
+ bt.toLowerCase().split(":")[0].indexOf("suite") > -1
480
457
  ) {
481
458
  return true;
482
459
  }
483
460
  }
484
- } else if (f.value.toLowerCase().indexOf("semi") > -1) {
485
- // for (let bt of it.fare_str.split(",")) {
486
- // if (bt.toLowerCase().split(":")[0].indexOf("semi") > -1) {
487
- // return true;
488
- // }
489
- // }
490
- for (let bt of it.seat_types) {
491
- if (bt?.label?.toLowerCase().indexOf("semi") > -1) {
492
- return true;
493
- }
494
- }
495
- } else if (f.value.toLowerCase().indexOf("salon") > -1) {
496
- // for (let bt of it.fare_str.split(",")) {
497
- // if (
498
- // bt.toLowerCase().split(":")[0].indexOf("salon") > -1
499
- // ) {
500
- // return true;
501
- // }
502
- // }
503
-
504
- for (let bt of it.seat_types) {
505
- if (bt?.label?.toLowerCase().indexOf("salon") > -1) {
506
- return true;
507
- }
508
- }
509
- } else if (f.value.toLowerCase().indexOf("salón") > -1) {
510
- // for (let bt of it.fare_str.split(",")) {
511
- // if (
512
- // bt.toLowerCase().split(":")[0].indexOf("salon") > -1
513
- // ) {
514
- // return true;
515
- // }
516
- // }
517
-
518
- for (let bt of it.seat_types) {
519
- if (bt?.label?.toLowerCase().indexOf("salón") > -1) {
520
- return true;
521
- }
522
- }
523
- } else if (f.value.toLowerCase().indexOf("suite") > -1) {
524
- // for (let bt of it.fare_str.split(",")) {
525
- // if (
526
- // bt.toLowerCase().split(":")[0].indexOf("suite") > -1
527
- // ) {
528
- // return true;
529
- // }
530
- // }
531
-
532
- for (let bt of it.seat_types) {
533
- if (bt?.label?.toLowerCase().indexOf("suite") > -1) {
534
- return true;
535
- }
536
- }
537
461
  } else if (f.value.toLowerCase().indexOf("premium") > -1) {
538
- // for (let bt of it.fare_str.split(",")) {
539
- // if (bt.toLowerCase().split(":")[0].indexOf("premium") > -1) {
540
- // return true;
541
- // }
542
- // }
543
-
544
- for (let bt of it.seat_types) {
545
- if (bt?.label?.toLowerCase().indexOf("premium") > -1) {
462
+ for (let bt of it.fare_str.split(",")) {
463
+ if (
464
+ bt.toLowerCase().split(":")[0].indexOf("vip") > -1
465
+ ) {
546
466
  return true;
547
467
  }
548
468
  }
549
469
  } else if (f.value.toLowerCase().indexOf("vip") > -1) {
550
- // for (let bt of it.fare_str.split(",")) {
551
- // if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
552
- // return true;
553
- // }
554
- // }
555
-
556
- for (let bt of it.seat_types) {
557
- if (bt?.label?.toLowerCase().indexOf("vip") > -1) {
470
+ for (let bt of it.fare_str.split(",")) {
471
+ if (
472
+ bt.toLowerCase().split(":")[0].indexOf("vip") > -1
473
+ ) {
558
474
  return true;
559
475
  }
560
476
  }
561
477
  } else if (f.value.toLowerCase() == "cama") {
562
- // for (let bt of it.fare_str.split(",")) {
563
- // if (bt.toLowerCase().split(":")[0] == "cama") {
564
- // return true;
565
- // }
566
- // }
567
-
568
- for (let bt of it.seat_types) {
569
- if (bt?.label?.toLowerCase().indexOf("cama") > -1) {
478
+ for (let bt of it.fare_str.split(",")) {
479
+ if (bt.toLowerCase().split(":")[0] == "cama") {
570
480
  return true;
571
481
  }
572
482
  }
573
483
  } else if (f.value.toLowerCase() == "preferente") {
574
- // for (let bt of it.fare_str.split(",")) {
575
- // if (bt.toLowerCase().split(":")[0] == "preferente") {
576
- // return true;
577
- // }
578
- // }
579
-
580
- for (let bt of it.seat_types) {
581
- if (
582
- bt?.label?.toLowerCase().indexOf("preferente") > -1
583
- ) {
484
+ for (let bt of it.fare_str.split(",")) {
485
+ if (bt.toLowerCase().split(":")[0] == "preferente") {
584
486
  return true;
585
487
  }
586
488
  }
587
489
  } else if (f.value.toLowerCase().indexOf("vent") > -1) {
588
- // for (let bt of it.fare_str.split(",")) {
589
- // if (bt.toLowerCase().split(":")[0].indexOf("vent") > -1) {
590
- // return true;
591
- // }
592
- // }
593
-
594
- for (let bt of it.seat_types) {
595
- if (bt?.label?.toLowerCase().indexOf("vent") > -1) {
490
+ for (let bt of it.fare_str.split(",")) {
491
+ if (
492
+ bt.toLowerCase().split(":")[0].indexOf("vent") > -1
493
+ ) {
596
494
  return true;
597
495
  }
598
496
  }
599
497
  } else if (f.value.toLowerCase().indexOf("clasico") > -1) {
600
- // for (let bt of it.fare_str.split(",")) {
601
- // if (
602
- // bt.toLowerCase().split(":")[0].indexOf("clasico") > -1
603
- // ) {
604
- // return true;
605
- // }
606
- // }
607
-
608
- for (let bt of it.seat_types) {
609
- if (bt?.label?.toLowerCase().indexOf("clasico") > -1) {
498
+ for (let bt of it.fare_str.split(",")) {
499
+ if (
500
+ bt.toLowerCase().split(":")[0].indexOf("clasico") > -1
501
+ ) {
610
502
  return true;
611
503
  }
612
504
  }
package/src/components/FilterBar/FilterBarMobile.tsx CHANGED
@@ -452,7 +452,7 @@ const FilterBarMobile = ({
452
452
  >
453
453
  <div className=" h-full bg-white flex-col flex justify-between p-5">
454
454
  <div>
455
- <div className="flex items-center mb-4">
455
+ <div className="flex items-center mb-[16px]">
456
456
  <img
457
457
  src={icons.crossIcon}
458
458
  alt="cross"
@@ -467,7 +467,6 @@ const FilterBarMobile = ({
467
467
 
468
468
  {Object.keys(myFilters)
469
469
  .sort((a, b) => {
470
- // sort to show service type first then special departure and then seat type
471
470
  if (a === "service_type") return -1;
472
471
  if (b === "service_type") return 1;
473
472
  if (a === "special_departure") return -1;
@@ -479,11 +478,7 @@ const FilterBarMobile = ({
479
478
  .map((key, index) => (
480
479
  <div
481
480
  key={index}
482
- style={
483
- myFilters[key]?.length
484
- ? { marginTop: 10, padding: 10 }
485
- : {}
486
- }
481
+ style={myFilters[key]?.length ? { padding: 10 } : {}}
487
482
  >
488
483
  {myFilters[key]?.length ? (
489
484
  <div
@@ -503,7 +498,7 @@ const FilterBarMobile = ({
503
498
  filter?.name !== "" && (
504
499
  <div
505
500
  key={index}
506
- className="p-[6px] flex items-center justify-between"
501
+ className="p-[6px_0px] flex items-center justify-between"
507
502
  >
508
503
  <span>{filter.name}</span>
509
504
 
package/src/components/FilterBar/ServiceFilter.tsx CHANGED
@@ -22,6 +22,7 @@ interface ServiceFilterBarDesktopState {
22
22
  showSpecialDeparture: boolean;
23
23
  showTrainType: boolean;
24
24
  addMargin: boolean;
25
+ showAmenities: boolean;
25
26
  sortedFilters: any[];
26
27
  }
27
28
 
@@ -42,6 +43,7 @@ class ServiceFilter extends React.Component<
42
43
  props.initialOpenFilters?.includes("special_departure") || false,
43
44
  showTrainType: props.initialOpenFilters?.includes("train_type") || false,
44
45
  addMargin: false,
46
+ showAmenities: props.initialOpenFilters?.includes("amenities") || false,
45
47
  sortedFilters: this.sortFilters(props.filtersArray),
46
48
  };
47
49
 
@@ -139,6 +141,10 @@ class ServiceFilter extends React.Component<
139
141
  type === "train_type"
140
142
  ? !prevState.showTrainType
141
143
  : prevState.showTrainType,
144
+ showAmenities:
145
+ type === "amenities"
146
+ ? !prevState.showAmenities
147
+ : prevState.showAmenities,
142
148
  };
143
149
  });
144
150
  }
@@ -151,6 +157,7 @@ class ServiceFilter extends React.Component<
151
157
  showTypeOptions,
152
158
  showSpecialDeparture,
153
159
  showTrainType,
160
+ showAmenities,
154
161
  } = this.state;
155
162
 
156
163
  const isOpen =
@@ -159,35 +166,55 @@ class ServiceFilter extends React.Component<
159
166
  (option.type === "seat_types" && showSeatOptions) ||
160
167
  (option.type === "tipo" && showTypeOptions) ||
161
168
  (option.type === "special_departure" && showSpecialDeparture) ||
162
- (option.type === "train_type" && showTrainType);
169
+ (option.type === "train_type" && showTrainType) ||
170
+ (option.type === "amenities" && showAmenities);
163
171
 
172
+ // Return null for train_type if not a train
164
173
  if (option?.type === "train_type" && !this.props.isTrain) {
165
174
  return null;
166
175
  }
167
176
 
168
- // if (
169
- // this.props.isTrain &&
170
- // ["operator", "seat_types", "special_departure"].includes(option?.type)
171
- // ) {
172
- // return null;
173
- // }
177
+ // For trains, only show time, tipo, and train_type filters
178
+ if (
179
+ this.props.isTrain &&
180
+ !["time", "tipo", "train_type"].includes(option?.type)
181
+ ) {
182
+ return null;
183
+ }
184
+
185
+ // This logic is similar to the functional component's conditional rendering
186
+ // Only show certain filter types for trains, similar to the functional component
187
+ const shouldShowHeader =
188
+ option?.type === "time" ||
189
+ (option?.type === "train_type" && this.props.isTrain) ||
190
+ (option?.type === "tipo" && this.props.isTrain) ||
191
+ !this.props.isTrain;
174
192
 
175
193
  return (
176
194
  <div key={key}>
177
- <div
178
- onClick={() => this.toggleFilter(option.type)}
179
- className="bold-text flex items-center justify-between mt-[16px]"
180
- >
181
- {this.props.t("RESULTS_PAGE." + option.title)}
182
- <img
183
- src={this.props.icons.downArrow}
184
- alt="downArrow"
185
- className={`${
186
- isOpen ? "rotate-180" : ""
187
- } w-[auto] h-[9px] transition-all duration-300`}
188
- />
189
- </div>
190
- {isOpen &&
195
+ {shouldShowHeader && (
196
+ <div
197
+ onClick={() => this.toggleFilter(option.type)}
198
+ className="bold-text flex items-center justify-between mt-[16px]"
199
+ >
200
+ {this.props.t("RESULTS_PAGE." + option.title)}
201
+ <img
202
+ src={this.props.icons.downArrow}
203
+ alt="downArrow"
204
+ className={`${
205
+ isOpen ? "rotate-180" : ""
206
+ } w-[auto] h-[9px] transition-all duration-300 cursor-pointer`}
207
+ />
208
+ </div>
209
+ )}
210
+ {(isOpen ||
211
+ (!this.props.isTrain &&
212
+ option.type !== "operator" &&
213
+ option.type !== "time" &&
214
+ option.type !== "seat_types" &&
215
+ option.type !== "tipo" &&
216
+ option.type !== "special_departure" &&
217
+ option.type !== "train_type")) &&
191
218
  option.options.map((val: any, i: number) => {
192
219
  let iconKey = "";
193
220
  if (val.icon === "sunrise") {
@@ -223,13 +250,19 @@ class ServiceFilter extends React.Component<
223
250
  label = this.props.translation?.tipo;
224
251
  } else if (val.label === "FLEXIBLE") {
225
252
  label = this.props.translation?.flexible;
253
+ } else if (val.label === "Regular") {
254
+ label = "Tren regular";
255
+ } else if (val.label === "Expreso") {
256
+ label = "Tren express";
226
257
  } else {
258
+ // Use translation if available, otherwise use the label
227
259
  label = val.trText
228
260
  ? val.trText
229
261
  : val.spText
230
262
  ? val.spText
231
263
  : val.label;
232
264
  }
265
+
233
266
  return (
234
267
  <div
235
268
  key={i}
@@ -244,7 +277,7 @@ class ServiceFilter extends React.Component<
244
277
  paddingLeft: val.active ? "11px" : "",
245
278
  marginLeft: val.active ? "-10px" : "",
246
279
  }}
247
- className={`flex items-center h-[26px] rounded-[15px] cursor-pointer pt-[4px] capitalize ${
280
+ className={`flex items-center h-[24px] rounded-[15px] cursor-pointer pt-[4px] ${
248
281
  val.active
249
282
  ? `text-[${this.props.colors.selectedTextColor}]`
250
283
  : ""
@@ -269,6 +302,8 @@ class ServiceFilter extends React.Component<
269
302
  const { onFilterSelected } = this.props;
270
303
  const { sortedFilters } = this.state;
271
304
 
305
+ // console.log(this.props, "sortedFilters");
306
+
272
307
  return (
273
308
  <div>
274
309
  <div
package/src/components/FilterBar/tyoes.ts CHANGED
@@ -31,4 +31,5 @@ export interface FilterBarProps {
31
31
  translation?: { [key: string]: string };
32
32
  isTrain?: boolean;
33
33
  isPeru?: boolean;
34
+
34
35
  }
package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx CHANGED
@@ -276,7 +276,12 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
276
276
  }
277
277
  :
278
278
  </div>
279
- <div className="bold-text">
279
+ <div
280
+ className="bold-text"
281
+ style={{
282
+ color: colors?.seatPriceColor,
283
+ }}
284
+ >
280
285
  {currency ? currency : ""}{" "}
281
286
  {CommonService.currency(
282
287
  val.fare * selectedOnward[1][key],
@@ -305,7 +310,12 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
305
310
  }
306
311
  :
307
312
  </div>
308
- <div className="bold-text">
313
+ <div
314
+ className="bold-text"
315
+ style={{
316
+ color: colors?.seatPriceColor,
317
+ }}
318
+ >
309
319
  {currency ? currency : ""}{" "}
310
320
  {CommonService.currency(
311
321
  val.fare * selectedReturn[1][key],
@@ -328,6 +338,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
328
338
  currencySign
329
339
  )}
330
340
  className="subtotal-row font10"
341
+ customStyle={{ color: colors?.seatPriceColor }}
331
342
  />
332
343
  ) : null}
333
344
 
@@ -362,7 +373,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
362
373
  }
363
374
  amount={metaData.whatsapp_delivery_charges}
364
375
  className="font10"
365
- customStyle={{ color: "var(--secondary-color)" }}
376
+ customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
366
377
  />
367
378
  ) : null}
368
379
 
@@ -387,6 +398,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
387
398
  )}
388
399
  className="text-[13.33px]"
389
400
  currency={currency}
401
+ customStyle={{ color: colors?.promoCodePriceColor }}
390
402
  />
391
403
  {promoCode?.promoCouponAmount ? (
392
404
  <div className="promocode font10">
@@ -409,6 +421,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
409
421
  currencySign
410
422
  )}
411
423
  currency=""
424
+ customStyle={{ color: colors?.agencyFeePriceColor }}
412
425
  />
413
426
  )}
414
427
 
@@ -433,15 +446,15 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
433
446
  {showUsd ? (
434
447
  <PaymentItem
435
448
  label={
436
- <span className="primary-text">{translation?.showUsd}</span>
449
+ <span className="secondary-text">{translation?.showUsd}</span>
437
450
  }
438
- className="text-[14px]"
451
+ className="text-[13.33px]"
439
452
  amount={CommonService.currency(
440
453
  isAgency ? netFareInUsd + agencyFee : netFareInUsd,
441
454
  currencySign
442
455
  )}
443
456
  currency="USD"
444
- customStyle={{ color: "var(--primary-color)" }}
457
+ customStyle={{ color: "var(--secondary-color)" }}
445
458
  />
446
459
  ) : null}
447
460
  </div>
@@ -459,6 +472,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
459
472
  justifyContent: "flex-end",
460
473
  }}
461
474
  >
475
+ {currency ? currency : ""}{" "}
462
476
  {CommonService.currency(
463
477
  removeDiscountAtomValue
464
478
  ? 0
package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx CHANGED
@@ -380,7 +380,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
380
380
  }
381
381
  amount={metaData.whatsapp_delivery_charges}
382
382
  className="text-[14px]"
383
- customStyle={{ color: "var(--secondary-color)" }}
383
+ customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
384
384
  />
385
385
  ) : null}
386
386
 
@@ -392,7 +392,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
392
392
  )}
393
393
  className="text-[14px]"
394
394
  showCurrency={false}
395
- customStyle={{ color: "var(--secondary-color)" }}
395
+ customStyle={{ color: colors?.promoCodePriceColor }}
396
396
  currency=""
397
397
  />
398
398
  {promoCode?.promoCouponAmount ? (
@@ -418,6 +418,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
418
418
  currencySign
419
419
  )}
420
420
  className="subtotal-row text-[14px]"
421
+ customStyle={{ color: colors?.seatPriceColor }}
421
422
  />
422
423
  ) : null}
423
424
 
@@ -439,6 +440,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
439
440
  currencySign
440
441
  )}
441
442
  className="text-[14px"
443
+ customStyle={{ color: colors?.agencyFeePriceColor }}
442
444
  />
443
445
  )}
444
446
 
package/src/components/PaymentSideBar/types.ts CHANGED
@@ -47,6 +47,13 @@ export interface PaymentSideBarProps {
47
47
  whatsappDeliveryChargesBgColor?: string,
48
48
  whatsappDeliveryChargesTextColor?: string,
49
49
  countdownTimerColor?: string,
50
+
51
+ seatPriceColor?: string,
52
+ discountPriceColor?: string,
53
+ promoCodePriceColor?: string,
54
+ agencyFeePriceColor?: string,
55
+ whatsappDeliveryChargesColor?: string,
56
+
50
57
  };
51
58
  trainType?: boolean;
52
59
  icons?: {
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -663,7 +663,9 @@ function ServiceItemPB({
663
663
  // className={`flex flex-col ${
664
664
  // getNumberOfSeats() < 3 ? "justify-between" : ""
665
665
  // }`}
666
- style={{ color: isSoldOut ? "#c0c0c0" : colors.priceColor }}
666
+ style={{
667
+ color: isSoldOut ? "#c0c0c0" : colors.seatPriceColor,
668
+ }}
667
669
  >
668
670
  {getSeatPrice()}
669
671
  </div>
package/src/components/ServiceItem/ServiceItemMobile.tsx CHANGED
@@ -85,7 +85,7 @@ function ServiceItemMobile({
85
85
  </span>
86
86
  <span
87
87
  className={"min-[420]:text-[13px] text-[11px] bold-text"}
88
- style={{ color: isSoldOut ? "#bbb" : colors.priceColor }}
88
+ style={{ color: isSoldOut ? "#bbb" : colors.seatPriceColor }}
89
89
  >
90
90
  {commonService.currency(type.fare, currencySign)}
91
91
  </span>
package/src/components/ServiceItem/mobileTypes.ts CHANGED
@@ -138,6 +138,8 @@ export interface MobileServiceItemProps {
138
138
  tooltipBgColor?: string;
139
139
  lastSeatText?: string;
140
140
  lastSeatBg?: string;
141
+
142
+ seatPriceColor?: string;
141
143
  };
142
144
  isCiva?: boolean;
143
145
  currencySign?: string;
package/src/components/ServiceItem/types.ts CHANGED
@@ -123,6 +123,8 @@ export interface ServiceItemProps {
123
123
  primaryButtonTextColor?: string;
124
124
  bottomStripColor?: string;
125
125
  directoColor?: string;
126
+
127
+ seatPriceColor?: string;
126
128
  };
127
129
  cityOrigin?: { value: number; label: string };
128
130
  cityDestination?: { value: number; label: string };