Add configurable RouteNumber text limit in itinerary list.

HSLdevcom · Dec 20, 2024 · 6919af7 · 6919af7
1 parent d021588
commit 6919af7
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 15 deletions.
diff --git a/app/component/RouteNumber.js b/app/component/RouteNumber.js
@@ -12,15 +12,43 @@ const LONG_ROUTE_NUMBER_LENGTH = 6;
 
 function RouteNumber(props, context) {
   const mode = props.mode.toLowerCase();
-  const { alertSeverityLevel, color, withBicycle, withCar, text } = props;
+  const { alertSeverityLevel, color, withBicycle, withCar } = props;
   const isScooter = mode === TransportMode.Scooter.toLowerCase();
-  const textIsText = typeof text === 'string'; // can be also react node
+
+  // Perform text-related processing
+  let filteredText = props.text;
+  if (
+    props.isInItineraryList &&
+    context.config.disabledLegTextModes?.includes(mode) &&
+    props.className.includes('line')
+  ) {
+    filteredText = '';
+  }
+  const textFieldIsText = typeof filteredText === 'string'; // can be also react node
+  if (
+    props.isInItineraryList &&
+    context.config.shortenLongTextInItineraryListThreshold &&
+    filteredText &&
+    textFieldIsText &&
+    filteredText.length > context.config.shortenLongTextInItineraryListThreshold
+  ) {
+    filteredText = `${filteredText.substring(
+      0,
+      context.config.shortenLongTextInItineraryListThreshold - 3,
+    )}...`;
+  }
   const longText =
-    text && textIsText && text.length >= LONG_ROUTE_NUMBER_LENGTH;
+    filteredText &&
+    textFieldIsText &&
+    filteredText.length >= LONG_ROUTE_NUMBER_LENGTH;
   // Checks if route only has letters without identifying numbers and
   // length doesn't fit in the tab view
   const hasNoShortName =
-    text && textIsText && /^([^0-9]*)$/.test(text) && text.length > 3;
+    filteredText &&
+    textFieldIsText &&
+    /^([^0-9]*)$/.test(filteredText) &&
+    filteredText.length > 3;
+
   const getColor = () => color || (props.isTransitLeg ? 'currentColor' : null);
 
   const getIcon = (
@@ -140,7 +168,7 @@ function RouteNumber(props, context) {
             )}
           </div>
         )}
-        {text && (
+        {filteredText && (
           <div
             className={cx(
               'vehicle-number-container-v'.concat(props.card ? '-map' : ''),
@@ -158,10 +186,10 @@ function RouteNumber(props, context) {
               )}
               style={{ color: !props.withBar && getColor() }}
             >
-              {props.text}
+              {filteredText}
             </span>
-            {textIsText && (
-              <span className="sr-only">{text?.toLowerCase()}</span>
+            {textFieldIsText && (
+              <span className="sr-only">{filteredText?.toLowerCase()}</span>
             )}
           </div>
         )}
@@ -222,6 +250,7 @@ RouteNumber.propTypes = {
   card: PropTypes.bool,
   appendClass: PropTypes.string,
   occupancyStatus: PropTypes.string,
+  isInItineraryList: PropTypes.bool,
 };
 
 RouteNumber.defaultProps = {
@@ -245,6 +274,7 @@ RouteNumber.defaultProps = {
   color: undefined,
   duration: undefined,
   occupancyStatus: undefined,
+  isInItineraryList: false,
 };
 
 RouteNumber.contextTypes = {

diff --git a/app/component/RouteNumberContainer.js b/app/component/RouteNumberContainer.js
@@ -24,12 +24,8 @@ const RouteNumberContainer = (
       isCallAgency={isCallAgency}
       color={route.color ? `#${route.color}` : null}
       mode={mode !== undefined ? mode : route.mode}
-      text={
-        config.disabledLegTextModes?.includes(route.mode) &&
-        className.includes('line')
-          ? ''
-          : getLegText(route, config, interliningWithRoute)
-      }
+      text={getLegText(route, config, interliningWithRoute)}
+      isInItineraryList
       occupancyStatus={occupancyStatus}
       {...props}
     />

diff --git a/app/configurations/config.kela.js b/app/configurations/config.kela.js
@@ -156,4 +156,5 @@ export default {
   showCO2InItinerarySummary: false,
   useAssembledGeoJsonZones: 'isOnByDefault',
   locationSearchTargetsFromOTP: [], // remove stop/station location search
+  shortenLongTextInItineraryListThreshold: 10,
 };
diff --git a/app/configurations/config.matka.js b/app/configurations/config.matka.js
@@ -403,7 +403,7 @@ export default {
     FERRY: { showNotification: true },
   },
 
-  disabledLegTextModes: ['FERRY'],
+  disabledLegTextModes: ['ferry'],
 
   // Include both bike and park and bike and public, if bike is enabled
   includePublicWithBikePlan: true,