feat: date-fns

2026-01-07 05:52:57 +00:00 · 2023-09-27 16:24:38 +02:00
parent d2d577c012
commit b33beeb669
38 changed files with 77 additions and 79 deletions
--- a/frontend/app/src/app/modules/assessments/assessments.module.ts
+++ b/frontend/app/src/app/modules/assessments/assessments.module.ts
@@ -35,7 +35,7 @@ import {ProtectedRoutes} from '../auth/protected.routes';
 import {AssessmentsTreeListComponent} from './list/assessments-tree-list.component';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
 import {UtilModule} from '../../util/util.module';
-import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

 const routes: ProtectedRoutes = [
  {
@@ -76,7 +76,7 @@ const routes: ProtectedRoutes = [
    ThingTranslateModule,
    UtilModule,
    ParseIsoPipeModule,
-    FormatPipeModule,
+    FormatPurePipeModule,
  ],
  providers: [AssessmentsProvider],
  exports: [],
--- a/frontend/app/src/app/modules/assessments/types/assessment/assessment-list-item.html
+++ b/frontend/app/src/app/modules/assessments/types/assessment/assessment-list-item.html
@@ -15,7 +15,8 @@

 <div class="container">
  <h2 class="name">
-    {{ 'name' | thingTranslate : item }} {{ item.date ? (item.date | dfnsParseIso | dfnsFormat : 'Pp') : '' }}
+    {{ 'name' | thingTranslate : item }} {{ item.date ? (item.date | dfnsParseIso | dfnsFormatPure : 'Pp') :
+    '' }}
  </h2>
  <assessment-base-info [item]="item"></assessment-base-info>
 </div>
--- a/frontend/app/src/app/modules/calendar/add-event-review-modal.html
+++ b/frontend/app/src/app/modules/calendar/add-event-review-modal.html
@@ -34,7 +34,7 @@
            <s *ngIf="iCalEvent.cancelled; else date"
              ><ng-container [ngTemplateOutlet]="date"></ng-container>
            </s>
-            <ng-template #date> {{ iCalEvent.start | dfnsParseIso | dfnsFormat : 'PPPp' }} </ng-template>
+            <ng-template #date> {{ iCalEvent.start | dfnsParseIso | dfnsFormatPure : 'PPPp' }} </ng-template>
          </ion-label>
          <ion-note *ngIf="iCalEvent.rrule">
            {{ iCalEvent.rrule.interval }} {{ iCalEvent.rrule.freq | sentencecase }}
--- a/frontend/app/src/app/modules/calendar/calendar.module.ts
+++ b/frontend/app/src/app/modules/calendar/calendar.module.ts
@@ -24,7 +24,7 @@ import {FormsModule} from '@angular/forms';
 import {CommonModule} from '@angular/common';
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
-import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

@NgModule({
  declarations: [AddEventReviewModalComponent],
@@ -37,7 +37,7 @@ import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
    CommonModule,
    UtilModule,
    ParseIsoPipeModule,
-    FormatPipeModule,
+    FormatPurePipeModule,
  ],
  exports: [],
  providers: [Calendar, CalendarService, ScheduleProvider],
--- a/frontend/app/src/app/modules/dashboard/dashboard.component.html
+++ b/frontend/app/src/app/modules/dashboard/dashboard.component.html
@@ -33,7 +33,7 @@
    <ion-label>
      {{
        nextEvent
-          ? (nextEvent!.dates.sort().at(-1) | dfnsParseIso | dfnsFormatRelative : (now | async))
+          ? (nextEvent!.dates.sort().at(-1) | dfnsParseIso | dfnsFormatRelativePure : (now | async))
          : ('dashboard.schedule.noEvent' | translate)
      }}
    </ion-label>
--- a/frontend/app/src/app/modules/dashboard/dashboard.module.ts
+++ b/frontend/app/src/app/modules/dashboard/dashboard.module.ts
@@ -31,7 +31,7 @@ import {ThingTranslateModule} from '../../translation/thing-translate.module';
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
 import {NewsModule} from '../news/news.module';
-import {FormatRelativePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatRelativePurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

 const catalogRoutes: Routes = [
  {
@@ -65,7 +65,7 @@ const catalogRoutes: Routes = [
    UtilModule,
    NewsModule,
    ParseIsoPipeModule,
-    FormatRelativePipeModule,
+    FormatRelativePurePipeModule,
  ],
  providers: [SettingsProvider, TranslatePipe],
 })
--- a/frontend/app/src/app/modules/data/chips/edit-event-selection.html
+++ b/frontend/app/src/app/modules/data/chips/edit-event-selection.html
@@ -44,19 +44,19 @@
      >
        <ng-container *ngIf="date.item.dates.length > 1; else single_event">
          <ion-text>
-            <b>{{ date.item.duration | dfnsParseDuration | dfnsFormatDuration }}</b>
-            {{ date.item.dates[0] | dfnsParseIso | dfnsFormat: 'EEEE, p' }}
+            <b>{{ date.item.duration | dfnsParseDuration | dfnsFormatDurationPure }}</b>
+            {{ date.item.dates[0] | dfnsParseIso | dfnsFormatPure: 'EEEE, p' }}
          </ion-text>
          <br />
          <ion-text>
-            {{ date.item.dates[0] | dfnsParseIso | dfnsFormat: 'PPP' }} - {{
-            date.item.dates[date.item.dates.length - 1] | dfnsParseIso | dfnsFormat: 'PPP' }}
+            {{ date.item.dates[0] | dfnsParseIso | dfnsFormatPure: 'PPP' }} - {{
+            date.item.dates[date.item.dates.length - 1] | dfnsParseIso | dfnsFormatPure: 'PPP' }}
          </ion-text>
        </ng-container>
        <ng-template #single_event>
          <ion-text *ngIf="date.item.dates[0] as time; else noDates">
-            <b>{{ date.item.duration |dfnsParseDuration | dfnsFormatDuration}}</b>
-            {{ time | dfnsParseIso | dfnsFormat: 'PPPPp' }}
+            <b>{{ date.item.duration |dfnsParseDuration | dfnsFormatDurationPure}}</b>
+            {{ time | dfnsParseIso | dfnsFormatPure: 'PPPPp' }}
          </ion-text>
          <ng-template #noDates>
            <ion-text color="danger">{{ 'data.chips.add_events.popover.DATA_ERROR' | translate }}</ion-text>
--- a/frontend/app/src/app/modules/data/data.module.ts
+++ b/frontend/app/src/app/modules/data/data.module.ts
@@ -104,10 +104,9 @@ import {CertificationsInDetailComponent} from './elements/certifications-in-deta
 import {GeoNavigationDirective} from '../map/geo-navigation.directive';
 import {NavigateActionChipComponent} from './chips/data/navigate-action-chip.component';
 import {
-  FormatDistanceToNowPipeModule,
-  FormatDurationPipeModule,
-  FormatPipeModule,
-  FormatRelativeToNowPipeModule,
+  FormatDurationPurePipeModule,
+  FormatPurePipeModule,
+  FormatRelativeToNowPurePipeModule,
  ParseIsoPipeModule,
 } from 'ngx-date-fns';
 import {ParseDurationPipe} from '../../translation/date-time/parse-duration.pipe';
@@ -203,13 +202,12 @@ import {DfnsFormatRelativeDatePurePipe} from '../../translation/date-time/format
    UtilModule,
    GeoNavigationDirective,
    ParseIsoPipeModule,
-    FormatPipeModule,
    ParseDurationPipe,
-    FormatDurationPipeModule,
-    FormatRelativeToNowPipeModule,
    DfnsFormatFrequencyPurePipe,
-    FormatDistanceToNowPipeModule,
    DfnsFormatRelativeDatePurePipe,
+    FormatPurePipeModule,
+    FormatDurationPurePipeModule,
+    FormatRelativeToNowPurePipeModule,
  ],
  providers: [
    CoordinatedSearchProvider,
--- a/frontend/app/src/app/modules/data/elements/offers-detail.html
+++ b/frontend/app/src/app/modules/data/elements/offers-detail.html
@@ -30,7 +30,7 @@
              *ngIf="offer.availabilityRange.gt ? offer.availabilityRange.gt : offer.availabilityRange.gte"
            >
              {{ (offer.availabilityRange.gt ? offer.availabilityRange.gt : offer.availabilityRange.gte) |
-              dfnsParseIso | dfnsFormat : 'PPP' }}
+              dfnsParseIso | dfnsFormatPure : 'PPP' }}
            </span>
          </ion-col>
        </ion-row>
--- a/frontend/app/src/app/modules/data/elements/origin-detail.html
+++ b/frontend/app/src/app/modules/data/elements/origin-detail.html
@@ -21,15 +21,15 @@
  <ion-card-content>
    <p>
      {{ 'data.types.origin.detail.CREATED' | translate | titlecase }}: {{ origin.created | dfnsParseIso |
-      dfnsFormat : 'PPP' }}
+      dfnsFormatPure : 'PPP' }}
    </p>
    <p *ngIf="origin.updated">
      {{ 'data.types.origin.detail.UPDATED' | translate | titlecase }}: {{ origin.updated | dfnsParseIso |
-      dfnsFormat : 'PPP' }}
+      dfnsFormatPure : 'PPP' }}
    </p>
    <p *ngIf="origin.modified">
      {{ 'data.types.origin.detail.MODIFIED' | translate | titlecase }}: {{ origin.modified | dfnsParseIso |
-      dfnsFormat : 'PPP' }}
+      dfnsFormatPure : 'PPP' }}
    </p>
    <p *ngIf="origin.name">{{ 'data.types.origin.detail.MAINTAINER' | translate }}: {{ origin.name }}</p>
    <p *ngIf="origin.maintainer">
@@ -47,11 +47,11 @@
  <ion-card-content>
    <p>
      {{ 'data.types.origin.detail.INDEXED' | translate | titlecase }}: {{ origin.indexed | dfnsParseIso |
-      dfnsFormat : 'PPP'}}
+      dfnsFormatPure : 'PPP'}}
    </p>
    <p *ngIf="origin.modified">
      {{ 'data.types.origin.detail.MODIFIED' | translate | titlecase }}: {{ origin.modified | dfnsParseIso |
-      dfnsFormat : 'PPP' }}
+      dfnsFormatPure : 'PPP' }}
    </p>
    <p *ngIf="origin.name">{{ 'data.types.origin.detail.MAINTAINER' | translate }}: {{ origin.name }}</p>
    <p *ngIf="origin.maintainer">
--- a/frontend/app/src/app/modules/data/types/date-series/date-series-detail-content.html
+++ b/frontend/app/src/app/modules/data/types/date-series/date-series-detail-content.html
@@ -26,22 +26,22 @@
 </ng-template>
 <stapps-simple-card
  title="{{ 'duration' | propertyNameTranslate : item | titlecase }}"
-  [content]="[item.duration | dfnsParseDuration | dfnsFormatDuration: {format: ['minutes']}]"
+  [content]="[item.duration | dfnsParseDuration | dfnsFormatDurationPure: {format: ['minutes']}]"
 ></stapps-simple-card>
 <stapps-simple-card
  *ngIf="item.dates.length > 1; else single_event"
  title="{{ 'dates' | propertyNameTranslate : item | titlecase }}"
  content="{{ 'data.chips.add_events.popover.AT' | translate | titlecase }} {{
-    item.dates[0] | dfnsParseIso | dfnsFormat: 'pp, eee'
+    item.dates[0] | dfnsParseIso | dfnsFormatPure: 'pp, eee'
  }} {{ 'data.chips.add_events.popover.UNTIL' | translate }} {{
-    item.dates[item.dates.length - 1] | dfnsParseIso | dfnsFormat : 'PP'
+    item.dates[item.dates.length - 1] | dfnsParseIso | dfnsFormatPure : 'PP'
  }}"
 ></stapps-simple-card>
 <ng-template #single_event>
  <stapps-simple-card
    title="{{ 'dates' | propertyNameTranslate : item | titlecase }}"
    content="{{ 'data.chips.add_events.popover.AT' | translate | titlecase }} {{
-      item.dates[item.dates.length - 1] | dfnsParseIso | dfnsFormat : 'PPpp'
+      item.dates[item.dates.length - 1] | dfnsParseIso | dfnsFormatPure : 'PPpp'
    }}"
  ></stapps-simple-card>
 </ng-template>
--- a/frontend/app/src/app/modules/data/types/date-series/date-series-list-item.html
+++ b/frontend/app/src/app/modules/data/types/date-series/date-series-list-item.html
@@ -22,12 +22,12 @@
          <ion-icon name="calendar_today"></ion-icon>
          <span *ngIf="item.dates[0] && item.dates[item.dates.length - 1]">
            <span *ngIf="item.repeatFrequency">
-              {{ item.repeatFrequency | dfnsParseDuration | dfnsFormatDuration | sentencecase }}, {{
-              item.dates[0] | dfnsParseIso | dfnsFormat : 'PPPP' }}
+              {{ item.repeatFrequency | dfnsParseDuration | dfnsFormatDurationPure | sentencecase }}, {{
+              item.dates[0] | dfnsParseIso | dfnsFormatPure : 'PPPP' }}
            </span>
            <span>
-              ({{ item.dates[0] | dfnsParseIso | dfnsFormat: 'PPP' }} - {{ item.dates[item.dates.length - 1] |
-              dfnsParseIso | dfnsFormat: 'PPP' }})
+              ({{ item.dates[0] | dfnsParseIso | dfnsFormatPure: 'PPP' }} - {{ item.dates[item.dates.length -
+              1] | dfnsParseIso | dfnsFormatPure: 'PPP' }})
            </span>
          </span>
        </p>
--- a/frontend/app/src/app/modules/data/types/message/message-detail-content.html
+++ b/frontend/app/src/app/modules/data/types/message/message-detail-content.html
@@ -25,7 +25,7 @@
  <stapps-simple-card
    *ngIf="item.datePublished"
    [title]="'datePublished' | propertyNameTranslate : item | titlecase"
-    [content]="item.datePublished | dfnsParseIso | dfnsFormat : 'PPP'"
+    [content]="item.datePublished | dfnsParseIso | dfnsFormatPure : 'PPP'"
  ></stapps-simple-card>
  <stapps-simple-card
    *ngIf="item.authors"
@@ -50,7 +50,7 @@
  <stapps-simple-card
    *ngIf="item.datePublished"
    class="date-published"
-    content="{{ item.datePublished | dfnsParseIso | dfnsFormatRelativeToNow | sentencecase }}"
+    content="{{ item.datePublished | dfnsParseIso | dfnsFormatRelativeToNowPure | sentencecase }}"
  ></stapps-simple-card>
  <stapps-simple-card content="{{ item.messageBody }}"></stapps-simple-card>
  <ion-card *ngIf="item.sameAs">
--- a/frontend/app/src/app/modules/data/types/semester/semester-detail-content.html
+++ b/frontend/app/src/app/modules/data/types/semester/semester-detail-content.html
@@ -21,6 +21,6 @@
    ('eventsEndDate' | propertyNameTranslate : item | titlecase)
  "
  [content]="
-    (item.eventsStartDate | dfnsParseIso | dfnsFormat : 'PPP') + ' - ' + (item.eventsEndDate | dfnsParseIso | dfnsFormat : 'PPP')
+    (item.eventsStartDate | dfnsParseIso | dfnsFormatPure : 'PPP') + ' - ' + (item.eventsEndDate | dfnsParseIso | dfnsFormat : 'PPP')
  "
 ></stapps-simple-card>
--- a/frontend/app/src/app/modules/data/types/semester/semester-list-item.html
+++ b/frontend/app/src/app/modules/data/types/semester/semester-list-item.html
@@ -21,8 +21,8 @@
        <p class="title-sub">
          <ion-icon name="calendar_today"></ion-icon>
          <span
-            >{{ item.startDate | dfnsParseIso | dfnsFormat: 'PPP' }} - {{ item.endDate | dfnsParseIso |
-            dfnsFormat: 'PPP' }}</span
+            >{{ item.startDate | dfnsParseIso | dfnsFormatPure: 'PPP' }} - {{ item.endDate | dfnsParseIso |
+            dfnsFormatPure: 'PPP' }}</span
          >
        </p>
        <ion-note>{{ 'type' | thingTranslate : item }}</ion-note>
--- a/frontend/app/src/app/modules/data/types/video/video-detail-content.html
+++ b/frontend/app/src/app/modules/data/types/video/video-detail-content.html
@@ -26,7 +26,7 @@
 <stapps-simple-card
  *ngIf="item.datePublished"
  [title]="'datePublished' | propertyNameTranslate : item | titlecase"
-  [content]="item.datePublished | dfnsParseIso | dfnsFormat : 'PPP'"
+  [content]="item.datePublished | dfnsParseIso | dfnsFormatPure : 'PPP'"
 >
 </stapps-simple-card>
 <stapps-offers-detail *ngIf="item.offers" [offers]="item.offers"></stapps-offers-detail>
--- a/frontend/app/src/app/modules/data/types/video/video-list-item.html
+++ b/frontend/app/src/app/modules/data/types/video/video-list-item.html
@@ -11,7 +11,7 @@
        </p>
        <p *ngIf="item.duration">
          {{ 'duration' | propertyNameTranslate : item | titlecase }}: {{ item.duration | dfnsParseDuration |
-          dfnsFormatDuration : {format: ['seconds']} }}
+          dfnsFormatDurationPure : {format: ['seconds']} }}
        </p>
        <ion-note>{{ 'type' | thingTranslate : item }}</ion-note>
      </div>
--- a/frontend/app/src/app/modules/hebis/daia-availability/daia-holding.html
+++ b/frontend/app/src/app/modules/hebis/daia-availability/daia-holding.html
@@ -67,6 +67,6 @@
  </ion-row>
  <ion-row *ngIf="holding.dueDate">
    <ion-col size="3">{{ 'hebisSearch.daia.dueDate' | translate }}</ion-col>
-    <ion-col size="9">{{ holding.dueDate | dfnsParseIso | dfnsFormat : 'PPP' }}</ion-col>
+    <ion-col size="9">{{ holding.dueDate | dfnsParseIso | dfnsFormatPure : 'PPP' }}</ion-col>
  </ion-row>
 </ion-grid>
--- a/frontend/app/src/app/modules/hebis/hebis.module.ts
+++ b/frontend/app/src/app/modules/hebis/hebis.module.ts
@@ -35,7 +35,7 @@ import {DaiaAvailabilityComponent} from './daia-availability/daia-availability.c
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
 import {DaiaHoldingComponent} from './daia-availability/daia-holding.component';
-import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

 /**
 * Module for handling data
@@ -64,7 +64,7 @@ import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
    ThingTranslateModule.forChild(),
    UtilModule,
    ParseIsoPipeModule,
-    FormatPipeModule,
+    FormatPurePipeModule,
  ],
  providers: [HebisDataProvider, DaiaDataProvider, StAppsWebHttpClient],
 })
--- a/frontend/app/src/app/modules/library/account/elements/fee-item/fee-item.html
+++ b/frontend/app/src/app/modules/library/account/elements/fee-item/fee-item.html
@@ -28,7 +28,7 @@
      <p *ngIf="fee[property]">
        {{ 'library.account.pages.fines.labels' + '.' + property | translate }}:
        <ng-container *ngIf="!['date'].includes(property); else date"> {{ fee[property] }} </ng-container>
-        <ng-template #date> {{ $any(fee[property]) | dfnsParseIso | dfnsFormat : 'PPP' }} </ng-template>
+        <ng-template #date> {{ $any(fee[property]) | dfnsParseIso | dfnsFormatPure : 'PPP' }} </ng-template>
      </p></ng-container
    >
  </ion-label>
--- a/frontend/app/src/app/modules/library/account/elements/paia-item/paiaitem.html
+++ b/frontend/app/src/app/modules/library/account/elements/paia-item/paiaitem.html
@@ -23,7 +23,7 @@
        <ng-container *ngIf="!['endtime', 'duedate'].includes(property); else date">
          {{ item[property] }}
        </ng-container>
-        <ng-template #date> {{ $any(item[property]) | dfnsParseIso | dfnsFormat : 'PPP' }} </ng-template>
+        <ng-template #date> {{ $any(item[property]) | dfnsParseIso | dfnsFormatPure : 'PPP' }} </ng-template>
      </p>
    </ng-container>
    <span class="ion-float-right">
--- a/frontend/app/src/app/modules/library/account/profile/profile-page.html
+++ b/frontend/app/src/app/modules/library/account/profile/profile-page.html
@@ -38,7 +38,7 @@
                </ng-container>
                <ng-template #exactDate>
                  {{ 'library.account.pages.profile.values.expires' | translate }}:&nbsp;{{
-                  $any(patron[property]) | dfnsParseIso | dfnsFormat : 'PPP' }}
+                  $any(patron[property]) | dfnsParseIso | dfnsFormatPure : 'PPP' }}
                </ng-template>
              </ng-template>
            </ion-col>
--- a/frontend/app/src/app/modules/library/library.module.ts
+++ b/frontend/app/src/app/modules/library/library.module.ts
@@ -31,7 +31,7 @@ import {FeeItemComponent} from './account/elements/fee-item/fee-item.component';
 import {DataModule} from '../data/data.module';
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
-import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

 const routes: ProtectedRoutes | Routes = [
  {
@@ -77,7 +77,7 @@ const routes: ProtectedRoutes | Routes = [
    DataModule,
    UtilModule,
    ParseIsoPipeModule,
-    FormatPipeModule,
+    FormatPurePipeModule,
  ],
  declarations: [
    LibraryAccountPageComponent,
--- a/frontend/app/src/app/modules/news/item/news-item.html
+++ b/frontend/app/src/app/modules/news/item/news-item.html
@@ -21,7 +21,7 @@
 >
  <ion-card-header>
    <ion-card-subtitle *ngIf="item.datePublished"
-      >{{ item.datePublished | dfnsParseIso | dfnsFormatRelativeToNow | sentencecase }}</ion-card-subtitle
+      >{{ item.datePublished | dfnsParseIso | dfnsFormatRelativeToNowPure | sentencecase }}</ion-card-subtitle
    >
    <ion-card-title> {{ item.name }} </ion-card-title>
  </ion-card-header>
--- a/frontend/app/src/app/modules/news/news.module.ts
+++ b/frontend/app/src/app/modules/news/news.module.ts
@@ -28,7 +28,7 @@ import {SettingsModule} from '../settings/settings.module';
 import {NewsSettingsFilterComponent} from './elements/news-filter-settings/news-settings-filter.component';
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
-import {FormatRelativeToNowPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {FormatRelativeToNowPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';

 const newsRoutes: Routes = [{path: 'news', component: NewsPageComponent}];

@@ -55,7 +55,7 @@ const newsRoutes: Routes = [{path: 'news', component: NewsPageComponent}];
    SettingsModule,
    UtilModule,
    ParseIsoPipeModule,
-    FormatRelativeToNowPipeModule,
+    FormatRelativeToNowPurePipeModule,
  ],
  providers: [SettingsProvider],
  exports: [NewsItemComponent],
--- a/frontend/app/src/app/modules/profile/page/my-courses.html
+++ b/frontend/app/src/app/modules/profile/page/my-courses.html
@@ -20,8 +20,8 @@
      <ng-container *ngFor="let myCourse of myCoursesDay[1]">
        <ion-item-group>
          <ion-item-divider
-            >{{myCourse.startTime | dfnsParseIso | dfnsFormat: 'p'}} - {{myCourse.endTime | dfnsParseIso |
-            dfnsFormat: 'p'}}</ion-item-divider
+            >{{myCourse.startTime | dfnsParseIso | dfnsFormatPure: 'p'}} - {{myCourse.endTime | dfnsParseIso |
+            dfnsFormatPure: 'p'}}</ion-item-divider
          >
          <stapps-data-list-item
            [listItemChipInteraction]="false"
--- a/frontend/app/src/app/modules/profile/profile.module.ts
+++ b/frontend/app/src/app/modules/profile/profile.module.ts
@@ -26,7 +26,7 @@ import {ProfilePageSectionComponent} from './page/profile-page-section.component
 import {ThingTranslateModule} from '../../translation/thing-translate.module';
 import {DataModule} from '../data/data.module';
 import {MyCoursesComponent} from './page/my-courses.component';
-import {FormatPipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
+import {ParseIsoPipeModule} from 'ngx-date-fns';
 import {DfnsFormatRelativeDatePurePipe} from '../../translation/date-time/format-relative-date.pipe';

 const routes: Routes = [
@@ -49,7 +49,6 @@ const routes: Routes = [
    UtilModule,
    ThingTranslateModule,
    DataModule,
-    FormatPipeModule,
    DfnsFormatRelativeDatePurePipe,
    ParseIsoPipeModule,
  ],
--- a/frontend/app/src/app/modules/schedule/page/calendar-view.html
+++ b/frontend/app/src/app/modules/schedule/page/calendar-view.html
@@ -21,7 +21,7 @@
  </ion-button>
  <div class="day-labels">
    <ion-button expand="block" fill="clear" (click)="popover.present($event)">
-      {{ dateRange.startDate | dfnsFormat : 'P' }} - {{ dateRange.endDate | dfnsFormat : 'P' }}
+      {{ dateRange.startDate | dfnsFormatPure : 'P' }} - {{ dateRange.endDate | dfnsFormatPure : 'P' }}
    </ion-button>

    <ion-popover #popover>
--- a/frontend/app/src/app/modules/schedule/page/grid/schedule-day.html
+++ b/frontend/app/src/app/modules/schedule/page/grid/schedule-day.html
@@ -13,7 +13,7 @@
  ~ this program. If not, see <https://www.gnu.org/licenses/>.
  -->
 <div class="day-wrapper" [class.leftmost]="isLeftmost">
-  <div class="day-header" [class.leftmost]="isLeftmost">{{ day | dfnsFormat : dateFormat }}</div>
+  <div class="day-header" [class.leftmost]="isLeftmost">{{ day | dfnsFormatPure : dateFormat }}</div>
  <div *ngIf="dateSeriesGroups as groups">
    <div *ngFor="let group of groups" class="horizontal-group">
      <stapps-schedule-card
--- a/frontend/app/src/app/modules/schedule/page/schedule-single-events.html
+++ b/frontend/app/src/app/modules/schedule/page/schedule-single-events.html
@@ -16,7 +16,7 @@
 <ion-content @materialFade>
  <ion-list lines="none">
    <ion-item-group *ngFor="let day of events | async" @materialFade>
-      <ion-label class="day-label" color="medium"> {{ day[0].day | dfnsFormat : 'PPP' }} </ion-label>
+      <ion-label class="day-label" color="medium"> {{ day[0].day | dfnsFormatPure : 'PPP' }} </ion-label>
      <ion-item *ngFor="let event of day" lines="none">
        <div class="hour-wrapper">
          <ion-text class="hour-label"> {{ event.event.time.startAsString }} </ion-text>
--- a/frontend/app/src/app/modules/schedule/page/schedule-view.html
+++ b/frontend/app/src/app/modules/schedule/page/schedule-view.html
@@ -25,7 +25,7 @@
  <div class="schedule-wrapper" [style.height.px]="scale * (hoursRange.to - hoursRange.from + 1) + scale">
    <div class="hours-wrapper">
      <!-- add margin top +45 to start below the date header -->
-      <div class="hour-lines" *ngFor="let i of hours" [style.marginTop.px]="i * scale + 45">
+      <div class="hour-lines" *ngFor="let i of hours" [style.margin-top.px]="i * scale + 45">
        {{ i + hoursRange.from }}
      </div>
    </div>
--- a/frontend/app/src/app/modules/schedule/schedule.module.ts
+++ b/frontend/app/src/app/modules/schedule/schedule.module.ts
@@ -35,7 +35,7 @@ import {InfiniteSwiperComponent} from './page/grid/infinite-swiper.component';
 import {CalendarComponent} from './page/components/calendar.component';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
 import {ChooseEventsPageComponent} from './page/choose-events-page.component';
-import {AddDaysPipeModule, DateFnsModule, FormatPipeModule, IsSameDayPipeModule} from 'ngx-date-fns';
+import {AddDaysPipeModule, FormatPurePipeModule, IsSameDayPipeModule, IsTodayPipeModule} from 'ngx-date-fns';

 const settingsRoutes: Routes = [
  {path: 'schedule', redirectTo: 'schedule/calendar/now'},
@@ -76,9 +76,9 @@ const settingsRoutes: Routes = [
    UtilModule,
    ThingTranslateModule,
    AddDaysPipeModule,
-    FormatPipeModule,
    IsSameDayPipeModule,
-    DateFnsModule,
+    FormatPurePipeModule,
+    IsTodayPipeModule,
  ],
  providers: [ScheduleProvider, DataProvider],
 })
--- a/frontend/app/src/app/translation/dfns-locale.ts
+++ b/frontend/app/src/app/translation/dfns-locale.ts
@@ -15,6 +15,7 @@
 import {SCLanguageCode} from '@openstapps/core';
 import type {Locale} from 'date-fns';
 import {TranslateService} from '@ngx-translate/core';
+import {firstValueFrom} from 'rxjs';

 export interface LocaleExtension extends Locale {
  formatFrequencyOptions: Partial<Record<Intl.LDMLPluralRule, string>>;
@@ -46,9 +47,8 @@ export async function getDateFnsLocale(
    console.warn(`Unknown Locale "${code}" for Date Fns. Falling back to English.`);
  }
  const key = code in LOCALES ? (code as keyof typeof LOCALES) : 'en';
-  const translations = translator.translations[translator.currentLang];
-  const frequencyExtension = translations['dateFns']['FORMAT_FREQUENCY'];
-  const relativeDateExtension = translations['dateFns']['FORMAT_RELATIVE_DATE'];
+  const frequencyExtension = await firstValueFrom(translator.get('dateFns.FORMAT_FREQUENCY'));
+  const relativeDateExtension = await firstValueFrom(translator.get('dateFns.FORMAT_RELATIVE_DATE'));

  return LOCALES[key]().then(it => {
    const locale = it.default as LocaleExtension;
--- a/frontend/app/src/app/translation/property-name-translate.pipe.ts
+++ b/frontend/app/src/app/translation/property-name-translate.pipe.ts
@@ -41,9 +41,9 @@ export class PropertyNameTranslatePipe implements PipeTransform, OnDestroy {
    this.value = this.thingTranslate.getPropertyName(type as SCThingType, key);
  }

-  transform(query: unknown, thingOrType: SCThings | string | unknown): unknown {
+  transform(query: unknown, thingOrType: SCThings | string | unknown): string {
    if (typeof query !== 'string' || query.length <= 0) {
-      return query;
+      return query as string;
    }

    if (!isThing(thingOrType) && typeof thingOrType !== 'string') {
@@ -70,7 +70,7 @@ export class PropertyNameTranslatePipe implements PipeTransform, OnDestroy {
      });
    }

-    return this.value;
+    return this.value as string;
  }

  /**
--- a/frontend/app/src/app/util/opening-hours.html
+++ b/frontend/app/src/app/util/opening-hours.html
@@ -22,11 +22,11 @@
  <ng-template #nextChange>
    <ng-container *ngIf="showNextChange && openingHours.nextChangeSoon">
      {{ ('common.openingHours.' + openingHours.nextChangeAction + '_soon') | translate: {duration:
-      (openingHours.nextChangeSoon | async | dfnsFormatDistanceToNowStrict: {unit: 'minute'})} }}
+      (openingHours.nextChangeSoon | async | dfnsFormatDistanceToNowStrictPure: {unit: 'minute'})} }}
    </ng-container>
    <ng-container *ngIf="showNextChange && !openingHours.nextChangeSoon">
      {{ ('common.openingHours.' + openingHours.nextChangeAction) | translate: {date: openingHours.nextChange
-      | dfnsFormatRelativeToNow} }}
+      | dfnsFormatRelativeToNowPure} }}
    </ng-container>
  </ng-template>
 </div>
--- a/frontend/app/src/app/util/util.module.ts
+++ b/frontend/app/src/app/util/util.module.ts
@@ -27,7 +27,7 @@ import {SearchbarAutofocusDirective} from './searchbar-autofocus.directive';
 import {SectionComponent} from './section.component';
 import {RouterModule} from '@angular/router';
 import {IonContentParallaxDirective} from './ion-content-parallax.directive';
-import {FormatDistanceToNowStrictPipeModule, FormatRelativeToNowPipeModule} from 'ngx-date-fns';
+import {FormatDistanceToNowStrictPurePipeModule, FormatRelativeToNowPurePipeModule} from 'ngx-date-fns';

@NgModule({
  imports: [
@@ -36,8 +36,8 @@ import {FormatDistanceToNowStrictPipeModule, FormatRelativeToNowPipeModule} from
    TranslateModule,
    ThingTranslateModule.forChild(),
    RouterModule,
-    FormatRelativeToNowPipeModule,
-    FormatDistanceToNowStrictPipeModule,
+    FormatRelativeToNowPurePipeModule,
+    FormatDistanceToNowStrictPurePipeModule,
  ],
  declarations: [
    IonContentParallaxDirective,
--- a/frontend/app/src/assets/i18n/de.json
+++ b/frontend/app/src/assets/i18n/de.json
@@ -18,7 +18,7 @@
      "yesterday": "'gestern'",
      "today": "'heute'",
      "tomorrow": "'morgen'",
-      "nextWeek": "'nächsten' eeee",
+      "nextWeek": "eeee",
      "other": "pp"
    }
  },
--- a/frontend/app/src/assets/i18n/en.json
+++ b/frontend/app/src/assets/i18n/en.json
@@ -18,7 +18,7 @@
      "yesterday": "'yesterday'",
      "today": "'today'",
      "tomorrow": "'tomorrow'",
-      "nextWeek": "'next' eeee",
+      "nextWeek": "eeee",
      "other": "pp"
    }
  },