@autobusal/routes-order 1.23.5 → 1.25.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## 1.25.0
+
+**Reviews on the route-pair page.** A new section between the timetable and the internal links, with its own nav anchor.
+
+Renders nothing below the display threshold, so a pair without enough reviews does not gain an empty box.
+
+## 1.24.0
+
+**The booking wizard has real URLs.** The step now lives in the URL and `current` is derived from it, rather than the reverse.
+
+Before: the wizard held the step in component state and never touched the address bar, so the URL still said "search" while the buyer was on checkout. Nothing in the flow was shareable, a refresh dropped you back to the search, and Back did not step back through the wizard — it left it entirely, because no step had ever created a history entry.
+
+- A **search param** (`?step=checkout` / `?step=return`), not a path segment. `/bus-lines/:from/:to` is a crawlable page in the sitemap, and child routes would put near-identical URLs in front of a crawler for what is UI state. The search spec is already in the path on the 9-segment route, so between the two the whole position is in the URL.
+- **Guards, not a lookup.** A step is honoured only when the state it needs exists: a cold `?step=checkout` has no chosen route, so it falls back to results and clears the stale param rather than rendering half a screen.
+
+**Bug fixed on the way.** `Checkout` chose its back target with `step1._return ? 3 : 2`. On the 9-segment URL a one-way trip carries the literal segment `none` as its return date — a truthy string — so **every one-way booking's Back button aimed at the return-leg step**, which that booking does not have. Now keyed on `step1.type`, and guarded again in `onBack` so a step nobody can honour never reaches the URL.
+
+Verified: results → checkout writes the param; browser Back and Forward move between them; the in-page Back returns to results; a cold checkout URL falls back; and eight back/forward transitions produced no blank frame and no console error.
+
 ## 1.23.5
 
 **The operator cell centres its contents at every width.** LinkCompany already carried an auto horizontal margin, so the logo was centred in the cell whatever the screen - but the rating and the route code sat at flex-start, under the left edge of a box whose logo was in the middle of it. On a 768px card that was a ~300px gap between the logo and the code below it.

package/Checkout/Checkout.tsx

@@ -290,7 +290,12 @@ const Checkout = ({ values, step1, step2, step3, isPartner, t, onStore, onBack }
               // than coming back to an empty one
               onStore(passenger.getValues());
 
-              onBack(step1._return ? 3 : 2);
+              // Edited: Ferjolt Ozuni - Date: 2026-08-03
+              // `type`, not `_return`. On the 9-segment search URL a one-way
+              // trip carries the literal segment "none" as its return date,
+              // which is a truthy string - so this always chose the
+              // return-leg step, even for a booking that has no return leg.
+              onBack(step1.type === 'return' ? 3 : 2);
             } }
           />
         </Actions>

package/RoutesOrder.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { useParams } from 'react-router-dom';
+import { useParams, useSearchParams } from 'react-router-dom';
 import { TFunction } from 'i18next';
 import { AiOutlineSearch, AiOutlineCaretDown, AiOutlineCaretUp } from 'react-icons/ai';
 import { Meta } from '@autobusal/common';
@@ -54,12 +54,74 @@ const RoutesOrder = ({ t }: Props): JSX.Element => {
 
   const [ searchOpen, setSearchOpen ] = useState<boolean>(false);
   const [ redirected, setRedirected ] = useState<boolean>(false);
-  const [ current, setCurrent ] = useState<number>(1);
   const [ step1, setStep1 ] = useState<RoutesSearchForm | undefined>(undefined);
   const [ step2, setStep2 ] = useState<FoundData | undefined>(undefined);
   const [ step3, setStep3 ] = useState<FoundData | undefined>(undefined);
   const [ step4, setStep4 ] = useState<PersonData | undefined>(undefined);
 
+  /**
+   * Edited: Ferjolt Ozuni - Date: 2026-08-03
+   *
+   * THE STEP LIVES IN THE URL, and `current` is derived from it - not the
+   * other way round. The wizard held the step in component state and never
+   * touched the address bar, so the URL still said "search" while the buyer
+   * was on the checkout screen. Nothing in the flow was shareable, a refresh
+   * dropped you back to the search, and Back did not step back through the
+   * wizard - it left it entirely, because no step had ever created a history
+   * entry.
+   *
+   * A SEARCH PARAM rather than a path segment, deliberately. The pair page
+   * /bus-lines/:from/:to is a crawlable page in the sitemap, and hanging
+   * child routes off it would put near-identical URLs in front of a crawler
+   * for what is UI state rather than content. The search spec itself is
+   * already in the path on the 9-segment route, so between the two the whole
+   * position is in the URL.
+   *
+   * THE GUARDS ARE THE POINT. A step is only honoured when the state it
+   * needs actually exists - arriving at ?step=checkout in a fresh tab has no
+   * chosen route to check out, so it falls back to the results rather than
+   * rendering half a screen. That is why this reads as a chain of conditions
+   * and not a lookup.
+   */
+  const [ searchParams, setSearchParams ] = useSearchParams();
+
+  const step = searchParams.get('step');
+
+  const current = (() => {
+    if (step === 'checkout' && step1 !== undefined && step2 !== undefined) {
+      return 4;
+    }
+
+    if (step === 'return' && step1 !== undefined && step2 !== undefined) {
+      return 3;
+    }
+
+    // A search has run, so the results are the honest screen to be on -
+    // whether the step param says so, names something we cannot honour, or
+    // is absent because the URL carried a complete search spec of its own.
+    return step1 !== undefined ? 2 : 1;
+  })();
+
+  /**
+   * Move to a step, leaving a history entry so Back returns here.
+   *
+   * `replace` for the screen a search lands on: a search is not somewhere a
+   * buyer chose to go back to mid-flow, it is where they already are.
+   */
+  const goto = (to: (string | null), replace = false): void => {
+    setSearchParams(previous => {
+      const next = new URLSearchParams(previous);
+
+      if (to === null) {
+        next.delete('step');
+      } else {
+        next.set('step', to);
+      }
+
+      return next;
+    }, { replace });
+  };
+
   const onSearchDate = (type: ('departure' | '_return'), day: string): void => {
     if (step1 !== undefined) {
       setStep1({
@@ -71,7 +133,7 @@ const RoutesOrder = ({ t }: Props): JSX.Element => {
 
   const onStep1 = (data: RoutesSearchForm): void => {
     setStep1(data);
-    setCurrent(2);
+    goto(null, true);
 
     // we mark it as redirected
     setRedirected(true);
@@ -80,20 +142,30 @@ const RoutesOrder = ({ t }: Props): JSX.Element => {
   const onStep2 = (data: FoundData): void => {
     setStep2(data);
 
-    if (step1?.type === 'return') {
-      setCurrent(3);
-    } else {
-      setCurrent(4);
-    }
+    goto(step1?.type === 'return' ? 'return' : 'checkout');
   };
 
   const onStep3 = (data: FoundData): void => {
     setStep3(data);
-    setCurrent(4);
+
+    goto('checkout');
   };
 
-  const onBack = (step: number): void => {
-    setCurrent(step);
+  /**
+   * The in-page Back buttons, moving through the URL like the browser's own
+   * - so the two can never disagree about where the buyer is.
+   *
+   * The return step is only reachable on a booking that HAS a return leg.
+   * Guarded here as well as at the call site, on the same principle as
+   * `current` above: a step nobody can honour should never reach the URL,
+   * whoever asked for it.
+   */
+  const onBack = (to: number): void => {
+    if (to === 3 && step1?.type === 'return') {
+      return goto('return');
+    }
+
+    goto(to === 4 ? 'checkout' : null);
   };
 
   const showStep1 = current === 1;

package/Sections/Sections.tsx

@@ -2,6 +2,7 @@ import { TFunction } from 'i18next';
 import Facts from '../Facts/Facts';
 import Schedule from '../Schedule/Schedule';
 import Links from '../Links/Links';
+import { Reviews } from '@autobusal/reviews';
 import Schema from './Schema';
 import { useGetFacts } from '../Facts/services';
 import { Nav, Anchor, Anchored } from './styles';
@@ -16,6 +17,7 @@ const TRIPS = 'trips';
 const FACTS = 'facts';
 const SCHEDULE = 'schedule';
 const LINKS = 'links';
+const REVIEWS = 'reviews';
 
 /**
  * Everything on a route-pair page that is not the booking wizard.
@@ -63,6 +65,8 @@ const Sections = ({ from, to, t }: Props): (JSX.Element | null) => {
         { schedule.length > 0 && (
           <Anchor href={ `#${ SCHEDULE }` }>{ t('routes_order.sections.schedule') }</Anchor>
         ) }
+
+        <Anchor href={ `#${ REVIEWS }` }>{ t('routes_order.sections.reviews') }</Anchor>
       </Nav>
 
       { /* Edited: Ferjolt Ozuni - Date: 2026-08-03
@@ -78,6 +82,23 @@ const Sections = ({ from, to, t }: Props): (JSX.Element | null) => {
         <Schedule id={ SCHEDULE } from={ facts.from } to={ facts.to } rows={ schedule } t={ t } />
       </Anchored>
 
+      { /* Edited: Ferjolt Ozuni - Date: 2026-08-03
+           Reviews for the PAIR, not for one coach on it. A review belongs to
+           a route, but a single route rarely has enough published reviews to
+           clear the display threshold - the pair it runs on often does, so
+           aggregating across the routes that sell this leg is what makes the
+           block appear at all rather than a nicety.
+
+           Renders nothing below the threshold, so a pair without enough
+           reviews does not gain an empty box. */ }
+      <Anchored>
+        { /* the anchor lives on a wrapper: Reviews takes the SUBJECT's id,
+             which a pair does not have - it is named by its two ends */ }
+        <div id={ REVIEWS }>
+          <Reviews type="pair" id={ 0 } pair={ { from: from ?? '', to: to ?? '' } } t={ t } />
+        </div>
+      </Anchored>
+
       <Links
         id={ LINKS }
         from={ links.from }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autobusal/routes-order",
-  "version": "1.23.5",
+  "version": "1.25.0",
   "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"