# NEXTSTEPS — TIDESUPP-75 / Booking-product & wizard rework > **Delete this file when the items below are resolved.** It is a scratch handoff doc, not permanent repo documentation. Code work is complete and committed across this branch (`feature/product-component-some-rework-other-service-types`). The items below are what a human needs to do before this merges to master. --- ## 1. Install lint-staged (one command, blocks commits if skipped) The new pre-commit hook in `.husky/pre-commit` calls `npx lint-staged`, but the package isn't yet a dependency. Pin to v15 because v16+ requires Node 20.12+ and our `.nvmrc` is 20.10. ```bash npm install --save-dev lint-staged@^15 ``` Verify by making a small commit. Expected behavior: prettier runs only on the files you changed, working tree stays clean afterwards. If it goes haywire, revert `.husky/pre-commit` and the `lint-staged` block in `package.json` from git history. ## 2. End-to-end test against a real Tide office The booking-product changes (`disableRooms`, `mainIcon`, `customTranslationsUrl`) haven't been tested against the actual Tide booking API for a non-package product (course, rental, excursion). Steps: 1. Pick a Tide office configured with a non-accommodation product. 2. Configure the self-contained build in a host page (or use `selfcontained/booking-product/index.html` directly with the right API key). 3. Set `disableRooms`, an appropriate `mainIcon` (e.g. `ui-excursion`), and `customTranslationsUrl` pointing at a customer-rebranded JSON file. 4. Confirm: - Booking submits successfully end-to-end - The price reflects pax count correctly even with the room scaffolding hidden - All translation overrides are visible in the rendered UI (no flash of default copy) Same exercise for the booking-wizard with `customTranslationsUrl`. ## 3. Visual QA across the affected screens Click through every page in the playground (`/`, `/boeken`, `/product`, search-results pages) and confirm nothing layout-broke from the `Rooms` component changes. Particularly: - The `disableRooms` path on the product page: adults/children inputs still aligned, age-of-children selector still appears when children > 0. - The wizard summary and sidebar still render correctly with the `SHARED.ROOM / ROOMS` translation overrides in effect. ## 4. Translation file completeness The example files at `playground/public/translations/{en-GB,nl-BE}.json` and `selfcontained/booking-product/translations/en-GB.json` only override 5–6 keys (the ones relevant for the demo). If the first real customer wants a fuller rebrand, they'll need a more complete override. Worth pre-emptively documenting the full set of overrideable keys for them — start from `src/shared/translations/en-GB.json`. ## 5. Confirm `{bookingNr}` placeholder behaviour with Tide backend (TIDE-3053 follow-up) Not strictly part of this ticket, but the booking-wizard payment URL work from the previous branch is gated on this answer: > Does Tide's booking API substitute a `{bookingNr}` token (or similar) in the `redirectUrl` we send, or does it pass the URL through verbatim? If the answer is "verbatim", the wizard's existing `bookingNr`-on-return resume logic won't work for PSP-driven flows and we need a different design. ## 6. Optional: extend the same `customTranslationsUrl` pattern to search-results Search-results' booking entry (`src/search-results/components/book-packaging-entry/index.tsx`) has its own `generatePaymentUrl` and unconditional `window.location.href = paymentUrl`. For consistency it could get the same `tide-booking-payment-url` CustomEvent treatment as the wizard. Small follow-up, not blocking. ## 7. Items deliberately not done (carry-over for later) - **Vite migration off CRA**: discussed and explicitly deferred. Tracked separately. - **Icon component refactor**: the 1114-line switch statement is hard to extend. Quickest fix is to enable the existing `icons` sprite escape hatch (Icon component already supports it, line 16 just needs to read from settings context). ~15 min job. - **TypeScript declaration for `tide-booking-payment-url` event**: consumers see `e.detail` as `any`. A `.d.ts` augmenting `WindowEventMap` would fix it. - **Deep merge in `selectTranslations`**: currently a 2-level shallow merge. Sufficient for today's translation file shapes but breaks if anyone adds 3-level nesting. --- ## File index for the reviewer ### TIDESUPP-75 booking-product (already committed) - `selfcontained/booking-product/index.tsx` - `src/booking-product/components/product.tsx` (fetch + render gate) - `src/booking-product/components/rooms.tsx` (`disableRooms` branch) - `src/booking-product/components/header.tsx` (`mainIcon`) - `src/booking-product/components/{age-select,amount-input,dates,footer,list-view}.tsx` (one-line each) - `src/booking-product/types.ts` - `src/shared/utils/localization-util.ts` (`getTranslations` overload) - `playground/public/translations/en-GB.json` + `nl-BE.json` - `selfcontained/booking-product/translations/en-GB.json` - `playground/src/components/product-page.tsx` ### Booking-wizard `customTranslationsUrl` (already committed) - `src/booking-wizard/types.ts` - `src/booking-wizard/features/booking/booking-self-contained.tsx` - `src/booking-wizard/features/booking/booking.tsx` - `selfcontained/booking-wizard/index.tsx` - `playground/src/components/booking-page.tsx` ### Tooling (already committed) - `README.md`, `playground/README.md` (--legacy-peer-deps note) - `.prettierignore` - `package.json` (lint-staged config block + evaluation comment) - `.husky/pre-commit` (replaced with `npx lint-staged`) - `.gitignore` (added `.claude/`)