@qite/tide-booking-component 1.4.106 → 1.4.108
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/build/build-cjs/index.js +18109 -20900
- package/build/build-cjs/src/content/error/error.d.ts +6 -0
- package/build/build-cjs/src/qsm/store/qsm-slice.d.ts +2 -1
- package/build/build-cjs/src/shared/components/icon.d.ts +1 -0
- package/build/build-cjs/src/shared/utils/localization-util.d.ts +4 -0
- package/build/build-esm/index.js +18067 -20819
- package/build/build-esm/src/content/error/error.d.ts +6 -0
- package/build/build-esm/src/qsm/store/qsm-slice.d.ts +2 -1
- package/build/build-esm/src/shared/components/icon.d.ts +1 -0
- package/build/build-esm/src/shared/utils/localization-util.d.ts +4 -0
- package/package.json +1 -1
- package/src/booking-product/components/amount-input.tsx +1 -1
- package/src/booking-product/components/date-range-picker/calendar.tsx +1 -1
- package/src/booking-product/components/dates.tsx +1 -1
- package/src/booking-product/components/header.tsx +1 -1
- package/src/booking-product/components/rating.tsx +1 -1
- package/src/booking-product/components/rooms.tsx +1 -1
- package/src/booking-wizard/components/message.tsx +1 -1
- package/src/booking-wizard/features/confirmation/confirmation.tsx +1 -1
- package/src/booking-wizard/features/flight-options/flight-filter.tsx +1 -1
- package/src/booking-wizard/features/flight-options/flight-option-flight.tsx +1 -1
- package/src/booking-wizard/features/flight-options/flight-option-modal.tsx +1 -1
- package/src/booking-wizard/features/summary/summary.tsx +1 -1
- package/src/booking-wizard/features/travelers-form/type-ahead-input.tsx +1 -1
- package/src/content/components/accordion.tsx +1 -1
- package/src/content/components/contact.tsx +0 -1
- package/src/content/components/gallery.tsx +3 -3
- package/src/content/components/login.tsx +1 -2
- package/src/content/components/personal-contact-form.tsx +1 -1
- package/src/content/components/slider.tsx +1 -1
- package/src/content/error/error.tsx +27 -0
- package/src/content/featured-trips/featured-trip-card.tsx +1 -1
- package/src/content/features/content-page/content-page-self-contained.tsx +1 -1
- package/src/content/footer/index.tsx +1 -1
- package/src/content/navbar/index.tsx +1 -1
- package/src/qsm/components/QSMContainer/qsm-container.tsx +58 -5
- package/src/qsm/components/search-input/index.tsx +1 -1
- package/src/qsm/components/search-input-group/index.tsx +13 -2
- package/src/qsm/components/travel-input/index.tsx +1 -3
- package/src/qsm/components/travel-input-group/index.tsx +1 -1
- package/src/qsm/store/qsm-slice.ts +10 -3
- package/src/search-results/components/excursions/day-by-day-excursions.tsx +4 -9
- package/src/search-results/components/filters/filters.tsx +1 -1
- package/src/search-results/components/filters/flight-filters.tsx +1 -1
- package/src/search-results/components/flight/flight-results.tsx +1 -1
- package/src/search-results/components/flight/flight-selection/independent-flight-option.tsx +1 -1
- package/src/search-results/components/flight/flight-selection/independent-flight-selection.tsx +1 -1
- package/src/search-results/components/flight/flight-selection/paired-flight-option.tsx +1 -1
- package/src/search-results/components/flight/flight-selection/paired-flight-selection.tsx +1 -1
- package/src/search-results/components/group-tour/group-tour-card.tsx +1 -1
- package/src/search-results/components/hotel/hotel-accommodation-results.tsx +1 -1
- package/src/search-results/components/hotel/hotel-card.tsx +1 -1
- package/src/search-results/components/itinerary/index.tsx +1 -1
- package/src/search-results/components/round-trip/round-trip-results.tsx +1 -1
- package/src/search-results/components/search-results-container/flight-search-results.tsx +1 -1
- package/src/search-results/components/search-results-container/search-results-container.tsx +3 -4
- package/src/search-results/components/tab-views/index.tsx +1 -1
- package/src/search-results/features/flights/flight-search-results-self-contained.tsx +1 -1
- package/src/search-results/features/hotels/hotel-flight-search-results-self-contained.tsx +1 -1
- package/src/search-results/features/hotels/hotel-search-results-self-contained.tsx +1 -1
- package/src/shared/components/flyin/flyin.tsx +1 -1
- package/src/shared/components/icon.tsx +363 -88
- package/src/shared/utils/tide-api-utils.ts +2 -2
- package/styles/booking-qsm-variables.scss +2 -2
- package/styles/booking-search-results-variables.scss +17 -17
- package/styles/components/_error.scss +50 -0
- package/styles/components/_faq.scss +3 -0
- package/styles/components/_flyin.scss +19 -0
- package/styles/components/_gallery.scss +5 -2
- package/styles/content-blocks.scss +1 -0
- package/styles/qsm/_qsm.scss +3 -0
- package/build/build-cjs/src/booking-product/components/icon.d.ts +0 -10
- package/build/build-cjs/src/booking-wizard/components/icon.d.ts +0 -10
- package/build/build-cjs/src/content/components/icon.d.ts +0 -10
- package/build/build-cjs/src/qsm/components/icon.d.ts +0 -10
- package/build/build-cjs/src/search-results/components/icon.d.ts +0 -11
- package/build/build-esm/src/booking-product/components/icon.d.ts +0 -10
- package/build/build-esm/src/booking-wizard/components/icon.d.ts +0 -10
- package/build/build-esm/src/content/components/icon.d.ts +0 -10
- package/build/build-esm/src/qsm/components/icon.d.ts +0 -10
- package/build/build-esm/src/search-results/components/icon.d.ts +0 -11
- package/src/booking-product/components/icon.tsx +0 -200
- package/src/booking-wizard/components/icon.tsx +0 -398
- package/src/content/components/icon.tsx +0 -695
- package/src/qsm/components/icon.tsx +0 -354
- package/src/search-results/components/icon.tsx +0 -677
|
@@ -121,6 +121,7 @@ export declare const setSelectedQsmType: import('@reduxjs/toolkit').ActionCreato
|
|
|
121
121
|
value: any;
|
|
122
122
|
},
|
|
123
123
|
'qsm/setFieldValue'
|
|
124
|
-
|
|
124
|
+
>,
|
|
125
|
+
hydrateQsmState: import('@reduxjs/toolkit').ActionCreatorWithPayload<Partial<QSMState>, 'qsm/hydrateQsmState'>;
|
|
125
126
|
declare const _default: import('@reduxjs/toolkit').Reducer<QSMState>;
|
|
126
127
|
export default _default;
|
|
@@ -389,6 +389,10 @@ export declare const getTranslations: (language: string) => {
|
|
|
389
389
|
TRAVEL_GROUP: string;
|
|
390
390
|
EXCURSION: string;
|
|
391
391
|
};
|
|
392
|
+
ITINERARY: {
|
|
393
|
+
DAY: string;
|
|
394
|
+
NO_ITEMS: string;
|
|
395
|
+
};
|
|
392
396
|
};
|
|
393
397
|
export declare const locales: {
|
|
394
398
|
'ar-SA': import('date-fns').Locale;
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
|
|
|
2
2
|
import { getTranslations } from '../../shared/utils/localization-util';
|
|
3
3
|
import SettingsContext from '../settings-context';
|
|
4
4
|
import { buildClassName } from '../../shared/utils/class-util';
|
|
5
|
-
import Icon from '
|
|
5
|
+
import Icon from '../../shared/components/icon';
|
|
6
6
|
|
|
7
7
|
interface AmountInputProps {
|
|
8
8
|
label: string;
|
|
@@ -18,7 +18,7 @@ import { buildClassName } from '../../../shared/utils/class-util';
|
|
|
18
18
|
import { getLocale } from '../../../shared/utils/localization-util';
|
|
19
19
|
import SettingsContext from '../../settings-context';
|
|
20
20
|
import CalendarDay from './calendar-day';
|
|
21
|
-
import Icon from '
|
|
21
|
+
import Icon from '../../../shared/components/icon';
|
|
22
22
|
|
|
23
23
|
interface CalendarProps {
|
|
24
24
|
year?: number;
|
|
@@ -6,7 +6,7 @@ import { getTranslations } from '../../shared/utils/localization-util';
|
|
|
6
6
|
import SettingsContext from '../settings-context';
|
|
7
7
|
import { DateRange } from '../types';
|
|
8
8
|
import DateRangePicker from './date-range-picker';
|
|
9
|
-
import Icon from '
|
|
9
|
+
import Icon from '../../shared/components/icon';
|
|
10
10
|
|
|
11
11
|
interface DatesProps {
|
|
12
12
|
value?: DateRange;
|
|
@@ -3,7 +3,7 @@ import Loader from '../../shared/components/loader';
|
|
|
3
3
|
import Rating from './rating';
|
|
4
4
|
import { getTranslations } from '../../shared/utils/localization-util';
|
|
5
5
|
import SettingsContext from '../settings-context';
|
|
6
|
-
import Icon from '
|
|
6
|
+
import Icon from '../../shared/components/icon';
|
|
7
7
|
|
|
8
8
|
interface HeaderProps {
|
|
9
9
|
name: string;
|
|
@@ -6,7 +6,7 @@ import SettingsContext from '../settings-context';
|
|
|
6
6
|
import { ProductRoom } from '../types';
|
|
7
7
|
import AgeSelect from './age-select';
|
|
8
8
|
import AmountInput from './amount-input';
|
|
9
|
-
import Icon from '
|
|
9
|
+
import Icon from '../../shared/components/icon';
|
|
10
10
|
|
|
11
11
|
interface RoomsProps {
|
|
12
12
|
rooms: ProductRoom[];
|
|
@@ -4,7 +4,7 @@ import { selectBookingNumber, selectBookingQueryString, selectIsOption, selectTr
|
|
|
4
4
|
import Message from '../../components/message';
|
|
5
5
|
import SettingsContext from '../../settings-context';
|
|
6
6
|
import { useSelector } from 'react-redux';
|
|
7
|
-
import Icon from '
|
|
7
|
+
import Icon from '../../../shared/components/icon';
|
|
8
8
|
import { useAppDispatch } from '../../store';
|
|
9
9
|
import { setCurrentStep } from '../booking/booking-slice';
|
|
10
10
|
import { OPTIONS_FORM_STEP } from '../booking/constants';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { useState, useEffect, useRef } from 'react';
|
|
2
2
|
import { useSelector } from 'react-redux';
|
|
3
3
|
import { buildClassName } from '../../../shared/utils/class-util';
|
|
4
|
-
import Icon from '
|
|
4
|
+
import Icon from '../../../shared/components/icon';
|
|
5
5
|
import MultiRangeFilter from '../../components/multi-range-filter';
|
|
6
6
|
import { FlightFilterOptions } from '../../types';
|
|
7
7
|
import { selectTranslations } from '../booking/selectors';
|
|
@@ -4,7 +4,7 @@ import { buildClassName } from '../../../shared/utils/class-util';
|
|
|
4
4
|
import { GroupedFlightDetails } from '../../types';
|
|
5
5
|
import { selectTranslations } from '../booking/selectors';
|
|
6
6
|
import { getDateText } from '../sidebar/sidebar-util';
|
|
7
|
-
import Icon from '
|
|
7
|
+
import Icon from '../../../shared/components/icon';
|
|
8
8
|
|
|
9
9
|
interface FlightOptionFlightProps {
|
|
10
10
|
details: GroupedFlightDetails;
|
|
@@ -6,7 +6,7 @@ import React, { useContext, useEffect, useState } from 'react';
|
|
|
6
6
|
import { useSelector } from 'react-redux';
|
|
7
7
|
import { buildClassName } from '../../../shared/utils/class-util';
|
|
8
8
|
import { buildTideClientConfig } from '../../../shared/utils/tide-api-utils';
|
|
9
|
-
import Icon from '
|
|
9
|
+
import Icon from '../../../shared/components/icon';
|
|
10
10
|
import SettingsContext from '../../settings-context';
|
|
11
11
|
import { useAppDispatch } from '../../store';
|
|
12
12
|
import { SummaryCheckbox } from '../../types';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useEffect, useState } from 'react';
|
|
2
|
-
import Icon from '
|
|
2
|
+
import Icon from '../../shared/components/icon';
|
|
3
3
|
|
|
4
4
|
export interface GalleryImage {
|
|
5
5
|
src: string;
|
|
@@ -141,8 +141,8 @@ const PhotoGallery: React.FC<GalleryProps> = ({ images, title, intro }) => {
|
|
|
141
141
|
)}
|
|
142
142
|
</section>
|
|
143
143
|
<div>
|
|
144
|
-
<h2>{title}</h2>
|
|
145
|
-
<p>{intro}</p>
|
|
144
|
+
<h2 className="gallery__title">{title}</h2>
|
|
145
|
+
<p className="gallery__text">{intro}</p>
|
|
146
146
|
</div>
|
|
147
147
|
</div>
|
|
148
148
|
</div>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Icon from '../../shared/components/icon';
|
|
3
|
+
|
|
4
|
+
type ErrorProps = {
|
|
5
|
+
message?: string;
|
|
6
|
+
};
|
|
7
|
+
const Error: React.FC<ErrorProps> = ({ message }) => {
|
|
8
|
+
return (
|
|
9
|
+
<section className="error">
|
|
10
|
+
<div className="error__container">
|
|
11
|
+
<div className="error__card">
|
|
12
|
+
<div className="error__icon">
|
|
13
|
+
<Icon name="ui-triangle-error" width={20} height={20} />
|
|
14
|
+
</div>
|
|
15
|
+
<h1 className="error__title">Something went wrong</h1>
|
|
16
|
+
<p className="error__message">{message || 'Sorry, something went wrong. Please try again later.'}</p>
|
|
17
|
+
|
|
18
|
+
<a href="/" className="cta cta--primary error__link">
|
|
19
|
+
Back to home
|
|
20
|
+
</a>
|
|
21
|
+
</div>
|
|
22
|
+
</div>
|
|
23
|
+
</section>
|
|
24
|
+
);
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export default Error;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FeaturedTrip } from './types';
|
|
3
|
-
import Icon from '
|
|
3
|
+
import Icon from '../../shared/components/icon';
|
|
4
4
|
import { getTranslations } from '../../shared/utils/localization-util';
|
|
5
5
|
|
|
6
6
|
const FeaturedTripCard: React.FC<FeaturedTrip> = ({ imageSrc, imageAlt, title, location, language, onButtonClick }) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Navbar, PickerItem } from '../../../../src';
|
|
3
3
|
import { TideLogo, language, languages, topLinks, navItems } from '../../../../src/content/navbar/placeholderData';
|
|
4
|
-
import Icon from '
|
|
4
|
+
import Icon from '../../../shared/components/icon';
|
|
5
5
|
import ContactForm from '../../components/contact';
|
|
6
6
|
import Slider from '../../components/slider';
|
|
7
7
|
import { QSMConfiguration, TypeaheadOption } from '../../../qsm/types';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useEffect, useState } from 'react';
|
|
2
2
|
import LanguageSwitcher from '../components/LanguageSwitcher';
|
|
3
|
-
import Icon from '
|
|
3
|
+
import Icon from '../../shared/components/icon';
|
|
4
4
|
import { NavbarProps, NavItem } from '../navbar/types';
|
|
5
5
|
import { getTranslations } from '../../shared/utils/localization-util';
|
|
6
6
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useContext, useEffect, useMemo } from 'react';
|
|
1
|
+
import React, { useContext, useEffect, useMemo, useRef } from 'react';
|
|
2
2
|
import { useDispatch, useSelector } from 'react-redux';
|
|
3
3
|
import { QSMRootState } from '../../store/qsm-store';
|
|
4
4
|
import QSMConfigurationContext from '../../qsm-configuration-context';
|
|
@@ -10,11 +10,11 @@ import Dates from '../../../booking-product/components/dates';
|
|
|
10
10
|
import TravelInputGroup from '../travel-input-group';
|
|
11
11
|
import TravelClassPicker from '../travel-class-picker';
|
|
12
12
|
import TravelTypePicker from '../travel-type-picker';
|
|
13
|
-
import Icon from '
|
|
13
|
+
import Icon from '../../../shared/components/icon';
|
|
14
14
|
import TravelNationalityPicker from '../travel-nationality-picker';
|
|
15
15
|
import { addDays, addMonths, addYears, format } from 'date-fns';
|
|
16
16
|
import { DateRange } from '../../../booking-product/types';
|
|
17
|
-
import { QSMState, setFromDate, setSelectedQsmType, setToDate, setTripType } from '../../store/qsm-slice';
|
|
17
|
+
import { hydrateQsmState, QSMState, setFromDate, setSelectedQsmType, setToDate, setTripType } from '../../store/qsm-slice';
|
|
18
18
|
import { BaseFieldConfig, DoubleFieldConfig } from '../../types';
|
|
19
19
|
import { getTranslations } from '../../../shared/utils/localization-util';
|
|
20
20
|
import { DateAmountType, PortalQsmType } from '@qite/tide-client';
|
|
@@ -47,10 +47,16 @@ const QSMContainer: React.FC = () => {
|
|
|
47
47
|
const translations = getTranslations(languageCode ?? 'en-GB');
|
|
48
48
|
|
|
49
49
|
useEffect(() => {
|
|
50
|
+
if (!hasHydratedFromSession.current) return;
|
|
51
|
+
|
|
52
|
+
const stored = sessionStorage.getItem(QSM_SESSION_STORAGE_KEY);
|
|
53
|
+
const storedQsmType = stored ? JSON.parse(stored).qsmType : undefined;
|
|
54
|
+
|
|
55
|
+
if (storedQsmType) return;
|
|
56
|
+
|
|
50
57
|
const defaultQsmType = first(searchConfigurations)?.qsmType;
|
|
51
|
-
console.log('Available search configurations:', searchConfigurations);
|
|
52
58
|
if (!defaultQsmType) return;
|
|
53
|
-
|
|
59
|
+
|
|
54
60
|
handleQsmTypeChange(defaultQsmType);
|
|
55
61
|
}, [searchConfigurations]);
|
|
56
62
|
|
|
@@ -78,6 +84,24 @@ const QSMContainer: React.FC = () => {
|
|
|
78
84
|
};
|
|
79
85
|
}, [fromDate, toDate]);
|
|
80
86
|
|
|
87
|
+
const QSM_SESSION_STORAGE_KEY = 'qsm-state';
|
|
88
|
+
|
|
89
|
+
const hasHydratedFromSession = useRef(false);
|
|
90
|
+
|
|
91
|
+
useEffect(() => {
|
|
92
|
+
try {
|
|
93
|
+
const stored = sessionStorage.getItem(QSM_SESSION_STORAGE_KEY);
|
|
94
|
+
|
|
95
|
+
if (stored) {
|
|
96
|
+
dispatch(hydrateQsmState(JSON.parse(stored)));
|
|
97
|
+
}
|
|
98
|
+
} catch {
|
|
99
|
+
sessionStorage.removeItem(QSM_SESSION_STORAGE_KEY);
|
|
100
|
+
} finally {
|
|
101
|
+
hasHydratedFromSession.current = true;
|
|
102
|
+
}
|
|
103
|
+
}, [dispatch]);
|
|
104
|
+
|
|
81
105
|
const handleDateChange = (value: DateRange) => {
|
|
82
106
|
dispatch(setFromDate(value.fromDate ? format(value.fromDate, 'yyyy-MM-dd') : undefined));
|
|
83
107
|
dispatch(setToDate(value.toDate ? format(value.toDate, 'yyyy-MM-dd') : undefined));
|
|
@@ -264,6 +288,35 @@ const QSMContainer: React.FC = () => {
|
|
|
264
288
|
}
|
|
265
289
|
};
|
|
266
290
|
|
|
291
|
+
useEffect(() => {
|
|
292
|
+
if (!hasHydratedFromSession.current) return;
|
|
293
|
+
|
|
294
|
+
const searchFields = [departureAirport, destinationAirport, returnAirport, destination].filter((field): field is BaseFieldConfig => field !== undefined);
|
|
295
|
+
|
|
296
|
+
const dynamicFields = searchFields.reduce<Record<string, any>>((result, field) => {
|
|
297
|
+
result[field.fieldKey] = qsmState[field.fieldKey];
|
|
298
|
+
return result;
|
|
299
|
+
}, {});
|
|
300
|
+
|
|
301
|
+
const stateToPersist: Partial<QSMState> = {
|
|
302
|
+
qsmType,
|
|
303
|
+
fromDate,
|
|
304
|
+
toDate,
|
|
305
|
+
tripType,
|
|
306
|
+
selectedTravelClass: qsmState.selectedTravelClass,
|
|
307
|
+
selectedTravelType: qsmState.selectedTravelType,
|
|
308
|
+
selectedNationality: qsmState.selectedNationality,
|
|
309
|
+
adults: qsmState.adults,
|
|
310
|
+
kids: qsmState.kids,
|
|
311
|
+
babies: qsmState.babies,
|
|
312
|
+
rooms: qsmState.rooms,
|
|
313
|
+
travelers: qsmState.travelers,
|
|
314
|
+
...dynamicFields
|
|
315
|
+
};
|
|
316
|
+
|
|
317
|
+
sessionStorage.setItem(QSM_SESSION_STORAGE_KEY, JSON.stringify(stateToPersist));
|
|
318
|
+
}, [qsmState, qsmType, fromDate, toDate, tripType, departureAirport, destinationAirport, returnAirport, destination]);
|
|
319
|
+
|
|
267
320
|
return (
|
|
268
321
|
<div className="qsm">
|
|
269
322
|
<div className="qsm__content">
|
|
@@ -4,7 +4,7 @@ import { QSMRootState } from '../../store/qsm-store';
|
|
|
4
4
|
import { setFieldValue, setSearchResults, setActiveSearchField, setMobileFilterType, setActiveSearchFieldProps } from '../../store/qsm-slice';
|
|
5
5
|
import useMediaQuery from '../../../shared/utils/use-media-query-util';
|
|
6
6
|
import SearchInput from '../search-input';
|
|
7
|
-
import Icon from '
|
|
7
|
+
import Icon from '../../../shared/components/icon';
|
|
8
8
|
import { BaseFieldConfig, TypeaheadOption, OptionType } from '../../types';
|
|
9
9
|
|
|
10
10
|
interface Props {
|
|
@@ -49,7 +49,18 @@ const SearchInputGroup: React.FC<Props> = ({
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
const lowered = input.toLowerCase();
|
|
52
|
-
|
|
52
|
+
|
|
53
|
+
return options
|
|
54
|
+
.filter((option) => option.value.toLowerCase().includes(lowered) || option.iataCode?.toLowerCase().includes(lowered))
|
|
55
|
+
.sort((a, b) => {
|
|
56
|
+
const aExactIata = a.iataCode?.toLowerCase() === lowered;
|
|
57
|
+
const bExactIata = b.iataCode?.toLowerCase() === lowered;
|
|
58
|
+
|
|
59
|
+
if (aExactIata && !bExactIata) return -1;
|
|
60
|
+
if (!aExactIata && bExactIata) return 1;
|
|
61
|
+
|
|
62
|
+
return 0;
|
|
63
|
+
});
|
|
53
64
|
},
|
|
54
65
|
[options]
|
|
55
66
|
);
|
|
@@ -4,9 +4,7 @@ import { QSMRootState } from '../../store/qsm-store';
|
|
|
4
4
|
import { setAdults, setKids, setBabies, setRooms, addRoom, removeRoom, updateRoomTraveler } from '../../store/qsm-slice';
|
|
5
5
|
import QSMConfigurationContext from '../../qsm-configuration-context';
|
|
6
6
|
import { getTranslations } from '../../../shared/utils/localization-util';
|
|
7
|
-
import
|
|
8
|
-
import TravelTypePicker from '../travel-type-picker';
|
|
9
|
-
import Icon from '../icon';
|
|
7
|
+
import Icon from '../../../shared/components/icon';
|
|
10
8
|
import { PortalQsmType } from '@qite/tide-client';
|
|
11
9
|
|
|
12
10
|
const TravelInput: React.FC = () => {
|
|
@@ -5,7 +5,7 @@ import { setAdults, setMobileFilterType, setRooms } from '../../store/qsm-slice'
|
|
|
5
5
|
import useMediaQuery from '../../../shared/utils/use-media-query-util';
|
|
6
6
|
import { QSMRootState } from '../../store/qsm-store';
|
|
7
7
|
import QSMConfigurationContext from '../../qsm-configuration-context';
|
|
8
|
-
import Icon from '
|
|
8
|
+
import Icon from '../../../shared/components/icon';
|
|
9
9
|
import { getTranslations } from '../../../shared/utils/localization-util';
|
|
10
10
|
import { PortalQsmType } from '@qite/tide-client';
|
|
11
11
|
|
|
@@ -228,9 +228,15 @@ const qsmSlice = createSlice({
|
|
|
228
228
|
) => {
|
|
229
229
|
const { roomIndex, type, value } = action.payload;
|
|
230
230
|
state.rooms[roomIndex][type] = value;
|
|
231
|
-
}
|
|
231
|
+
},
|
|
232
|
+
hydrateQsmState: (state, action: PayloadAction<Partial<QSMState>>) => {
|
|
233
|
+
Object.assign(state, action.payload);
|
|
232
234
|
|
|
233
|
-
|
|
235
|
+
state.searchResults = [];
|
|
236
|
+
state.activeSearchField = null;
|
|
237
|
+
state.activeSearchFieldProps = null;
|
|
238
|
+
state.mobileFilterType = null;
|
|
239
|
+
}
|
|
234
240
|
}
|
|
235
241
|
});
|
|
236
242
|
|
|
@@ -270,6 +276,7 @@ export const {
|
|
|
270
276
|
updateRoomTraveler,
|
|
271
277
|
setMaxInfantAge,
|
|
272
278
|
setDatesIcon,
|
|
273
|
-
setFieldValue
|
|
279
|
+
setFieldValue,
|
|
280
|
+
hydrateQsmState
|
|
274
281
|
} = qsmSlice.actions;
|
|
275
282
|
export default qsmSlice.reducer;
|
|
@@ -2,13 +2,13 @@ import React, { useContext, useMemo } from 'react';
|
|
|
2
2
|
import { useDispatch, useSelector } from 'react-redux';
|
|
3
3
|
import { SearchResultsRootState } from '../../store/search-results-store';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../search-results-configuration-context';
|
|
5
|
-
import { getDatesBetween, getTranslations } from '../../../shared/utils/localization-util';
|
|
5
|
+
import { getDatesBetween, getLocale, getTranslations } from '../../../shared/utils/localization-util';
|
|
6
6
|
import { selectSelectedPackagingAccoResult } from '../../store/search-results-selectors';
|
|
7
7
|
import { removeConfirmedExcursionForDay, setExcursionSearchParams, setFlyInIsOpen, setFlyInType } from '../../store/search-results-slice';
|
|
8
8
|
import { ExcursionSearchParams } from '../../types';
|
|
9
9
|
import { format } from 'date-fns';
|
|
10
10
|
import he from 'he';
|
|
11
|
-
import Icon from '
|
|
11
|
+
import Icon from '../../../shared/components/icon';
|
|
12
12
|
import { PackagingAccommodationResponse } from '@qite/tide-client';
|
|
13
13
|
|
|
14
14
|
interface DayByDayExcursionsProps {}
|
|
@@ -87,21 +87,16 @@ const DayByDayExcursions: React.FC<DayByDayExcursionsProps> = () => {
|
|
|
87
87
|
<>
|
|
88
88
|
{stayDates.map((day) => {
|
|
89
89
|
const dayKey = format(day, 'yyyy-MM-dd');
|
|
90
|
-
const formattedDay = format(day, 'd');
|
|
91
|
-
const formattedMonth = format(day, 'MMM');
|
|
92
90
|
const confirmedExcursions = confirmedExcursionsByDay[dayKey] ?? [];
|
|
93
91
|
|
|
94
92
|
return (
|
|
95
93
|
<React.Fragment key={dayKey}>
|
|
96
94
|
<div className="search__results__label search__results__label--secondary">
|
|
97
95
|
<div className="search__results__label__date">
|
|
98
|
-
<
|
|
99
|
-
<p>{formattedMonth}</p>
|
|
96
|
+
<Icon name="ui-excursion" height={16} fill="white" />
|
|
100
97
|
</div>
|
|
101
98
|
<div className="search__results__label__text">
|
|
102
|
-
<h3>
|
|
103
|
-
{translations.SRP.SELECT} <strong>{translations.SRP.EXCURSION}</strong>
|
|
104
|
-
</h3>
|
|
99
|
+
<h3>{format(day, 'EEEE d MMMM', { locale: getLocale(context?.languageCode ?? 'en-GB') })}</h3>
|
|
105
100
|
</div>
|
|
106
101
|
</div>
|
|
107
102
|
|
|
@@ -3,7 +3,7 @@ import { Filter, FilterOption } from '../../types';
|
|
|
3
3
|
import MultiRangeFilter from '../multi-range-filter';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../search-results-configuration-context';
|
|
5
5
|
import Spinner from '../spinner/spinner';
|
|
6
|
-
import Icon from '
|
|
6
|
+
import Icon from '../../../shared/components/icon';
|
|
7
7
|
import { getTranslations } from '../../../shared/utils/localization-util';
|
|
8
8
|
|
|
9
9
|
interface FiltersProps {
|
|
@@ -2,7 +2,7 @@ import React, { useContext, useEffect, useState } from 'react';
|
|
|
2
2
|
import { ExtendedFlightSearchResponseItem, FilterValue } from '../../types';
|
|
3
3
|
import MultiRangeFilter from '../multi-range-filter';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../search-results-configuration-context';
|
|
5
|
-
import Icon from '
|
|
5
|
+
import Icon from '../../../shared/components/icon';
|
|
6
6
|
import { durationInTicksInMinutes, getTranslations, minutesToHoursString, rangeFromDateTimeInMinutes } from '../../../shared/utils/localization-util';
|
|
7
7
|
import { useFlightSearch } from '../flight/flight-search-context';
|
|
8
8
|
import { first, isEmpty, last, orderBy } from 'lodash';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useContext, useState } from 'react';
|
|
2
|
-
import Icon from '
|
|
2
|
+
import Icon from '../../../shared/components/icon';
|
|
3
3
|
import { BookingPackageFlight } from '@qite/tide-client';
|
|
4
4
|
import { parseISO, format } from 'date-fns';
|
|
5
5
|
import { useDispatch } from 'react-redux';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useContext, useState } from 'react';
|
|
2
2
|
import { durationTicksInHoursString, formatPrice, getTranslations, longFormatDate, timeFromDateTime } from '../../../../shared/utils/localization-util';
|
|
3
|
-
import Icon from '
|
|
3
|
+
import Icon from '../../../../shared/components/icon';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../../search-results-configuration-context';
|
|
5
5
|
import { getArrivalSegment, getDepartureSegment, getFlightSegments, getNumberOfStopsLabel } from '../../../utils/flight-utils';
|
|
6
6
|
import { FlightSearchResponseFlight } from '@qite/tide-client';
|
package/src/search-results/components/flight/flight-selection/independent-flight-selection.tsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useContext, useEffect, useState } from 'react';
|
|
2
|
-
import Icon from '
|
|
2
|
+
import Icon from '../../../../shared/components/icon';
|
|
3
3
|
import { ExtendedFlightSearchResponseItem } from '../../../types';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../../search-results-configuration-context';
|
|
5
5
|
import { getTranslations } from '../../../../shared/utils/localization-util';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useContext, useState } from 'react';
|
|
2
2
|
import { durationTicksInHoursString, formatPrice, getTranslations, longFormatDate, timeFromDateTime } from '../../../../shared/utils/localization-util';
|
|
3
|
-
import Icon from '
|
|
3
|
+
import Icon from '../../../../shared/components/icon';
|
|
4
4
|
import { ExtendedFlightSearchResponseItem } from '../../../types';
|
|
5
5
|
import SearchResultsConfigurationContext from '../../../search-results-configuration-context';
|
|
6
6
|
import { getArrivalSegment, getDepartureSegment, getFlightSegments, getNumberOfStopsLabel } from '../../../utils/flight-utils';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
|
-
import Icon from '
|
|
2
|
+
import Icon from '../../../../shared/components/icon';
|
|
3
3
|
import { ExtendedFlightSearchResponseItem } from '../../../types';
|
|
4
4
|
import SearchResultsConfigurationContext from '../../../search-results-configuration-context';
|
|
5
5
|
import { getTranslations } from '../../../../shared/utils/localization-util';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
|
-
import Icon from '
|
|
2
|
+
import Icon from '../../../shared/components/icon';
|
|
3
3
|
import { BookingPackageItem } from '@qite/tide-client';
|
|
4
4
|
import { format } from 'date-fns';
|
|
5
5
|
import { calculateDays, calculateNights, formatPrice, getTranslations } from '../../../shared/utils/localization-util';
|
|
@@ -9,7 +9,7 @@ import { format, parseISO } from 'date-fns';
|
|
|
9
9
|
import { calculateNights, formatPrice, getTranslations } from '../../../shared/utils/localization-util';
|
|
10
10
|
import SearchResultsConfigurationContext from '../../search-results-configuration-context';
|
|
11
11
|
import { first } from 'lodash';
|
|
12
|
-
import Icon from '
|
|
12
|
+
import Icon from '../../../shared/components/icon';
|
|
13
13
|
import { setFlyInIsOpen, setFlyInType } from '../../store/search-results-slice';
|
|
14
14
|
|
|
15
15
|
interface HotelAccommodationResultsProps {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { HotelResult } from '../../types';
|
|
3
|
-
import Icon from '
|
|
3
|
+
import Icon from '../../../shared/components/icon';
|
|
4
4
|
import { useDispatch, useSelector } from 'react-redux';
|
|
5
5
|
import { SearchResultsRootState } from '../../store/search-results-store';
|
|
6
6
|
import { setSelectedPackagingAccoResult } from '../../store/search-results-slice';
|
|
@@ -2,7 +2,7 @@ import React, { useContext, useMemo } from 'react';
|
|
|
2
2
|
import { differenceInCalendarDays, format } from 'date-fns';
|
|
3
3
|
import { first, groupBy, isEmpty, last } from 'lodash';
|
|
4
4
|
import { PackagingEntryLine, PackagingEntryLineFlightLine } from '@qite/tide-client';
|
|
5
|
-
import Icon from '
|
|
5
|
+
import Icon from '../../../shared/components/icon';
|
|
6
6
|
import SearchResultsConfigurationContext from '../../search-results-configuration-context';
|
|
7
7
|
import { formatPrice, getTranslations } from '../../../shared/utils/localization-util';
|
|
8
8
|
import { useSelector } from 'react-redux';
|