Skip to content

Commit dc2a26a

Browse files
author
Herve Tribouilloy
committed
Removed modals + refine style
1 parent 4d61801 commit dc2a26a

30 files changed

Lines changed: 248 additions & 114 deletions

‎vite_project/activity/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export function activity(
2424
if (!isActivityEnabled()) return;
2525

2626
const payload = {
27-
widget: 'contact',
27+
widget: 'booking',
2828
phase,
2929
message,
3030
data,

‎vite_project/index.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,4 +23,8 @@
2323
}
2424
</script>
2525

26+
<div id="security-gate" class="hidden">
27+
<div class="security-veil"></div>
28+
<div id="booking-turnstile"></div>
29+
</div>
2630
</body>

‎vite_project/package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎vite_project/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "widget-booking",
33
"private": true,
4-
"version": "0.1.1",
4+
"version": "0.1.4",
55
"type": "module",
66
"scripts": {
77
"dev": "vite",

‎vite_project/src/BookingSystemWidget.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,23 @@
11
import {BookingSystemWrapper} from "./components/BookingSystemWrapper.tsx";
22
import {useWidgetConfig} from "./hooks/useWidgetConfig.ts";
33
import {SystemStateProvider} from "./state/System/SystemStateProvider.tsx";
4+
import {activity} from "../activity";
45

56
type Props = {
67
host: HTMLElement;
78
};
89

910
export function BookingSystemWidget({ host }: Props) {
10-
const config = useWidgetConfig(host);
11+
const widgetConfig = useWidgetConfig(host);
1112

12-
if (!config) {
13-
console.warn('[ContactUs] Widget is not correctly configured');
13+
if (!widgetConfig) {
14+
activity('bootstrap', '[ContactUs] Widget is not correctly configured', null, 'warn');
1415
return null;
1516
}
1617

1718
return (
18-
<SystemStateProvider config={config}>
19-
<BookingSystemWrapper venueId={config.venueId} />
19+
<SystemStateProvider config={widgetConfig}>
20+
<BookingSystemWrapper venueId={widgetConfig.venueId} />
2021
</SystemStateProvider>
2122
);
2223
}

‎vite_project/src/components/BookingSystemWrapper.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,11 +28,12 @@ export function BookingSystemWrapper({venueId}: Props) {
2828
} = useEventTypeGroups(venue?.id);
2929

3030
if (venueError || hostsError || eventTypeGroupError) {
31+
activity('bootstrap', 'Keystone data cannot be returned', null, 'error');
3132
return <ErrorState />;
3233
}
3334

3435
if (!venue || !eventHosts || !groups) {
35-
activity('config-load', 'Config Data not loaded',{venue, eventHosts, groups});
36+
activity('config-load', 'Keystone Data not loaded',{venue, eventHosts, groups});
3637
return <Spinner />;
3738
}
3839

‎vite_project/src/components/InitFilter.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {useConfigState} from "../state/Config/useConfigState.ts";
66
import {getVisitIntentStep} from "../domain/intent/getVisitIntentStep.ts";
77
import type {Venue} from "../types/domain/types.ts";
88
import {HostPreference} from "./HostPreference.tsx";
9+
import {activity} from "../../activity";
910

1011
export function InitFilter() {
1112
const { config } = useConfigState();
@@ -20,6 +21,8 @@ export function InitFilter() {
2021
}
2122
const venue = config?.venue as Venue
2223

24+
activity('init-filter', 'Init Filter',{visitIntentStep, selections});
25+
2326
return (
2427
<div className="booking-init">
2528
<h2 className="booking-title">

‎vite_project/src/components/event/Dashboard/DayEvent/AddToCart.tsx‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,9 @@ import {useEventState} from "../../../../state/Event/useEventState.ts";
66
import {useVisitIntentState} from "../../../../state/Intent/useVisitIntentState.ts";
77
import {useAddToCart} from "../../../../hooks/domain/useAddToCart.tsx";
88
import {useDashboardState} from "../../../../state/Dashboard/useDashboardState.ts";
9-
import {getCloudflareSiteKey} from "../../../../security/turnstileService.ts";
109
import {Turnstile} from "../../../../security/Turnstile.tsx";
10+
import {useSystemState} from "../../../../state/System/useSystemState.ts";
11+
import {activity} from "../../../../../activity";
1112

1213
interface AddToCartProps {
1314
onRequireAuth: () => void
@@ -19,7 +20,7 @@ export function AddToCart({onRequireAuth}: AddToCartProps) {
1920
const { visitIntent } = useVisitIntentState();
2021
const { addToCart, loadingAddToCart, errorAddToCart } = useAddToCart();
2122
const { increaseVersionNumber, setLastBookedEventId } = useDashboardState();
22-
const turnstileEnabled = Boolean(getCloudflareSiteKey());
23+
const { cloudflareKey, isTurnstileEnabled } = useSystemState()
2324
const [verifiedAt, setVerifiedAt] = useState<number | null>(null);
2425
const [awaitingSecurity, setAwaitingSecurity] = useState(false);
2526
const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
@@ -29,6 +30,13 @@ export function AddToCart({onRequireAuth}: AddToCartProps) {
2930
verifiedAt &&
3031
Date.now() - verifiedAt < 1000 * 90; // 90s safety window
3132

33+
activity('add-to-cart', 'Add To Cart Data',{
34+
cloudflareKey,
35+
turnstileToken,
36+
turnstileEnabled: isTurnstileEnabled(),
37+
isHumanVerified
38+
});
39+
3240
const refreshDashboard = () => {
3341
increaseVersionNumber()
3442
if (eventState.activeEventId) setLastBookedEventId(eventState.activeEventId)
@@ -126,9 +134,9 @@ export function AddToCart({onRequireAuth}: AddToCartProps) {
126134
>
127135
Book{loadingAddToCart && 'ing'} appointment+-
128136
</button>
129-
{turnstileEnabled && (
137+
{isTurnstileEnabled() && (
130138
<Turnstile
131-
siteKey={getCloudflareSiteKey()}
139+
siteKey={cloudflareKey}
132140
containerId="booking-turnstile"
133141
/>
134142
)}

‎vite_project/src/components/event/Dashboard/DayEvent/DayEventGroup.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ import {EventStateProvider} from "../../../../state/Event/EventStateProvider.tsx
44
import {getTime} from "../../../../lib/date.ts";
55
import {useDashboardState} from "../../../../state/Dashboard/useDashboardState.ts";
66
import {EventHostView} from "./EventHostView.tsx";
7+
import {useGroupEventState} from "../../../../state/GroupEvent/useGroupEventState.ts";
8+
import {isGroupEventActive} from "../../../../domain/event/getGroupEventStatus.ts";
9+
import {DrawerContent} from "../WeekEvents/DrawerContent.tsx";
10+
import {BookingDrawer} from "../../../BookingDrawer.tsx";
711

812
interface ListingProps {
913
eventGroup: DayGroupEvent;
@@ -12,6 +16,7 @@ interface ListingProps {
1216

1317
export const DayEventGroup: React.FC<ListingProps> = ({ eventGroup, onView }) => {
1418
const { dashboardState } = useDashboardState();
19+
const { groupEventState, resetActiveGroupEvent } = useGroupEventState();
1520

1621
const highlight = () => {
1722
if (dashboardState.lastBookedEventId === null) return false;
@@ -35,6 +40,17 @@ export const DayEventGroup: React.FC<ListingProps> = ({ eventGroup, onView }) =>
3540
</div>
3641

3742
<SetEventDetail eventGroup={eventGroup} onView={onView}/>
43+
{isGroupEventActive(groupEventState, eventGroup) && (
44+
<BookingDrawer open={!!eventGroup.eventIds}
45+
onClose={() => {
46+
resetActiveGroupEvent();
47+
}}
48+
>
49+
{eventGroup.eventIds && (
50+
<DrawerContent eventIds={eventGroup.eventIds}/>
51+
)}
52+
</BookingDrawer>
53+
)}
3854
</div>
3955
</EventStateProvider>
4056
);

‎vite_project/src/components/event/Dashboard/DayEvent/EventBookingForm.tsx‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import {getEventDateTime, getEventType} from "../../../../domain/formatters/getEventType.ts";
2+
import {EventHostSelect} from "./EventHostSelect.tsx";
3+
import {EventEndTime} from "./EventEndTime.tsx";
4+
import type {DayGroupEvent} from "../../../../types/domain/dashboard.type.tsx";
5+
import {useVenueTranslation} from "../../../../hooks/ui/useVenueTranslation.ts";
6+
7+
interface ViewEventBookingProps {
8+
groupEvent: DayGroupEvent
9+
}
10+
11+
export function EventBookingForm({groupEvent}: ViewEventBookingProps) {
12+
const t = useVenueTranslation();
13+
14+
return (<>
15+
<div className="drawer-section">
16+
<div className="drawer-summary">
17+
<strong>{getEventType(groupEvent)}</strong>
18+
<p>{getEventDateTime(groupEvent)}</p>
19+
</div>
20+
</div>
21+
22+
<div className="drawer-section">
23+
<label className="drawer-label">{t("Event host")}</label>
24+
<EventHostSelect eventGroup={groupEvent}/>
25+
</div>
26+
27+
{/*{config.offerShampoo && (
28+
<div className="view-group-event__row">
29+
<span className="view-group-event__label">
30+
{t("Shampoo")}
31+
</span>
32+
<ShampooSelect/>
33+
</div>
34+
)}*/}
35+
36+
<div className="drawer-section drawer-outcome">
37+
<span className="drawer-label">{t("End at")}</span>
38+
<strong><EventEndTime/></strong>
39+
</div>
40+
41+
{/*{config.showPrice && (*/}
42+
{/* <div className="view-group-event__row">*/}
43+
{/* <span className="view-group-event__label">*/}
44+
{/* {t("Price")}*/}
45+
{/* </span>*/}
46+
{/* <EventPrice/>*/}
47+
{/* </div>*/}
48+
{/*)}*/}
49+
</>)
50+
}

0 commit comments

Comments
 (0)