@autobusal/common 1.33.2 → 1.33.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 1.33.3
+
+### Added
+
+- **`RouteItem` shows a "from" price** next to the route name/code - the lowest fare across the route's own `prices`, using the row's own pre-formatted `adult_display` (same currency/decimal convention as everywhere else). Both `browse` and `view` modes get it; a route with no prices at all shows nothing, same as it always could.
+
 ## 1.33.2
 
 ### Added

package/RouteItem/RouteItem.tsx

@@ -2,7 +2,7 @@ import { useState } from 'react';
 import { TFunction } from 'i18next';
 import { HiOutlineInformationCircle, HiOutlineClock, HiArrowCircleRight } from 'react-icons/hi';
 import More from './More/More';
-import { Container, About, Image, Logo, Information, Name, Code, ButtonMore, Locations, Location, City, Iso, Date, Arrow, Order, LinkOrder } from './styles';
+import { Container, About, Image, Logo, Information, Name, Code, Price, ButtonMore, Locations, Location, City, Iso, Date, Arrow, Order, LinkOrder } from './styles';
 import { RouteData } from '@autobusal/providers/types/routes';
 
 interface Props {
@@ -16,6 +16,19 @@ const RouteItem = ({ type, route, t }: Props): JSX.Element => {
 
   const lastLocation = route.locations.length - 1;
 
+  // Edited: Ferjolt Ozuni - Date: 2026-08-11
+  // The cheapest fare on this route, same "from" semantics as everywhere
+  // else a lowest price is shown (Facts.price_from, results-page cards) -
+  // `prices` is one row per from/to leg the route sells, not one row for
+  // the whole journey, so the honest "from" figure is the minimum across
+  // all of them. Uses the row's OWN `adult_display` rather than
+  // reformatting `adult` itself - the server already applied this label's
+  // currency symbol/decimal convention, and re-deriving that here would
+  // risk disagreeing with every other price on the site.
+  const cheapest = route.prices.length > 0
+    ? route.prices.reduce((min, price) => (price.adult < min.adult ? price : min))
+    : null;
+
   return (
     <Container className="box">
       <About>
@@ -30,6 +43,8 @@ const RouteItem = ({ type, route, t }: Props): JSX.Element => {
 
           <Code>{ route.code }</Code>
 
+          { cheapest && <Price>{ t('route_item.price_from', { price: cheapest.adult_display }) }</Price> }
+
           <ButtonMore type="button" onClick={ () => setShow(!show) }>
             <HiOutlineInformationCircle />
             { t('route_item.info') }

package/RouteItem/styles.ts

@@ -60,6 +60,12 @@ export const Code = styled.div`
   font-size: ${ props => props.theme.size.xs };
 `;
 
+export const Price = styled.div`
+  font-weight: 700;
+  color: ${ props => props.theme.primary.normal };
+  font-size: ${ props => props.theme.size.s };
+`;
+
 export const ButtonMore = styled.button`
   display: flex;
   align-items: center;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autobusal/common",
-  "version": "1.33.2",
+  "version": "1.33.3",
   "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"