Merge pull request #3891 from dpalou/MOBILE-3947

Mobile 3947

src/addons/block/timeline/components/timeline/timeline.ts

@@ -39,10 +39,10 @@ import { CoreLogger } from '@singletons/logger';
 })
 export class AddonBlockTimelineComponent implements OnInit, ICoreBlockComponent {
 
-    sort = new FormControl();
+    sort = new FormControl(AddonBlockTimelineSort.ByDates);
     sort$!: Observable<AddonBlockTimelineSort>;
     sortOptions!: AddonBlockTimelineOption<AddonBlockTimelineSort>[];
-    filter = new FormControl();
+    filter = new FormControl(AddonBlockTimelineFilter.Next30Days);
     filter$!: Observable<AddonBlockTimelineFilter>;
     statusFilterOptions!: AddonBlockTimelineOption<AddonBlockTimelineFilter>[];
     dateFilterOptions!: AddonBlockTimelineOption<AddonBlockTimelineFilter>[];

src/addons/calendar/pages/edit-event/edit-event.ts

@@ -78,9 +78,9 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
 
     // Form variables.
     form: FormGroup;
-    typeControl: FormControl;
-    groupControl: FormControl;
-    descriptionControl: FormControl;
+    typeControl: FormControl<AddonCalendarEventType | null>;
+    groupControl: FormControl<number | null>;
+    descriptionControl: FormControl<string>;
 
     // Reminders.
     remindersEnabled = false;
@@ -103,9 +103,9 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
         this.form = new FormGroup({});
 
         // Initialize form variables.
-        this.typeControl = this.fb.control('', Validators.required);
-        this.groupControl = this.fb.control('');
-        this.descriptionControl = this.fb.control('');
+        this.typeControl = this.fb.control(null, Validators.required);
+        this.groupControl = this.fb.control(null);
+        this.descriptionControl = this.fb.control('', { nonNullable: true });
         this.form.addControl('name', this.fb.control('', Validators.required));
         this.form.addControl('eventtype', this.typeControl);
         this.form.addControl('categoryid', this.fb.control(''));
@@ -322,11 +322,11 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
 
         this.form.controls.name.setValue(event.name);
         this.form.controls.timestart.setValue(CoreTimeUtils.toDatetimeFormat(event.timestart * 1000));
-        this.form.controls.eventtype.setValue(event.eventtype);
+        this.typeControl.setValue(event.eventtype as AddonCalendarEventType);
         this.form.controls.categoryid.setValue(event.categoryid || '');
         this.form.controls.courseid.setValue(courseId || '');
         this.form.controls.groupcourseid.setValue(courseId || '');
-        this.form.controls.groupid.setValue(event.groupid || '');
+        this.groupControl.setValue(event.groupid || null);
         this.form.controls.description.setValue(event.description);
         this.form.controls.location.setValue(event.location);
 
@@ -410,7 +410,7 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
         try {
             await this.loadGroups(courseId);
 
-            this.groupControl.setValue('');
+            this.groupControl.setValue(null);
         } catch (error) {
             CoreDomUtils.showErrorModalDefault(error, 'Error getting data.');
         }

src/addons/mod/assign/feedback/comments/component/comments.ts

@@ -34,7 +34,7 @@ import { AddonModAssignFeedbackPluginBaseComponent } from '@addons/mod/assign/cl
 })
 export class AddonModAssignFeedbackCommentsComponent extends AddonModAssignFeedbackPluginBaseComponent implements OnInit {
 
-    control?: FormControl;
+    control?: FormControl<string>;
     component = AddonModAssignProvider.COMPONENT;
     text = '';
     isSent = false;
@@ -76,7 +76,7 @@ export class AddonModAssignFeedbackCommentsComponent extends AddonModAssignFeedb
                     }
                 });
             } else if (this.edit) {
-                this.control = this.fb.control(this.text);
+                this.control = this.fb.control(this.text, { nonNullable: true });
             }
         } finally {
             this.loaded = true;

src/addons/mod/assign/submission/onlinetext/component/onlinetext.ts

@@ -31,7 +31,7 @@ import { AddonModAssignSubmissionOnlineTextPluginData } from '../services/handle
 })
 export class AddonModAssignSubmissionOnlineTextComponent extends AddonModAssignSubmissionPluginBaseComponent implements OnInit {
 
-    control?: FormControl;
+    control?: FormControl<string>;
     words = 0;
     component = AddonModAssignProvider.COMPONENT;
     text = '';
@@ -94,7 +94,7 @@ export class AddonModAssignSubmissionOnlineTextComponent extends AddonModAssignS
                 });
             } else {
                 // Create and add the control.
-                this.control = this.fb.control(this.text);
+                this.control = this.fb.control(this.text, { nonNullable: true });
             }
 
             // Calculate initial words.

src/addons/mod/forum/components/post/post.ts

@@ -83,7 +83,7 @@ export class AddonModForumPostComponent implements OnInit, OnDestroy, OnChanges
 
     @ViewChild('replyFormEl') formElement!: ElementRef;
 
-    messageControl = new FormControl();
+    messageControl = new FormControl<string | null>(null);
 
     uniqueId!: string;
     defaultReplySubject!: string;

src/addons/mod/forum/pages/new-discussion/new-discussion.ts

@@ -70,7 +70,7 @@ export class AddonModForumNewDiscussionPage implements OnInit, OnDestroy, CanLea
     @ViewChild(CoreEditorRichTextEditorComponent) messageEditor!: CoreEditorRichTextEditorComponent;
 
     component = AddonModForumProvider.COMPONENT;
-    messageControl = new FormControl();
+    messageControl = new FormControl<string | null>(null);
     groupsLoaded = false;
     showGroups = false;
     hasOffline = false;

src/addons/mod/glossary/pages/edit/edit.ts

@@ -58,7 +58,7 @@ export class AddonModGlossaryEditPage implements OnInit, CanLeave {
     courseId!: number;
     loaded = false;
     glossary?: AddonModGlossaryGlossary;
-    definitionControl = new FormControl();
+    definitionControl = new FormControl<string | null>(null);
     categories: AddonModGlossaryCategory[] = [];
     showAliases = true;
     editorExtraParams: Record<string, unknown> = {};

src/addons/mod/lesson/services/lesson-helper.ts

@@ -369,7 +369,7 @@ export class AddonModLessonHelperProvider {
             };
 
             // Init the control.
-            essayQuestion.control = this.formBuilder.control('');
+            essayQuestion.control = this.formBuilder.control('', { nonNullable: true });
             questionForm.addControl(essayQuestion.textarea.name, essayQuestion.control);
         }
 
@@ -635,7 +635,7 @@ export type AddonModLessonInputQuestion = AddonModLessonQuestionBasicData & {
 export type AddonModLessonEssayQuestion = AddonModLessonQuestionBasicData & {
     useranswer?: string; // User answer, for reviewing.
     textarea?: AddonModLessonTextareaData; // Data for the textarea.
-    control?: FormControl; // Form control.
+    control?: FormControl<string>; // Form control.
 };
 
 /**

src/addons/mod/url/services/url.ts

@@ -157,14 +157,14 @@ export class AddonModUrlProvider {
         url = url || '';
 
         const matches = url.match(/\//g);
-        const extension = CoreMimetypeUtils.getFileExtension(url);
+        const extension = CoreMimetypeUtils.guessExtensionFromUrl(url);
 
         if (!matches || matches.length < 3 || url.slice(-1) === '/' || extension == 'php') {
             // Use default icon.
             return '';
         }
 
-        const icon = CoreMimetypeUtils.getFileIcon(url);
+        const icon = CoreMimetypeUtils.getExtensionIcon(extension ?? '');
 
         // We do not want to return those icon types, the module icon is more appropriate.
         if (icon === CoreMimetypeUtils.getFileIconForType('unknown') ||

src/addons/mod/wiki/pages/edit/edit.ts

@@ -47,7 +47,7 @@ export class AddonModWikiEditPage implements OnInit, OnDestroy, CanLeave {
     courseId?: number; // Course the wiki belongs to.
     title?: string; // Title to display.
     pageForm: FormGroup; // The form group.
-    contentControl: FormControl; // The FormControl for the page content.
+    contentControl: FormControl<string>; // The FormControl for the page content.
     canEditTitle = false; // Whether title can be edited.
     loaded = false; // Whether the data has been loaded.
     component = AddonModWikiProvider.COMPONENT; // Component to link the files to.
@@ -74,7 +74,7 @@ export class AddonModWikiEditPage implements OnInit, OnDestroy, CanLeave {
     constructor(
         protected formBuilder: FormBuilder,
     ) {
-        this.contentControl = this.formBuilder.control('');
+        this.contentControl = this.formBuilder.control('', { nonNullable: true });
         this.pageForm = this.formBuilder.group({});
     }
 

src/addons/mod/workshop/components/assessment-strategy/assessment-strategy.ts

@@ -73,7 +73,7 @@ export class AddonModWorkshopAssessmentStrategyComponent implements OnInit, OnDe
     assessmentStrategyLoaded = false;
     notSupported = false;
     feedbackText = '';
-    feedbackControl = new FormControl();
+    feedbackControl = new FormControl<string | null>(null);
     overallFeedkback = false;
     overallFeedkbackRequired = false;
     component = ADDON_MOD_WORKSHOP_COMPONENT;

src/addons/qtype/essay/component/essay.ts

@@ -32,7 +32,7 @@ import { CoreFileEntry } from '@services/file-helper';
 })
 export class AddonQtypeEssayComponent extends CoreQuestionBaseComponent<AddonModQuizEssayQuestion> {
 
-    formControl?: FormControl;
+    formControl?: FormControl<string | null>;
     attachments?: CoreFileEntry[];
     uploadFilesSupported = false;
 
@@ -52,7 +52,7 @@ export class AddonQtypeEssayComponent extends CoreQuestionBaseComponent<AddonMod
 
         this.initEssayComponent(this.review);
 
-        this.formControl = this.fb.control(this.question?.textarea?.text);
+        this.formControl = this.fb.control(this.question?.textarea?.text ?? null);
 
         if (this.question?.allowsAttachments && this.uploadFilesSupported && !this.review) {
             this.loadAttachments();

src/addons/userprofilefield/checkbox/component/checkbox.ts

@@ -27,20 +27,23 @@ import { CoreUtils } from '@services/utils/utils';
     templateUrl: 'addon-user-profile-field-checkbox.html',
     styleUrls: ['./checkbox.scss'],
 })
-export class AddonUserProfileFieldCheckboxComponent extends CoreUserProfileFieldBaseComponent {
+export class AddonUserProfileFieldCheckboxComponent extends CoreUserProfileFieldBaseComponent<boolean> {
 
     /**
      * Create the Form control.
      *
      * @returns Form control.
      */
-    protected createFormControl(field: AuthEmailSignupProfileField): FormControl {
+    protected createFormControl(field: AuthEmailSignupProfileField): FormControl<boolean> {
         const formData = {
             value: CoreUtils.isTrueOrOne(field.defaultdata),
             disabled: this.disabled,
         };
 
-        return new FormControl(formData, this.required && !field.locked ? Validators.requiredTrue : null);
+        return new FormControl(formData, {
+            validators: this.required && !field.locked ? Validators.requiredTrue : null,
+            nonNullable: true,
+        });
     }
 
 }

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

@@ -28,7 +28,7 @@ import { CoreUserProfileFieldBaseComponent } from '@features/user/classes/base-p
     selector: 'addon-user-profile-field-datetime',
     templateUrl: 'addon-user-profile-field-datetime.html',
 })
-export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileFieldBaseComponent {
+export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileFieldBaseComponent<string | undefined> {
 
     ionDateTimePresentation = 'date';
     min?: string;
@@ -84,13 +84,16 @@ export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileField
      *
      * @returns Form control.
      */
-    protected createFormControl(field: AuthEmailSignupProfileField): FormControl {
+    protected createFormControl(field: AuthEmailSignupProfileField): FormControl<string | undefined> {
         const formData = {
             value: field.defaultdata != '0' ? field.defaultdata : undefined,
             disabled: this.disabled,
         };
 
-        return new FormControl(formData, this.required && !field.locked ? Validators.required : null);
+        return new FormControl(formData, {
+            validators: this.required && !field.locked ? Validators.required : null,
+            nonNullable: true,
+        });
     }
 
 }

src/core/components/iframe/core-iframe.html

@@ -11,9 +11,17 @@
         </ion-button>
     </core-navbar-buttons>
 
-    <iframe #iframe class="core-iframe" [attr.id]="id" [ngStyle]="{'width': iframeWidth, 'height': iframeHeight}" [src]="safeUrl"
-        [attr.allowfullscreen]="allowFullscreen ? 'allowfullscreen' : null" [class.core-iframe-loading]="loading">
-    </iframe>
+    <!-- allowfullscreen cannot be set dynamically using attribute binding, define 2 iframe elements. -->
+    <ng-container *ngIf="allowFullscreen">
+        <iframe #iframe class="core-iframe" [attr.id]="id" [ngStyle]="{'width': iframeWidth, 'height': iframeHeight}" [src]="safeUrl"
+            allowfullscreen="true" [class.core-iframe-loading]="loading">
+        </iframe>
+    </ng-container>
+    <ng-container *ngIf="!allowFullscreen">
+        <iframe #iframe class="core-iframe" [attr.id]="id" [ngStyle]="{'width': iframeWidth, 'height': iframeHeight}" [src]="safeUrl"
+            [class.core-iframe-loading]="loading">
+        </iframe>
+    </ng-container>
 
     <ion-button *ngIf="!loading && displayHelp" expand="block" fill="clear" (click)="openIframeHelpModal()" aria-haspopup="dialog"
         class="core-button-as-link core-iframe-help">

src/core/components/iframe/iframe.ts

@@ -85,12 +85,6 @@ export class CoreIframeComponent implements OnChanges, OnDestroy {
 
         this.initialized = true;
 
-        this.iframeWidth = (this.iframeWidth && CoreDomUtils.formatPixelsSize(this.iframeWidth)) || '100%';
-        this.iframeHeight = (this.iframeHeight && CoreDomUtils.formatPixelsSize(this.iframeHeight)) || '100%';
-        this.allowFullscreen = CoreUtils.isTrueOrOne(this.allowFullscreen);
-        this.showFullscreenOnToolbar = CoreUtils.isTrueOrOne(this.showFullscreenOnToolbar);
-        this.autoFullscreenOnRotate = CoreUtils.isTrueOrOne(this.autoFullscreenOnRotate);
-
         if (this.showFullscreenOnToolbar || this.autoFullscreenOnRotate) {
             // Leave fullscreen when navigating.
             this.navSubscription = Router.events
@@ -157,6 +151,22 @@ export class CoreIframeComponent implements OnChanges, OnDestroy {
      * Detect changes on input properties.
      */
     async ngOnChanges(changes: {[name: string]: SimpleChange }): Promise<void> {
+        if (changes.iframeWidth) {
+            this.iframeWidth = (this.iframeWidth && CoreDomUtils.formatPixelsSize(this.iframeWidth)) || '100%';
+        }
+        if (changes.iframeHeight) {
+            this.iframeHeight = (this.iframeHeight && CoreDomUtils.formatPixelsSize(this.iframeHeight)) || '100%';
+        }
+        if (changes.allowFullscreen) {
+            this.allowFullscreen = CoreUtils.isTrueOrOne(this.allowFullscreen);
+        }
+        if (changes.showFullscreenOnToolbar) {
+            this.showFullscreenOnToolbar = CoreUtils.isTrueOrOne(this.showFullscreenOnToolbar);
+        }
+        if (changes.autoFullscreenOnRotate) {
+            this.autoFullscreenOnRotate = CoreUtils.isTrueOrOne(this.autoFullscreenOnRotate);
+        }
+
         if (!changes.src) {
             return;
         }

src/core/components/input-errors/input-errors.ts

@@ -40,7 +40,7 @@ import { FormControl } from '@angular/forms';
 })
 export class CoreInputErrorsComponent implements OnInit, OnChanges {
 
-    @Input() control?: FormControl; // Needed to be able to check the validity of the input.
+    @Input() control?: FormControl<unknown>; // Needed to be able to check the validity of the input.
     @Input() errorMessages: Record<string, string> = {}; // Error messages to show. Keys must be the name of the error.
     @Input() errorText = ''; // Set other non automatic errors.
     errorKeys: string[] = [];

src/core/components/sites-list/sites-list.ts

@@ -47,8 +47,8 @@ export class CoreSitesListComponent<T extends CoreSiteBasicInfo> {
     @Input() currentSiteClickable?: boolean; // If set, specify a different clickable value for current site.
     @Output() onSiteClicked = new EventEmitter<T>();
 
-    @ContentChild('siteItem') siteItemTemplate?: TemplateRef<unknown>;
-    @ContentChild('siteLabel') siteLabelTemplate?: TemplateRef<unknown>;
+    @ContentChild('siteItem') siteItemTemplate?: TemplateRef<{site: T; isCurrentSite: boolean}>;
+    @ContentChild('siteLabel') siteLabelTemplate?: TemplateRef<{site: T; isCurrentSite: boolean}>;
 
     /**
      * Check whether a site is clickable.

src/core/components/swipe-slides/swipe-slides.ts

@@ -67,7 +67,7 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
         }, 0);
     }
 
-    @ContentChild(TemplateRef) template?: TemplateRef<unknown>; // Template defined by the content.
+    @ContentChild(TemplateRef) template?: TemplateRef<{item: Item; active: boolean}>; // Template defined by the content.
 
     protected hostElement: HTMLElement;
     protected unsubscribe?: () => void;

src/core/components/tabs/tab.ts

@@ -68,7 +68,7 @@ export class CoreTabComponent implements OnInit, OnDestroy, CoreTabBase {
     @Input() id = ''; // An ID to identify the tab.
     @Output() ionSelect: EventEmitter<CoreTabComponent> = new EventEmitter<CoreTabComponent>();
 
-    @ContentChild(TemplateRef) template?: TemplateRef<unknown>; // Template defined by the content.
+    @ContentChild(TemplateRef) template?: TemplateRef<void>; // Template defined by the content.
 
     element: HTMLElement; // The core-tab element.
     loaded = false;