MOBILE-3708 core: Translate month names in datetime

src/addons/calendar/pages/event/event.html

@@ -161,7 +161,7 @@
                 </ion-item>
                 <ion-datetime #notificationPicker hidden [(ngModel)]="notificationTimeText"
                     [displayFormat]="notificationFormat" [min]="notificationMin" [max]="notificationMax"
-                    doneText]="'core.add' | translate"(ionChange)="addNotificationTime()">
+                    [doneText]="'core.add' | translate" (ionChange)="addNotificationTime()" [monthNames]="monthNames">
                 </ion-datetime>
             </ng-container>
         </ion-card>

src/addons/calendar/pages/event/event.page.ts

@@ -46,6 +46,7 @@ import { AddonCalendarReminderDBRecord } from '../../services/database/calendar'
 import { ActivatedRoute } from '@angular/router';
 import { CoreScreen } from '@services/screen';
 import { CoreConstants } from '@/core/constants';
+import { CoreLang } from '@services/lang';
 
 /**
  * Page that displays a single calendar event.
@@ -87,6 +88,7 @@ export class AddonCalendarEventPage implements OnInit, OnDestroy {
     isOnline = false;
     syncIcon = CoreConstants.ICON_LOADING; // Sync icon.
     isSplitViewOn = false;
+    monthNames?: string[];
 
     constructor(
         @Optional() protected svComponent: CoreSplitViewComponent,
@@ -137,6 +139,8 @@ export class AddonCalendarEventPage implements OnInit, OnDestroy {
 
     protected async asyncConstructor(): Promise<void> {
         if (this.notificationsEnabled) {
+            this.monthNames = CoreLang.getMonthNames();
+
             this.reminders = await AddonCalendar.getEventReminders(this.eventId);
             this.defaultTime = await AddonCalendar.getDefaultNotificationTime() * 60;
 

src/addons/calendar/pages/index/index.page.ts

@@ -74,7 +74,7 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy {
     loadUpcoming = false;
     filter: AddonCalendarFilter = {
         filtered: false,
-        courseId: -1,
+        courseId: undefined,
         categoryId: undefined,
         course: true,
         group: true,
@@ -149,7 +149,7 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy {
                 this.filter = filterData;
 
                 // Course viewed has changed, check if the user can create events for this course calendar.
-                this.canCreate = await AddonCalendarHelper.canEditEvents(this.filter['courseId']);
+                this.canCreate = await AddonCalendarHelper.canEditEvents(this.filter.courseId);
             },
         );
 
@@ -170,12 +170,12 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy {
 
         this.route.queryParams.subscribe(() => {
             this.eventId = CoreNavigator.getRouteNumberParam('eventId');
-            this.filter.courseId = CoreNavigator.getRouteNumberParam('courseId') || -1;
+            this.filter.courseId = CoreNavigator.getRouteNumberParam('courseId');
             this.year = CoreNavigator.getRouteNumberParam('year');
             this.month = CoreNavigator.getRouteNumberParam('month');
             this.loadUpcoming = !!CoreNavigator.getRouteBooleanParam('upcoming');
             this.showCalendar = !this.loadUpcoming;
-            this.filter.filtered = this.filter.courseId > 0;
+            this.filter.filtered = !!this.filter.courseId;
 
             if (this.eventId) {
                 // There is an event to load, open the event in a new state.

src/addons/calendar/services/calendar-helper.ts

@@ -721,7 +721,7 @@ export const AddonCalendarHelper = makeSingleton(AddonCalendarHelperProvider);
  */
 export type AddonCalendarFilter = {
     filtered: boolean; // If filter enabled (some filters applied).
-    courseId: number; // Course Id to filter.
+    courseId: number | undefined; // Course Id to filter.
     categoryId?: number; // Category Id to filter.
     course: boolean; // Filter to show course events.
     group: boolean; // Filter to show group events.

src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html

@@ -12,7 +12,7 @@
         <span [core-mark-required]="required">{{ field.name }}</span>
     </ion-label>
     <ion-datetime [formControlName]="modelName" [placeholder]="'core.choosedots' | translate" [displayFormat]="format"
-        [max]="max" [min]="min">
+        [max]="max" [min]="min" [monthNames]="monthNames">
     </ion-datetime>
     <core-input-errors [control]="form.controls[modelName]"></core-input-errors>
 </ion-item>

src/addons/userprofilefield/datetime/component/datetime.ts

@@ -21,6 +21,7 @@ import { AuthEmailSignupProfileField } from '@features/login/services/login-help
 import { CoreUserProfileField } from '@features/user/services/user';
 import { Translate } from '@singletons';
 import { CoreUserProfileFieldBaseComponent } from '@features/user/classes/base-profilefield-component';
+import { CoreLang } from '@services/lang';
 
 /**
  * Directive to render a datetime user profile field.
@@ -35,6 +36,7 @@ export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileField
     min?: number;
     max?: number;
     valueNumber = 0;
+    monthNames?: string[];
 
     /**
      * Init the data when the field is meant to be displayed without editing.
@@ -53,6 +55,8 @@ export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileField
     protected initForEdit(field: AuthEmailSignupProfileField): void {
         super.initForEdit(field);
 
+        this.monthNames = CoreLang.getMonthNames();
+
         // Check if it's only date or it has time too.
         const hasTime = CoreUtils.isTrueOrOne(field.param3);
 

src/core/features/settings/pages/site/site.module.ts

@@ -42,8 +42,8 @@ function buildRoutes(injector: Injector): Routes {
     ];
 
     return [
-        ...conditionalRoutes(mobileRoutes, () => CoreScreen.instance.isMobile),
+        ...conditionalRoutes(mobileRoutes, () => CoreScreen.isMobile),
-        ...conditionalRoutes(tabletRoutes, () => CoreScreen.instance.isTablet),
+        ...conditionalRoutes(tabletRoutes, () => CoreScreen.isTablet),
     ];
 }
 

src/core/services/lang.ts

@@ -156,8 +156,6 @@ export class CoreLangProvider {
         // Use british english when parent english is loaded.
         moment.locale(language == 'en' ? 'en-gb' : language);
 
-        // @todo: Set data for ion-datetime.
-
         this.currentLanguage = language;
 
         try {
@@ -275,6 +273,42 @@ export class CoreLangProvider {
         return this.fallbackLanguage;
     }
 
+    /**
+     * Get translated month names.
+     *
+     * @return Translated month names.
+     */
+    getMonthNames(): string[] {
+        return moment.months().map(this.capitalize.bind(this));
+    }
+
+    /**
+     * Get translated month short names.
+     *
+     * @return Translated month short names.
+     */
+    getMonthShortNames(): string[] {
+        return moment.monthsShort().map(this.capitalize.bind(this));
+    }
+
+    /**
+     * Get translated day names.
+     *
+     * @return Translated day names.
+     */
+    getDayNames(): string[] {
+        return moment.weekdays().map(this.capitalize.bind(this));
+    }
+
+    /**
+     * Get translated day short names.
+     *
+     * @return Translated day short names.
+     */
+    getDayShortNames(): string[] {
+        return moment.weekdaysShort().map(this.capitalize.bind(this));
+    }
+
     /**
      * Get the full list of translations for a certain language.
      *