fix(sbb-journey-maps): remove obsolete dot after weekday

sbb-design-systems · Oct 12, 2023 · 26a5344 · 26a5344
1 parent 99118eb
commit 26a5344
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 41 deletions.
diff --git a/src/components/sbb-journey-summary/sbb-journey-summary.spec.ts b/src/components/sbb-journey-summary/sbb-journey-summary.spec.ts
@@ -53,14 +53,9 @@ describe('sbb-journey-summary', () => {
             </div>
             <div class="sbb-journey-summary__date">
               <span>
-                <span>
-                  Mon.
-                </span>
-                <span>
-                  <time datetime="29 8">
-                    29.08.2022
-                  </time>
-                </span>
+                <time datetime="29 8">
+                  Mo. 29.08.2022
+                </time>
               </span>
               <time>
                 <span class="sbb-screenreaderonly">
@@ -93,14 +88,9 @@ describe('sbb-journey-summary', () => {
           <div>
             <div class="sbb-journey-summary__date">
               <span>
-                <span>
-                  Mon.
-                </span>
-                <span>
-                  <time datetime="29 8">
-                    29.08.2022
-                  </time>
-                </span>
+                <time datetime="29 8">
+                  Mo. 29.08.2022
+                </time>
               </span>
               <time>
                 <span class="sbb-screenreaderonly">
@@ -135,14 +125,9 @@ describe('sbb-journey-summary', () => {
           <div>
             <div class="sbb-journey-summary__date">
               <span>
-                <span>
-                  Mon.
-                </span>
-                <span>
-                  <time datetime="29 8">
-                    29.08.2022
-                  </time>
-                </span>
+                <time datetime="29 8">
+                  Mo. 29.08.2022
+                </time>
               </span>
               <time>
                 <span class="sbb-screenreaderonly">
@@ -169,14 +154,9 @@ describe('sbb-journey-summary', () => {
               </div>
               <div class="sbb-journey-summary__date">
                 <span>
-                  <span>
-                    Mon.
-                  </span>
-                  <span>
-                    <time datetime="29 8">
-                      29.08.2022
-                    </time>
-                  </span>
+                  <time datetime="29 8">
+                    Mo. 29.08.2022
+                  </time>
                 </span>
                 <time>
                   <span class="sbb-screenreaderonly">

diff --git a/src/components/sbb-journey-summary/sbb-journey-summary.tsx b/src/components/sbb-journey-summary/sbb-journey-summary.tsx
@@ -3,7 +3,11 @@ import { InterfaceSbbJourneySummaryAttributes } from './sbb-journey-summary.cust
 import { isValid, format } from 'date-fns';
 
 import { i18nTripDuration } from '../../global/i18n';
-import { durationToTime, removeTimezoneFromISOTimeString } from '../../global/datetime';
+import {
+  durationToTime,
+  NativeDateAdapter,
+  removeTimezoneFromISOTimeString,
+} from '../../global/datetime';
 import {
   documentLanguage,
   HandlerRepository,
@@ -67,17 +71,14 @@ export class SbbJourneySummary implements ComponentInterface {
 
   /**  renders the date of the journey or if it is the current or next day */
   private _renderJourneyStart(departureTime: Date): JSX.Element {
+    const dateAdapter = new NativeDateAdapter();
+
     if (isValid(departureTime))
       return (
         <span>
-          <span>
-            {departureTime.toLocaleDateString(this._currentLanguage, { weekday: 'short' })}.{' '}
-          </span>
-          <span>
-            <time dateTime={format(departureTime, 'd') + ' ' + format(departureTime, 'M')}>
-              {format(departureTime, 'dd.MM.yyyy')}
-            </time>
-          </span>
+          <time dateTime={format(departureTime, 'd') + ' ' + format(departureTime, 'M')}>
+            {dateAdapter.format(departureTime).replace(',', '.')}
+          </time>
         </span>
       );
   }