@autobusal/routes-order 1.38.1 → 1.39.0

package/Availability/Availability.tsx

@@ -1,4 +1,5 @@
 import { TFunction } from 'i18next';
+import { Link } from 'react-router-dom';
 import { NextDay } from '../Schedule/styles';
 import { Container, Heading, Lead, Wrap, Table, Time, Faded, Fare, Price, SeatsLeft, Book, Later, More, Updated } from './styles';
 import { LOW_SEATS, Day, Prepared } from './service';
@@ -27,6 +28,31 @@ interface Props {
  */
 export const VISIBLE = 7;
 
+/**
+ * Claude - 2026-09-25 (audit): the API builds each row's `url` for the
+ * partner/assistant feed - absolute, and tagged
+ * utm_source=busmagus-api&utm_medium=assistant. Rendered as-is on our own
+ * pair page, every "Book" click was a full page reload that credited our own
+ * visitors to the assistant channel. On this origin it becomes an in-app
+ * route with those two tags removed; any other origin keeps the plain link.
+ */
+const spaTarget = (url: string): string | null => {
+  try {
+    const parsed = new URL(url, window.location.href);
+
+    if (parsed.origin !== window.location.origin) {
+      return null;
+    }
+
+    parsed.searchParams.delete('utm_source');
+    parsed.searchParams.delete('utm_medium');
+
+    return parsed.pathname + parsed.search;
+  } catch {
+    return null;
+  }
+};
+
 /**
  * Real departures on real dates, for the next thirty days.
  *
@@ -113,7 +139,15 @@ const Availability = ({ id, data, t }: Props): JSX.Element => {
           </td>
 
           <td>
-            { row.url ? <Book href={ row.url }>{ t('routes_order.availability.book') }</Book> : null }
+            { row.url
+              ? (() => {
+                const to = spaTarget(row.url);
+
+                return to
+                  ? <Book as={ Link } to={ to }>{ t('routes_order.availability.book') }</Book>
+                  : <Book href={ row.url }>{ t('routes_order.availability.book') }</Book>;
+              })()
+              : null }
           </td>
         </tr>
       )) }

package/Facts/Facts.tsx

@@ -1,7 +1,7 @@
 import { TFunction } from 'i18next';
 import { Container, Heading, Grid, Fact, Label, Value, Note, Notice, Operators, Prose } from './styles';
 import { FactsData } from './types';
-import { DAYS, duration } from './questions';
+import { DAYS, duration, policies } from './questions';
 import { stopped, detail } from './service';
 
 interface Props {
@@ -80,7 +80,21 @@ const Facts = ({ id, facts, heading = 'h2', t }: Props): JSX.Element => {
   // A thin pair can have none of the four sentences below, and an empty
   // <Prose> is still a box with a top margin - a gap under the grid that
   // reads as something failing to load.
-  const prose = Boolean(countries || via || amenities || facts.operators.length > 0);
+  // Claude - 2026-09-26: the ticket / luggage / fare / speed sentences, the
+  // same strings the FAQ answers quote (see policies() in questions.ts). The
+  // "today" claims - cheapest day, fastest coach - are held back on a pair
+  // that has stopped running, exactly as the FAQ holds them back.
+  const stoppedRunning = Boolean(stopped(facts));
+
+  const sentences = policies(facts, t);
+
+  const fares = stoppedRunning ? null : [ sentences.cheapest, sentences.range ].filter(Boolean).join(' ') || null;
+
+  const fastest = stoppedRunning ? null : sentences.fastest;
+
+  const tickets = [ sentences.flex, sentences.baggage, sentences.eTicket ].filter(Boolean) as string[];
+
+  const prose = Boolean(countries || via || amenities || facts.operators.length > 0 || tickets.length > 0 || fares || fastest);
 
   const range = facts.duration_min !== null && facts.duration_max !== null
     ? (facts.duration_min === facts.duration_max
@@ -263,6 +277,12 @@ const Facts = ({ id, facts, heading = 'h2', t }: Props): JSX.Element => {
             </p>
           ) }
 
+          { tickets.map(line => <p key={ line }>{ line }</p>) }
+
+          { fares && <p>{ fares }</p> }
+
+          { fastest && <p>{ fastest }</p> }
+
           { facts.operators.length > 0 && (
             <Operators>
               { t('routes_order.facts.operators', { operators: facts.operators.join(', ') }) }

package/Facts/questions.ts

@@ -62,6 +62,115 @@ export const duration = (minutes: number, t: TFunction<'common'>): string => (
     : t('routes_order.facts.duration_value', { hours: Math.floor(minutes / 60), minutes: minutes % 60 })
 );
 
+/**
+ * The ticket, fare and speed sentences, built ONCE.
+ *
+ * Claude - 2026-09-26
+ *
+ * The facts block prints these and the FAQ answers quote them, so they are
+ * built here, beside the questions, for the reason this file exists: the
+ * FAQPage answer has to be the sentence on the page, character for
+ * character. Each one is null when its data is missing - and then neither
+ * the block nor the FAQ says anything about it.
+ *
+ * Same restraint as everything above. The Flexible Ticket sentence counts
+ * coaches ("3 of the 10") rather than claiming the pair; the notice window
+ * is a range when the operators differ; luggage is the least generous
+ * allowance on the pair (obtapi's min), so it holds on every coach; and a
+ * cheapest DAY is named only when obtapi found one - otherwise just the
+ * 30-day range is said.
+ */
+export interface PolicySentences {
+  flex: string | null
+  baggage: string | null
+  eTicket: string | null
+  cheapest: string | null
+  range: string | null
+  fastest: string | null
+}
+
+const hoursRange = (min: number | null, max: number | null): string | null => (
+  min === null || max === null ? null : (min === max ? String(min) : `${ min }–${ max }`)
+);
+
+export const policies = (facts: FactsData, t: TFunction<'common'>): PolicySentences => {
+  const policy = facts.policies;
+
+  const flex = (() => {
+    if (!policy) {
+      return null;
+    }
+
+    const offer = policy.flex;
+
+    if (!offer) {
+      return t('routes_order.facts.flex_none');
+    }
+
+    const price = offer.minimum > 0 && offer.minimum_display
+      ? t('routes_order.facts.flex_price', { percent: offer.percent, minimum: offer.minimum_display })
+      : t('routes_order.facts.flex_price_percent', { percent: offer.percent });
+
+    const lead = offer.coaches >= offer.of
+      ? t('routes_order.facts.flex_all', { price })
+      : t('routes_order.facts.flex_some', { price, coaches: offer.coaches, total: offer.of });
+
+    const refund = hoursRange(offer.refund_hours_min, offer.refund_hours_max);
+
+    const reschedule = hoursRange(offer.reschedule_hours_min, offer.reschedule_hours_max);
+
+    const notice = refund && reschedule
+      ? (refund === reschedule
+          ? t('routes_order.facts.flex_both', { hours: refund })
+          : `${ t('routes_order.facts.flex_cancel', { hours: refund }) } ${ t('routes_order.facts.flex_change_also', { hours: reschedule }) }`)
+      : (refund
+          ? t('routes_order.facts.flex_cancel', { hours: refund })
+          : (reschedule ? t('routes_order.facts.flex_change', { hours: reschedule }) : null));
+
+    return notice ? `${ lead } ${ notice }` : lead;
+  })();
+
+  const baggage = (() => {
+    const bags = policy?.baggage;
+
+    if (!bags || !bags.bags) {
+      return null;
+    }
+
+    if (bags.kg) {
+      return bags.bags === 1
+        ? t('routes_order.facts.baggage_single', { kg: bags.kg })
+        : t('routes_order.facts.baggage', { bags: bags.bags, kg: bags.kg });
+    }
+
+    return bags.bags === 1
+      ? t('routes_order.facts.baggage_single_no_kg')
+      : t('routes_order.facts.baggage_no_kg', { bags: bags.bags });
+  })();
+
+  const eTicket = policy ? t(`routes_order.facts.e_ticket_${ policy.e_ticket }`) : null;
+
+  const days = facts.cheapest && facts.cheapest.days.length > 0
+    ? facts.cheapest.days.map(day => t(`data.days.${ DAYS[day] }`)).join(', ')
+    : null;
+
+  const cheapest = days ? t('routes_order.facts.cheapest_days', { days }) : null;
+
+  const range = facts.cheapest
+    ? (facts.cheapest.max_display && facts.cheapest.max_display !== facts.cheapest.price_display
+        ? t('routes_order.facts.cheapest_range', { min: facts.cheapest.price_display, max: facts.cheapest.max_display })
+        : t('routes_order.facts.cheapest_flat', { price: facts.cheapest.price_display }))
+    : null;
+
+  const fastest = facts.fastest
+    ? (facts.fastest.departure && facts.fastest.operator
+        ? t('routes_order.facts.fastest', { duration: duration(facts.fastest.minutes, t), time: facts.fastest.departure, operator: facts.fastest.operator })
+        : t('routes_order.facts.fastest_short', { duration: duration(facts.fastest.minutes, t) }))
+    : null;
+
+  return { flex, baggage, eTicket, cheapest, range, fastest };
+};
+
 const questions = (facts: FactsData, t: TFunction<'common'>): Question[] => {
   const all: Question[] = [];
 
@@ -259,6 +368,42 @@ const questions = (facts: FactsData, t: TFunction<'common'>): Question[] => {
     });
   }
 
+  /**
+   * Claude - 2026-09-26
+   *
+   * Tickets, luggage, the cheapest day and the fastest coach - the
+   * questions asked after "how long" and "how much". Answers are the
+   * sentences policies() builds for the facts block, so the two cannot
+   * drift. Asked only when obtapi sent the data (older cache entries carry
+   * no `policies`), and the cheapest-day and fastest questions - present
+   * tense claims about running coaches - not on a pair that has stopped.
+   */
+  const said = policies(facts, t);
+
+  if (said.flex) {
+    all.push({ id: 'flex', q: t('routes_order.facts.faq_flex_q', cities), a: said.flex });
+  }
+
+  if (said.baggage) {
+    all.push({ id: 'baggage', q: t('routes_order.facts.faq_baggage_q', cities), a: said.baggage });
+  }
+
+  if (said.eTicket) {
+    all.push({ id: 'e_ticket', q: t('routes_order.facts.faq_e_ticket_q', cities), a: said.eTicket });
+  }
+
+  if (said.cheapest && !dead) {
+    all.push({
+      id: 'cheapest',
+      q: t('routes_order.facts.faq_cheapest_q', cities),
+      a: said.range ? `${ said.cheapest } ${ said.range }` : said.cheapest
+    });
+  }
+
+  if (said.fastest && !dead) {
+    all.push({ id: 'fastest', q: t('routes_order.facts.faq_fastest_q', cities), a: said.fastest });
+  }
+
   if (facts.distance) {
     all.push({
       id: 'distance',

package/Facts/types.ts

@@ -119,6 +119,53 @@ export interface FactsData {
   distance: { road: number | null, approx: number } | null
   // every service on the pair, sorted by departure - Tier 3.3
   schedule: ScheduleRow[]
+  /**
+   * Claude - 2026-09-26
+   *
+   * What a ticket on this pair lets you do. Tickets are non-refundable by
+   * default; `flex` is the Flexible Ticket add-on where the pair's operators
+   * sell it - see FactsPolicies. OPTIONAL like `service`: warm six-hour cache
+   * entries from before this field existed do not carry it, and absent means
+   * the page says nothing rather than "not available".
+   */
+  policies?: FactsPolicies
+  /**
+   * Claude - 2026-09-26
+   *
+   * Real fares over the next 30 days. `days` is the ISO weekdays that are
+   * cheaper than the rest, EMPTY when no weekday is - and then there is no
+   * "cheapest day" to name. `price_display`/`max_display` are the range.
+   */
+  cheapest?: { days: number[], price: number, price_display: string, max_display: string | null } | null
+  // Claude - 2026-09-26: the quickest scheduled coach on the pair
+  fastest?: { minutes: number, departure: string | null, operator: string | null } | null
+}
+
+/**
+ * Claude - 2026-09-26
+ *
+ * `flex`: priced max(percent of the fare, minimum) per passenger, and buys
+ * the right to cancel (refund) or change (reschedule) up to a notice window
+ * before departure. The windows are per operator, so each is a min-max
+ * range across the pair's coaches, and `coaches` of `of` sell it at all.
+ *
+ * `baggage` is the smallest allowance across the pair (so it holds on every
+ * coach), `e_ticket` whether a phone ticket is accepted on all, some or none.
+ */
+export interface FactsPolicies {
+  flex: {
+    percent: number
+    minimum: number
+    minimum_display: string | null
+    refund_hours_min: number | null
+    refund_hours_max: number | null
+    reschedule_hours_min: number | null
+    reschedule_hours_max: number | null
+    coaches: number
+    of: number
+  } | null
+  baggage: { bags: number | null, kg: number | null } | null
+  e_ticket: 'all' | 'some' | 'none'
 }
 
 export interface ScheduleRow {

package/Found/Dates/Dates.tsx

@@ -176,6 +176,8 @@ const Dates = ({ type, step1, t, onSearch }: Props): JSX.Element => {
           size="small"
           noMargin
           text={ <AiOutlineCaretLeft /> }
+          // Claude - 2026-09-25 (audit): icon-only, so name it for screen readers
+          ariaLabel={ t('routes_order.step2.dates.previous') }
           onClick={ onPrevious }
         />
 
@@ -186,6 +188,7 @@ const Dates = ({ type, step1, t, onSearch }: Props): JSX.Element => {
           size="small"
           noMargin
           text={ <AiOutlineCaretRight /> }
+          ariaLabel={ t('routes_order.step2.dates.next') }
           onClick={ onNext }
         />
       </Inner>

package/Links/styles.ts

@@ -1,5 +1,7 @@
 import styled from 'styled-components';
-import { Link } from 'react-router-dom';
+// Claude - 2026-09-26: LocalLink - on a localised page (/sq/...) these
+// internal links stay in that language
+import { LocalLink } from '@autobusal/common';
 
 export const Container = styled.section`
   margin-top: 25px;
@@ -29,7 +31,7 @@ export const List = styled.ul`
  * A real router Link, not a styled div with a click handler - the entire
  * point of these blocks is that a crawler follows them.
  */
-export const Item = styled(Link)`
+export const Item = styled(LocalLink)`
   display: inline-block;
   padding: 6px 12px;
   border-radius: ${ props => props.theme.borderRadius };
@@ -59,7 +61,7 @@ export const Reverse = styled.div`
   border-bottom: 1px solid ${ props => props.theme.background.neutral };
 `;
 
-export const ReverseLink = styled(Link)`
+export const ReverseLink = styled(LocalLink)`
   display: inline-block;
   padding: 8px 16px;
   border-radius: ${ props => props.theme.borderRadius };

package/RoutesOrder.tsx

@@ -432,7 +432,10 @@ const RoutesOrder = ({ t }: Props): JSX.Element => {
         <Step1
           value={ step1 }
           redirected={ redirected }
-          heading={ subject ? 'h2' : 'h1' }
+          // Claude - 2026-09-25 (audit): not a heading at all on the pair page -
+          // as an h2 it still sat ABOVE the facts h1, so the document outline
+          // opened on a second-level heading (an icon plus "Search Schedules")
+          heading={ subject ? 'div' : 'h1' }
           t={ t }
           onSave={ onStep1 }
         />

package/Step1/Step1.tsx

@@ -22,8 +22,12 @@ interface Props {
    * /bus-lines/{from}/{to} page named "Search Schedules" to crawlers and
    * screen readers alike. RoutesOrder decides, because it is the one place
    * that knows whether the facts block is going to render.
+   *
+   * Claude - 2026-09-25 (audit): 'div' added - the pair page's form label is
+   * no heading at all now (an h2 before the page's h1 broke the outline);
+   * Title carries the heading look itself so it renders the same.
    */
-  heading?: 'h1' | 'h2'
+  heading?: 'h1' | 'h2' | 'div'
   t: TFunction<'common'>
   onSave: (data: RoutesSearchForm) => void
 }

package/package.json

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

package/styles.ts

@@ -10,6 +10,15 @@ export const Title = styled.h1`
    * document-outline decision, not a request for a smaller heading.
    */
   font-size: ${ props => props.theme.size.xxl };
+  /*
+   * Claude - 2026-09-25 (audit): the global h1-h6 rules, restated, because
+   * the pair page now renders this as a <div> (not a heading - see Step1's
+   * heading prop) and it must look exactly like the h1 it is elsewhere.
+   */
+  margin: 0 0 20px 0;
+  font-weight: 700;
+  line-height: ${ props => props.theme.lineHeight.title };
+  font-family: ${ props => props.theme.fontFamily.title }, sans-serif;
 `;
 
 export const SubTitle = styled.h3`