From 6622ecf733a16ea9fb2c4bcd30c12f024666605c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 14:23:33 +0100
Subject: [PATCH 1/6] MOBILE-3814 my: Fix loading spinner position

---
 src/core/features/courses/pages/my/my.scss | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/core/features/courses/pages/my/my.scss b/src/core/features/courses/pages/my/my.scss
index 05e886016..4d244fdc8 100644
--- a/src/core/features/courses/pages/my/my.scss
+++ b/src/core/features/courses/pages/my/my.scss
@@ -1,3 +1,10 @@
 :host ::ng-deep ion-item-divider {
     display: none !important;
 }
+:host ::ng-deep core-loading {
+    --internal-loading-inline-min-height: calc(100vh - var(--core-header-toolbar-height));
+}
+
+:host-context(ion-tabs.placement-bottom) ::ng-deep core-loading {
+    --internal-loading-inline-min-height: calc(100vh - var(--core-header-toolbar-height) - var(--bottom-tabs-size) - 2px);
+}

From d8a1799b9f3f229199f73317fd1e0a3a3c6f90ab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 14:25:57 +0100
Subject: [PATCH 2/6] MOBILE-3814 UI: Change caret to chevrons

---
 .../recentlyaccesseditems.scss                |  3 +++
 .../group-conversations.html                  | 18 ++++++++-----
 .../mod/forum/components/post/post.html       |  6 +++--
 .../pages/new-discussion/new-discussion.html  |  6 +++--
 .../core-horizontal-scroll-controls.html      | 26 +++++--------------
 .../features/grades/pages/course/course.html  |  2 +-
 .../features/grades/pages/course/course.scss  |  5 ++++
 src/theme/globals.mixins.scss                 |  2 +-
 src/theme/theme.light.scss                    |  4 +++
 9 files changed, 40 insertions(+), 32 deletions(-)

diff --git a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/recentlyaccesseditems.scss b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/recentlyaccesseditems.scss
index 62c797d58..1f7d02104 100644
--- a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/recentlyaccesseditems.scss
+++ b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/recentlyaccesseditems.scss
@@ -3,6 +3,9 @@
 :host {
     .core-horizontal-scroll div.core-horizontal-scroll-item {
         @include horizontal_scroll_item(80%, 250px, 300px);
+        ion-card {
+            height: auto;
+        }
     }
 
     .core-course-module-handler {
diff --git a/src/addons/messages/pages/group-conversations/group-conversations.html b/src/addons/messages/pages/group-conversations/group-conversations.html
index 5d6e5b57b..6b476b60f 100644
--- a/src/addons/messages/pages/group-conversations/group-conversations.html
+++ b/src/addons/messages/pages/group-conversations/group-conversations.html
@@ -40,9 +40,11 @@
                     [attr.aria-label]="(favourites.expanded ? 'core.collapse' : 'core.expand') | translate"
                     [attr.aria-expanded]="favourites.expanded" aria-controls="addon-messages-groupconversations-favourite" role="heading"
                     detail="false">
-                    <ion-icon *ngIf="!favourites.expanded" name="fas-caret-right" flip-rtl slot="start" aria-hidden="true">
+                    <ion-icon *ngIf="!favourites.expanded" name="fas-chevron-right" flip-rtl slot="start" aria-hidden="true"
+                        class="expandable-status-icon">
                     </ion-icon>
-                    <ion-icon *ngIf="favourites.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
+                    <ion-icon *ngIf="favourites.expanded" name="fas-chevron-down" slot="start" aria-hidden="true"
+                        class="expandable-status-icon"></ion-icon>
                     <ion-label>
                         <h2>{{ 'core.favourites' | translate }} ({{ favourites.count }})</h2>
                     </ion-label>
@@ -74,8 +76,10 @@
                 <ion-item button class="divider ion-text-wrap" (click)="toggle(group)" sticky="true"
                     [attr.aria-label]="(group.expanded ? 'core.collapse' : 'core.expand') | translate" [attr.aria-expanded]="group.expanded"
                     aria-controls="addon-messages-groupconversations-group" role="heading" detail="false">
-                    <ion-icon *ngIf="!group.expanded" name="fas-caret-right" flip-rtl slot="start" aria-hidden="true"></ion-icon>
-                    <ion-icon *ngIf="group.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
+                    <ion-icon *ngIf="!group.expanded" name="fas-chevron-right" flip-rtl slot="start" aria-hidden="true"
+                        class="expandable-status-icon"></ion-icon>
+                    <ion-icon *ngIf="group.expanded" name="fas-chevron-down" slot="start" aria-hidden="true" class="expandable-status-icon">
+                    </ion-icon>
                     <ion-label>
                         <h2>{{ 'addon.messages.groupconversations' | translate }} ({{ group.count }})</h2>
                     </ion-label>
@@ -107,9 +111,11 @@
                     [attr.aria-label]="(individual.expanded ? 'core.collapse' : 'core.expand') | translate"
                     [attr.aria-expanded]="individual.expanded" aria-controls="addon-messages-groupconversations-individual" role="heading"
                     detail="false">
-                    <ion-icon *ngIf="!individual.expanded" name="fas-caret-right" flip-rtl slot="start" aria-hidden="true">
+                    <ion-icon *ngIf="!individual.expanded" name="fas-chevron-right" flip-rtl slot="start" aria-hidden="true"
+                        class="expandable-status-icon">
                     </ion-icon>
-                    <ion-icon *ngIf="individual.expanded" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
+                    <ion-icon *ngIf="individual.expanded" name="fas-chevron-down" slot="start" aria-hidden="true"
+                        class="expandable-status-icon"></ion-icon>
                     <ion-label>
                         <h2>{{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }})</h2>
                     </ion-label>
diff --git a/src/addons/mod/forum/components/post/post.html b/src/addons/mod/forum/components/post/post.html
index 77feb0f7e..09ea67c71 100644
--- a/src/addons/mod/forum/components/post/post.html
+++ b/src/addons/mod/forum/components/post/post.html
@@ -118,8 +118,10 @@
             <ion-item button class="divider ion-text-wrap" (click)="toggleAdvanced()" detail="false" [attr.aria-expanded]="advanced"
                 [attr.aria-controls]="'addon-forum-reply-edit-form-advanced-' + uniqueId"
                 [attr.aria-label]="(advanced ? 'core.hideadvanced' : 'core.showadvanced') | translate">
-                <ion-icon *ngIf="!advanced" name="fas-caret-right" flip-rtl slot="start" aria-hidden="true"></ion-icon>
-                <ion-icon *ngIf="advanced" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
+                <ion-icon *ngIf="!advanced" name="fas-chevron-right" flip-rtl slot="start" aria-hidden="true"
+                    class="expandable-status-icon"></ion-icon>
+                <ion-icon *ngIf="advanced" name="fas-chevron-down" slot="start" aria-hidden="true" class="expandable-status-icon">
+                </ion-icon>
                 <ion-label>
                     <h2>{{ 'addon.mod_forum.advanced' | translate }}</h2>
                 </ion-label>
diff --git a/src/addons/mod/forum/pages/new-discussion/new-discussion.html b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
index daebbcd75..e8b2c7232 100644
--- a/src/addons/mod/forum/pages/new-discussion/new-discussion.html
+++ b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
@@ -34,8 +34,10 @@
             <ion-item button class="divider ion-text-wrap" (click)="toggleAdvanced()" detail="false" [attr.aria-expanded]="advanced"
                 [attr.aria-label]="(advanced ? 'core.hideadvanced' : 'core.showadvanced') | translate" role="heading"
                 aria-controls="addon-mod-forum-new-discussion-advanced">
-                <ion-icon *ngIf="!advanced" name="fas-caret-right" flip-rtl slot="start" aria-hidden="true"></ion-icon>
-                <ion-icon *ngIf="advanced" name="fas-caret-down" slot="start" aria-hidden="true"></ion-icon>
+                <ion-icon *ngIf="!advanced" name="fas-chevron-right" flip-rtl slot="start" aria-hidden="true"
+                    class="expandable-status-icon"></ion-icon>
+                <ion-icon *ngIf="advanced" name="fas-chevron-down" slot="start" aria-hidden="true" class="expandable-status-icon">
+                </ion-icon>
                 <ion-label>
                     <h2>{{ 'addon.mod_forum.advanced' | translate }}</h2>
                 </ion-label>
diff --git a/src/core/components/horizontal-scroll-controls/core-horizontal-scroll-controls.html b/src/core/components/horizontal-scroll-controls/core-horizontal-scroll-controls.html
index 7f3091787..e7d55fa25 100644
--- a/src/core/components/horizontal-scroll-controls/core-horizontal-scroll-controls.html
+++ b/src/core/components/horizontal-scroll-controls/core-horizontal-scroll-controls.html
@@ -1,23 +1,9 @@
-<ion-button
-    fill="clear"
-    color="dark"
-    (click)="scroll('backward')"
-    [hidden]="scrollPosition === 'hidden'"
-    [disabled]="scrollPosition === 'start'"
-    [attr.aria-label]="'core.scrollbackward' | translate"
-    [attr.aria-controls]="targetId"
->
-    <ion-icon name="fas-caret-left" slot="icon-only" aria-hidden="true"></ion-icon>
+<ion-button fill="clear" color="dark" (click)="scroll('backward')" [hidden]="scrollPosition === 'hidden'"
+    [disabled]="scrollPosition === 'start'" [attr.aria-label]="'core.scrollbackward' | translate" [attr.aria-controls]="targetId">
+    <ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
 </ion-button>
 
-<ion-button
-    fill="clear"
-    color="dark"
-    (click)="scroll('forward')"
-    [hidden]="scrollPosition === 'hidden'"
-    [disabled]="scrollPosition === 'end'"
-    [attr.aria-label]="'core.scrollforward' | translate"
-    [attr.aria-controls]="targetId"
->
-    <ion-icon name="fas-caret-right" slot="icon-only" aria-hidden="true"></ion-icon>
+<ion-button fill="clear" color="dark" (click)="scroll('forward')" [hidden]="scrollPosition === 'hidden'"
+    [disabled]="scrollPosition === 'end'" [attr.aria-label]="'core.scrollforward' | translate" [attr.aria-controls]="targetId">
+    <ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
 </ion-button>
diff --git a/src/core/features/grades/pages/course/course.html b/src/core/features/grades/pages/course/course.html
index e5e717bbe..497f485a6 100644
--- a/src/core/features/grades/pages/course/course.html
+++ b/src/core/features/grades/pages/course/course.html
@@ -37,7 +37,7 @@
                                 </td>
                                 <th class="core-grades-table-gradeitem ion-text-start" [attr.colspan]="row.colspan">
                                     <ion-icon *ngIf="row.expandable && showSummary" aria-hidden="true" slot="start"
-                                        [name]="row.expanded ? 'fas-caret-down' : 'fas-caret-right'">
+                                        [name]="row.expanded ? 'fas-chevron-down' : 'fas-chevron-right'" class="expandable-status-icon">
                                     </ion-icon>
                                     <ion-icon *ngIf="row.icon" name="{{row.icon}}" slot="start" [attr.aria-label]="row.iconAlt">
                                     </ion-icon>
diff --git a/src/core/features/grades/pages/course/course.scss b/src/core/features/grades/pages/course/course.scss
index 8f3299ff6..e93bebfff 100644
--- a/src/core/features/grades/pages/course/course.scss
+++ b/src/core/features/grades/pages/course/course.scss
@@ -100,6 +100,11 @@
             @include margin(null, null, null, 5px);
         }
 
+        .expandable-status-icon {
+            font-size: 14px;
+            @include margin-horizontal(0, 2px);
+        }
+
     }
 
     .core-grades-table-feedback {
diff --git a/src/theme/globals.mixins.scss b/src/theme/globals.mixins.scss
index 84089a4dd..dc509523f 100644
--- a/src/theme/globals.mixins.scss
+++ b/src/theme/globals.mixins.scss
@@ -209,7 +209,7 @@
         --vertical-margin: 10px;
         --horizontal-margin: 10px;
 
-        width: calc(100% - var(--vertical-margin) - var(--vertical-margin));
+        width: calc(100% - var(--horizontal-margin) - var(--horizontal-margin));
         height: calc(100% - var(--vertical-margin) - var(--vertical-margin));
         margin: var(--vertical-margin) var(--horizontal-margin);
 
diff --git a/src/theme/theme.light.scss b/src/theme/theme.light.scss
index f4d379c0e..908669935 100644
--- a/src/theme/theme.light.scss
+++ b/src/theme/theme.light.scss
@@ -215,6 +215,10 @@
         --color: var(--item-divider-color);
         --min-height: var(--item-divider-min-height);
         min-height: var(--min-height);
+
+        .expandable-status-icon {
+            font-size: 18px;
+        }
     }
 
     --spacer-background: var(--item-divider-background);

From 46dada14cbaed07e86bc34317b0c93c6ffffe315 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 14:52:40 +0100
Subject: [PATCH 3/6] MOBILE-3814 chore: Remove deprecated String.substr calls

---
 .../services/handlers/mathjaxloader.ts        |  4 ++--
 src/addons/mod/chat/services/chat-helper.ts   |  6 ++---
 .../mod/data/fields/date/services/handler.ts  |  8 +++----
 .../mod/folder/services/folder-helper.ts      |  6 ++---
 .../mod/glossary/components/index/index.ts    |  2 +-
 src/addons/mod/imscp/services/imscp.ts        |  2 +-
 src/addons/mod/lesson/services/lesson.ts      | 10 ++++----
 src/addons/mod/page/services/page-helper.ts   |  2 +-
 src/addons/mod/quiz/services/quiz-offline.ts  |  2 +-
 .../mod/resource/services/resource-helper.ts  |  2 +-
 src/addons/mod/scorm/classes/data-model-12.ts | 10 ++++----
 src/addons/mod/scorm/services/scorm.ts        |  4 ++--
 src/addons/mod/url/services/url.ts            |  4 ++--
 .../services/handlers/calculated.ts           |  2 +-
 src/core/classes/interceptor.ts               |  2 +-
 src/core/classes/sqlitedb.ts                  |  6 ++---
 src/core/directives/fa-icon.ts                |  6 ++---
 src/core/directives/link.ts                   |  4 ++--
 .../contentlinks/classes/base-handler.ts      |  2 +-
 .../emulator/services/file-transfer.ts        |  2 +-
 src/core/features/emulator/services/file.ts   |  2 +-
 src/core/features/emulator/services/zip.ts    |  6 ++---
 .../features/grades/services/grades-helper.ts |  4 ++--
 .../features/h5p/classes/content-validator.ts | 14 +++++------
 src/core/features/h5p/classes/core.ts         |  2 +-
 .../question/services/question-helper.ts      |  2 +-
 .../settings/pages/deviceinfo/deviceinfo.ts   |  2 +-
 src/core/services/file.ts                     | 12 +++++-----
 src/core/services/filepool.ts                 | 10 ++++----
 src/core/services/lang.ts                     |  2 +-
 src/core/services/urlschemes.ts               |  2 +-
 src/core/services/utils/iframe.ts             |  4 ++--
 src/core/services/utils/mimetype.ts           | 16 ++++++-------
 src/core/services/utils/text.ts               | 12 +++++-----
 src/core/services/utils/url.ts                |  4 ++--
 src/core/services/utils/utils.ts              |  2 +-
 src/core/singletons/colors.ts                 |  8 +++----
 src/core/singletons/locutus.ts                | 24 +++++++++----------
 src/core/singletons/text.ts                   |  2 +-
 src/core/singletons/url.ts                    |  2 +-
 src/core/singletons/window.ts                 |  2 +-
 41 files changed, 110 insertions(+), 110 deletions(-)

diff --git a/src/addons/filter/mathjaxloader/services/handlers/mathjaxloader.ts b/src/addons/filter/mathjaxloader/services/handlers/mathjaxloader.ts
index 2f9ae9056..40f83f4ba 100644
--- a/src/addons/filter/mathjaxloader/services/handlers/mathjaxloader.ts
+++ b/src/addons/filter/mathjaxloader/services/handlers/mathjaxloader.ts
@@ -190,7 +190,7 @@ export class AddonFilterMathJaxLoaderHandlerService extends CoreFilterDefaultHan
     protected insertSpan(text: string, start: number, end: number): string {
         return CoreTextUtils.substrReplace(
             text,
-            '<span class="nolink">' + text.substr(start, end - start + 1) + '</span>',
+            '<span class="nolink">' + text.substring(start, end - start + 1) + '</span>',
             start,
             end - start + 1,
         );
@@ -265,7 +265,7 @@ export class AddonFilterMathJaxLoaderHandlerService extends CoreFilterDefaultHan
      */
     protected fixUseUrls(node: Element): void {
         Array.from(node.querySelectorAll('use')).forEach((useElem) => {
-            useElem.setAttribute('href', useElem.href.baseVal.substr(useElem.href.baseVal.indexOf('#')));
+            useElem.setAttribute('href', useElem.href.baseVal.substring(useElem.href.baseVal.indexOf('#')));
         });
     }
 
diff --git a/src/addons/mod/chat/services/chat-helper.ts b/src/addons/mod/chat/services/chat-helper.ts
index fa5764f8a..d6f827fe4 100644
--- a/src/addons/mod/chat/services/chat-helper.ts
+++ b/src/addons/mod/chat/services/chat-helper.ts
@@ -53,14 +53,14 @@ export class AddonModChatHelperProvider {
         formattedMessage.message = formattedMessage.message.trim();
 
         formattedMessage.showDate = this.showDate(message, prevMessage);
-        formattedMessage.beep = (message.message.substr(0, 5) == 'beep ' && message.message.substr(5).trim()) || undefined;
+        formattedMessage.beep = (message.message.substring(0, 5) == 'beep ' && message.message.substring(5).trim()) || undefined;
 
         formattedMessage.special = !!formattedMessage.beep || (<AddonModChatSessionMessage> message).issystem ||
             (<AddonModChatMessage> message).system;
 
-        if (formattedMessage.message.substr(0, 4) == '/me ') {
+        if (formattedMessage.message.substring(0, 4) == '/me ') {
             formattedMessage.special = true;
-            formattedMessage.message = formattedMessage.message.substr(4).trim();
+            formattedMessage.message = formattedMessage.message.substring(4).trim();
         }
 
         if (!formattedMessage.special && formattedMessage.message.match(patternTo)) {
diff --git a/src/addons/mod/data/fields/date/services/handler.ts b/src/addons/mod/data/fields/date/services/handler.ts
index 454b91d25..221611f66 100644
--- a/src/addons/mod/data/fields/date/services/handler.ts
+++ b/src/addons/mod/data/fields/date/services/handler.ts
@@ -52,7 +52,7 @@ export class AddonModDataFieldDateHandlerService implements AddonModDataFieldHan
         const enabledName = 'f_' + field.id + '_z';
 
         if (inputData[enabledName] && typeof inputData[fieldName] == 'string') {
-            const date = inputData[fieldName].substr(0, 10).split('-');
+            const date = inputData[fieldName].substring(0, 10).split('-');
 
             return [
                 {
@@ -87,7 +87,7 @@ export class AddonModDataFieldDateHandlerService implements AddonModDataFieldHan
             return [];
         }
 
-        const date = inputData[fieldName].substr(0, 10).split('-');
+        const date = inputData[fieldName].substring(0, 10).split('-');
 
         return [
             {
@@ -117,10 +117,10 @@ export class AddonModDataFieldDateHandlerService implements AddonModDataFieldHan
         originalFieldData: AddonModDataEntryField,
     ): boolean {
         const fieldName = 'f_' + field.id;
-        const input = inputData[fieldName] && inputData[fieldName].substr(0, 10) || '';
+        const input = inputData[fieldName] && inputData[fieldName].substring(0, 10) || '';
 
         const content = (originalFieldData && originalFieldData?.content &&
-                CoreTimeUtils.toDatetimeFormat(parseInt(originalFieldData.content, 10) * 1000).substr(0, 10)) || '';
+                CoreTimeUtils.toDatetimeFormat(parseInt(originalFieldData.content, 10) * 1000).substring(0, 10)) || '';
 
         return input != content;
     }
diff --git a/src/addons/mod/folder/services/folder-helper.ts b/src/addons/mod/folder/services/folder-helper.ts
index 677d48fb5..295a0d46e 100644
--- a/src/addons/mod/folder/services/folder-helper.ts
+++ b/src/addons/mod/folder/services/folder-helper.ts
@@ -53,10 +53,10 @@ export class AddonModFolderHelperProvider {
             let completePath = '';
 
             // Remove first and last slash if needed.
-            if (path.substr(0, 1) === '/') {
-                path = path.substr(1);
+            if (path.substring(0, 1) === '/') {
+                path = path.substring(1);
             }
-            if (path.substr(path.length - 1) === '/') {
+            if (path.substring(path.length - 1) === '/') {
                 path = path.slice(0, -1);
             }
 
diff --git a/src/addons/mod/glossary/components/index/index.ts b/src/addons/mod/glossary/components/index/index.ts
index beb7aad9c..7cf42ded3 100644
--- a/src/addons/mod/glossary/components/index/index.ts
+++ b/src/addons/mod/glossary/components/index/index.ts
@@ -292,7 +292,7 @@ export class AddonModGlossaryIndexComponent extends CoreCourseModuleMainActivity
                     // Try to get the first letter without HTML tags.
                     const noTags = CoreTextUtils.cleanTags(entry.concept);
 
-                    return (noTags || entry.concept).substr(0, 1).toUpperCase();
+                    return (noTags || entry.concept).substring(0, 1).toUpperCase();
                 };
 
                 this.getDivider = getDivider;
diff --git a/src/addons/mod/imscp/services/imscp.ts b/src/addons/mod/imscp/services/imscp.ts
index 88cae637e..121577ea3 100644
--- a/src/addons/mod/imscp/services/imscp.ts
+++ b/src/addons/mod/imscp/services/imscp.ts
@@ -155,7 +155,7 @@ export class AddonModImscpProvider {
             }
 
             const filePath = CoreTextUtils.concatenatePaths(item.filepath, item.filename);
-            const filePathAlt = filePath.charAt(0) === '/' ? filePath.substr(1) : '/' + filePath;
+            const filePathAlt = filePath.charAt(0) === '/' ? filePath.substring(1) : '/' + filePath;
 
             // Check if it's main file.
             return filePath === targetFilePath || filePathAlt === targetFilePath;
diff --git a/src/addons/mod/lesson/services/lesson.ts b/src/addons/mod/lesson/services/lesson.ts
index 5f78849ec..7d1418032 100644
--- a/src/addons/mod/lesson/services/lesson.ts
+++ b/src/addons/mod/lesson/services/lesson.ts
@@ -760,8 +760,8 @@ export class AddonModLessonProvider {
             let ignoreCase = '';
 
             if (useRegExp) {
-                if (expectedAnswer.substr(-2) == '/i') {
-                    expectedAnswer = expectedAnswer.substr(0, expectedAnswer.length - 2);
+                if (expectedAnswer.substring(-2) == '/i') {
+                    expectedAnswer = expectedAnswer.substring(0, expectedAnswer.length - 2);
                     ignoreCase = 'i';
                 }
             } else {
@@ -792,12 +792,12 @@ export class AddonModLessonProvider {
                         isMatch = true;
                     }
                 } else { // We are using regular expressions analysis.
-                    const startCode = expectedAnswer.substr(0, 2);
+                    const startCode = expectedAnswer.substring(0, 2);
 
                     switch (startCode){
                         // 1- Check for absence of required string in studentAnswer (coded by initial '--').
                         case '--':
-                            expectedAnswer = expectedAnswer.substr(2);
+                            expectedAnswer = expectedAnswer.substring(2);
                             if (!studentAnswer.match(new RegExp('^' + expectedAnswer + '$', ignoreCase))) {
                                 isMatch = true;
                             }
@@ -805,7 +805,7 @@ export class AddonModLessonProvider {
 
                         // 2- Check for code for marking wrong strings (coded by initial '++').
                         case '++': {
-                            expectedAnswer = expectedAnswer.substr(2);
+                            expectedAnswer = expectedAnswer.substring(2);
 
                             // Check for one or several matches.
                             const matches = studentAnswer.match(new RegExp(expectedAnswer, 'g' + ignoreCase));
diff --git a/src/addons/mod/page/services/page-helper.ts b/src/addons/mod/page/services/page-helper.ts
index a57f37e6e..c993c1bf9 100644
--- a/src/addons/mod/page/services/page-helper.ts
+++ b/src/addons/mod/page/services/page-helper.ts
@@ -52,7 +52,7 @@ export class AddonModPageHelperProvider {
                 let key = content.filename;
                 if (content.filepath !== '/') {
                     // Add the folders without the leading slash.
-                    key = content.filepath.substr(1) + key;
+                    key = content.filepath.substring(1) + key;
                 }
                 paths[CoreTextUtils.decodeURIComponent(key)] = url;
             }
diff --git a/src/addons/mod/quiz/services/quiz-offline.ts b/src/addons/mod/quiz/services/quiz-offline.ts
index 4b96ba247..70c72eab5 100644
--- a/src/addons/mod/quiz/services/quiz-offline.ts
+++ b/src/addons/mod/quiz/services/quiz-offline.ts
@@ -54,7 +54,7 @@ export class AddonModQuizOfflineProvider {
             if (!questionsWithAnswers[slot]) {
                 questionsWithAnswers[slot] = {
                     answers: {},
-                    prefix: name.substr(0, name.indexOf(nameWithoutPrefix)),
+                    prefix: name.substring(0, name.indexOf(nameWithoutPrefix)),
                 };
             }
             questionsWithAnswers[slot].answers[nameWithoutPrefix] = answers[name];
diff --git a/src/addons/mod/resource/services/resource-helper.ts b/src/addons/mod/resource/services/resource-helper.ts
index f0975eacf..943bee509 100644
--- a/src/addons/mod/resource/services/resource-helper.ts
+++ b/src/addons/mod/resource/services/resource-helper.ts
@@ -70,7 +70,7 @@ export class AddonModResourceHelperProvider {
         let mainFilePath = mainFile.filename;
 
         if (mainFile.filepath !== '/') {
-            mainFilePath = mainFile.filepath.substr(1) + mainFilePath;
+            mainFilePath = mainFile.filepath.substring(1) + mainFilePath;
         }
 
         try {
diff --git a/src/addons/mod/scorm/classes/data-model-12.ts b/src/addons/mod/scorm/classes/data-model-12.ts
index 06d29525a..97889bfdb 100644
--- a/src/addons/mod/scorm/classes/data-model-12.ts
+++ b/src/addons/mod/scorm/classes/data-model-12.ts
@@ -201,7 +201,7 @@ export class AddonModScormDataModel12 {
 
         for (const element in this.currentUserData[this.scoId].userdata) {
             // Ommit for example the nav. elements and the session time element.
-            if (element.substr(0, 3) != 'cmi' || element == 'cmi.core.session_time') {
+            if (element.substring(0, 3) != 'cmi' || element == 'cmi.core.session_time') {
                 continue;
             }
 
@@ -748,16 +748,16 @@ export class AddonModScormDataModel12 {
                     const childrenStr = '._children';
                     const countStr = '._count';
 
-                    if (elementModel.substr(elementModel.length - childrenStr.length, elementModel.length) == childrenStr) {
-                        const parentModel = elementModel.substr(0, elementModel.length - childrenStr.length);
+                    if (elementModel.substring(elementModel.length - childrenStr.length, elementModel.length) == childrenStr) {
+                        const parentModel = elementModel.substring(0, elementModel.length - childrenStr.length);
 
                         if (this.dataModel[this.scoId][parentModel] !== undefined) {
                             this.errorCode = '202';
                         } else {
                             this.errorCode = '201';
                         }
-                    } else if (elementModel.substr(elementModel.length - countStr.length, elementModel.length) == countStr) {
-                        const parentModel = elementModel.substr(0, elementModel.length - countStr.length);
+                    } else if (elementModel.substring(elementModel.length - countStr.length, elementModel.length) == countStr) {
+                        const parentModel = elementModel.substring(0, elementModel.length - countStr.length);
 
                         if (this.dataModel[this.scoId][parentModel] !== undefined) {
                             this.errorCode = '203';
diff --git a/src/addons/mod/scorm/services/scorm.ts b/src/addons/mod/scorm/services/scorm.ts
index 528e68c6a..be1ac928c 100644
--- a/src/addons/mod/scorm/services/scorm.ts
+++ b/src/addons/mod/scorm/services/scorm.ts
@@ -947,7 +947,7 @@ export class AddonModScormProvider {
         if (parameters) {
             const connector = launchUrl.indexOf('?') > -1 ? '&' : '?';
             if (parameters.charAt(0) == '?') {
-                parameters = parameters.substr(1);
+                parameters = parameters.substring(1);
             }
 
             launchUrl += connector + parameters;
@@ -1315,7 +1315,7 @@ export class AddonModScormProvider {
 
         if (link.match(/^https?:\/\//i) && !CoreUrlUtils.isLocalFileUrl(link)) {
             return true;
-        } else if (link.substr(0, 4) == 'www.') {
+        } else if (link.substring(0, 4) == 'www.') {
             return true;
         }
 
diff --git a/src/addons/mod/url/services/url.ts b/src/addons/mod/url/services/url.ts
index 0ccff66ed..86a2ad5bb 100644
--- a/src/addons/mod/url/services/url.ts
+++ b/src/addons/mod/url/services/url.ts
@@ -68,7 +68,7 @@ export class AddonModUrlProvider {
         const download = ['application/zip', 'application/x-tar', 'application/g-zip', 'application/pdf', 'text/html'];
         let mimetype = CoreMimetypeUtils.getMimeType(extension);
 
-        if (url.externalurl.indexOf('.php') != -1 || url.externalurl.substr(-1) === '/' ||
+        if (url.externalurl.indexOf('.php') != -1 || url.externalurl.substring(-1) === '/' ||
                 (url.externalurl.indexOf('//') != -1 && url.externalurl.match(/\//g)?.length == 2)) {
             // Seems to be a web, use HTML mimetype.
             mimetype = 'text/html';
@@ -158,7 +158,7 @@ export class AddonModUrlProvider {
         const matches = url.match(/\//g);
         const extension = CoreMimetypeUtils.getFileExtension(url);
 
-        if (!matches || matches.length < 3 || url.substr(-1) === '/' || extension == 'php') {
+        if (!matches || matches.length < 3 || url.substring(-1) === '/' || extension == 'php') {
             // Use default icon.
             return '';
         }
diff --git a/src/addons/qtype/calculated/services/handlers/calculated.ts b/src/addons/qtype/calculated/services/handlers/calculated.ts
index cac9c191d..887a5ff24 100644
--- a/src/addons/qtype/calculated/services/handlers/calculated.ts
+++ b/src/addons/qtype/calculated/services/handlers/calculated.ts
@@ -226,7 +226,7 @@ export class AddonQtypeCalculatedHandlerService implements CoreQuestionHandler {
         }
 
         const numberString = match[0];
-        const unit = unitsLeft ? answer.substr(0, answer.length - match[0].length) : answer.substr(match[0].length);
+        const unit = unitsLeft ? answer.substring(0, answer.length - match[0].length) : answer.substring(match[0].length);
 
         // No need to calculate the multiplier.
         return { answer: Number(numberString), unit };
diff --git a/src/core/classes/interceptor.ts b/src/core/classes/interceptor.ts
index 5ddbe7d11..976b52e3e 100644
--- a/src/core/classes/interceptor.ts
+++ b/src/core/classes/interceptor.ts
@@ -58,7 +58,7 @@ export class CoreInterceptor implements HttpInterceptor {
             }
         }
 
-        return query.length ? query.substr(0, query.length - 1) : query;
+        return query.length ? query.substring(0, query.length - 1) : query;
     }
 
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
diff --git a/src/core/classes/sqlitedb.ts b/src/core/classes/sqlitedb.ts
index c84c52ccd..0aec0714b 100644
--- a/src/core/classes/sqlitedb.ts
+++ b/src/core/classes/sqlitedb.ts
@@ -600,7 +600,7 @@ export class SQLiteDB {
             sql = equal ? '= ?' : '<> ?';
             params = Array.isArray(items) ? items : [items];
         } else {
-            sql = (equal ? '' : 'NOT ') + 'IN (' + ',?'.repeat(items.length).substr(1) + ')';
+            sql = (equal ? '' : 'NOT ') + 'IN (' + ',?'.repeat(items.length).substring(1) + ')';
             params = items;
         }
 
@@ -801,7 +801,7 @@ export class SQLiteDB {
 
         const keys = Object.keys(data);
         const fields = keys.join(',');
-        const questionMarks = ',?'.repeat(keys.length).substr(1);
+        const questionMarks = ',?'.repeat(keys.length).substring(1);
 
         return {
             sql: `INSERT OR REPLACE INTO ${table} (${fields}) VALUES (${questionMarks})`,
@@ -1139,7 +1139,7 @@ export class SQLiteDB {
             if (params.length == 1) {
                 sql = sql + field + ' = ?';
             } else {
-                const questionMarks = ',?'.repeat(params.length).substr(1);
+                const questionMarks = ',?'.repeat(params.length).substring(1);
                 sql = sql + field + ' IN (' + questionMarks + ')';
             }
         }
diff --git a/src/core/directives/fa-icon.ts b/src/core/directives/fa-icon.ts
index 0cd0a1e63..8a262dd45 100644
--- a/src/core/directives/fa-icon.ts
+++ b/src/core/directives/fa-icon.ts
@@ -52,16 +52,16 @@ export class CoreFaIconDirective implements AfterViewInit, OnChanges {
             switch (parts[0]) {
                 case 'far':
                     library = 'regular';
-                    iconName = iconName.substr(4);
+                    iconName = iconName.substring(4);
                     break;
                 case 'fa':
                 case 'fas':
                     library = 'solid';
-                    iconName = iconName.substr(parts[0].length + 1);
+                    iconName = iconName.substring(parts[0].length + 1);
                     break;
                 case 'fab':
                     library = 'brands';
-                    iconName = iconName.substr(4);
+                    iconName = iconName.substring(4);
                     break;
                 default:
                     break;
diff --git a/src/core/directives/link.ts b/src/core/directives/link.ts
index 81670c941..e177b4a97 100644
--- a/src/core/directives/link.ts
+++ b/src/core/directives/link.ts
@@ -140,7 +140,7 @@ export class CoreLinkDirective implements OnInit {
 
         if (href.charAt(0) == '#') {
             // Look for id or name.
-            href = href.substr(1);
+            href = href.substring(1);
             CoreDomUtils.scrollToElementBySelector(
                 this.element.closest('ion-content'),
                 this.content,
@@ -170,7 +170,7 @@ export class CoreLinkDirective implements OnInit {
      * @return Promise resolved when done.
      */
     protected async openLocalFile(path: string): Promise<void> {
-        const filename = path.substr(path.lastIndexOf('/') + 1);
+        const filename = path.substring(path.lastIndexOf('/') + 1);
 
         if (!CoreFileHelper.isOpenableInApp({ filename })) {
             try {
diff --git a/src/core/features/contentlinks/classes/base-handler.ts b/src/core/features/contentlinks/classes/base-handler.ts
index a2809c552..2ac903131 100644
--- a/src/core/features/contentlinks/classes/base-handler.ts
+++ b/src/core/features/contentlinks/classes/base-handler.ts
@@ -95,7 +95,7 @@ export class CoreContentLinksHandlerBase implements CoreContentLinksHandler {
         if (this.pattern) {
             const position = url.search(this.pattern);
             if (position > -1) {
-                return url.substr(0, position);
+                return url.substring(0, position);
             }
         }
     }
diff --git a/src/core/features/emulator/services/file-transfer.ts b/src/core/features/emulator/services/file-transfer.ts
index 5a6d40e9d..59961318f 100644
--- a/src/core/features/emulator/services/file-transfer.ts
+++ b/src/core/features/emulator/services/file-transfer.ts
@@ -198,7 +198,7 @@ export class FileTransferObjectMock extends FileTransferObject {
                 const headerString = headers[i];
                 const separatorPos = headerString.indexOf(':');
                 if (separatorPos != -1) {
-                    result[headerString.substr(0, separatorPos)] = headerString.substr(separatorPos + 1).trim();
+                    result[headerString.substring(0, separatorPos)] = headerString.substring(separatorPos + 1).trim();
                 }
             }
         }
diff --git a/src/core/features/emulator/services/file.ts b/src/core/features/emulator/services/file.ts
index 71eae6136..4ae67a3d5 100644
--- a/src/core/features/emulator/services/file.ts
+++ b/src/core/features/emulator/services/file.ts
@@ -444,7 +444,7 @@ export class FileMock extends File {
 
         return {
             path: fullPath.substring(0, fullPath.lastIndexOf('/')),
-            name: fullPath.substr(fullPath.lastIndexOf('/') + 1),
+            name: fullPath.substring(fullPath.lastIndexOf('/') + 1),
         };
     }
 
diff --git a/src/core/features/emulator/services/zip.ts b/src/core/features/emulator/services/zip.ts
index 0f2d24195..47fa54b55 100644
--- a/src/core/features/emulator/services/zip.ts
+++ b/src/core/features/emulator/services/zip.ts
@@ -65,7 +65,7 @@ export class ZipMock extends Zip {
         destination = destination.replace(/%20/g, ' ');
 
         const sourceDir = source.substring(0, source.lastIndexOf('/'));
-        const sourceName = source.substr(source.lastIndexOf('/') + 1);
+        const sourceName = source.substring(source.lastIndexOf('/') + 1);
         const zip = new JSZip();
 
         try {
@@ -82,7 +82,7 @@ export class ZipMock extends Zip {
 
             // First of all, create the directory where the files will be unzipped.
             const destParent = destination.substring(0, destination.lastIndexOf('/'));
-            const destFolderName = destination.substr(destination.lastIndexOf('/') + 1);
+            const destFolderName = destination.substring(destination.lastIndexOf('/') + 1);
 
             await this.file.createDir(destParent, destFolderName, true);
 
@@ -95,7 +95,7 @@ export class ZipMock extends Zip {
                 if (!file.dir) {
                     // It's a file.
                     const fileDir = name.substring(0, name.lastIndexOf('/'));
-                    const fileName = name.substr(name.lastIndexOf('/') + 1);
+                    const fileName = name.substring(name.lastIndexOf('/') + 1);
 
                     if (fileDir) {
                         // The file is in a subfolder, create it first.
diff --git a/src/core/features/grades/services/grades-helper.ts b/src/core/features/grades/services/grades-helper.ts
index b4d26bfa2..cf83ea121 100644
--- a/src/core/features/grades/services/grades-helper.ts
+++ b/src/core/features/grades/services/grades-helper.ts
@@ -154,7 +154,7 @@ export class CoreGradesHelperProvider {
         for (const name in item) {
             const index = name.indexOf('formatted');
             if (index > 0) {
-                item[name.substr(0, index)] = item[name];
+                item[name.substring(0, index)] = item[name];
             }
         }
 
@@ -399,7 +399,7 @@ export class CoreGradesHelperProvider {
                 (row) =>
                     row.itemname &&
                     row.itemname.id &&
-                    row.itemname.id.substr(0, 3) == 'row' &&
+                    row.itemname.id.substring(0, 3) == 'row' &&
                     parseInt(row.itemname.id.split('_')[1], 10) == gradeId,
             );
 
diff --git a/src/core/features/h5p/classes/content-validator.ts b/src/core/features/h5p/classes/content-validator.ts
index e3e916ba6..f7fc315ba 100644
--- a/src/core/features/h5p/classes/content-validator.ts
+++ b/src/core/features/h5p/classes/content-validator.ts
@@ -169,7 +169,7 @@ export class CoreH5PContentValidator {
 
         // Check if string is within allowed length.
         if (semantics.maxLength !== undefined) {
-            text = text.substr(0, semantics.maxLength);
+            text = text.substring(0, semantics.maxLength);
         }
 
         return text;
@@ -357,8 +357,8 @@ export class CoreH5PContentValidator {
         }
 
         // Remove temporary files suffix.
-        if (file.path.substr(-4, 4) === '#tmp') {
-            file.path = file.path.substr(0, file.path.length - 4);
+        if (file.path.substring(-4, 4) === '#tmp') {
+            file.path = file.path.substring(0, file.path.length - 4);
         }
 
         // Make sure path and mime does not have any special chars
@@ -670,7 +670,7 @@ export class CoreH5PContentValidator {
 
         const tag = tags[0];
 
-        if (tag.substr(0, 1) != '<') {
+        if (tag.substring(0, 1) != '<') {
             // We matched a lone ">" character.
             return '&gt;';
         } else if (tag.length == 1) {
@@ -746,7 +746,7 @@ export class CoreH5PContentValidator {
                     matches = attr.match(/^([-a-zA-Z]+)/);
                     if (matches && matches.length > 1) {
                         attrName = matches[1].toLowerCase();
-                        skip = attrName == 'style' || attrName.substr(0, 2) == 'on' || attrName.substr(0, 1) == '-' ||
+                        skip = attrName == 'style' || attrName.substring(0, 2) == 'on' || attrName.substring(0, 1) == '-' ||
                                 attrName.length > 96; // Ignore long attributes to avoid unnecessary processing overhead.
                         working = mode = 1;
                         attr = attr.replace(/^[-a-zA-Z]+/, '');
@@ -883,7 +883,7 @@ export class CoreH5PContentValidator {
 
             if (colonPos > 0) {
                 // We found a colon, possibly a protocol. Verify.
-                const protocol = uri.substr(0, colonPos);
+                const protocol = uri.substring(0, colonPos);
                 // If a colon is preceded by a slash, question mark or hash, it cannot possibly be part of the URL scheme.
                 // This must be a relative URL, which inherits the (safe) protocol of the base document.
                 if (protocol.match(/[/?#]/)) {
@@ -891,7 +891,7 @@ export class CoreH5PContentValidator {
                 }
                 // Check if this is a disallowed protocol.
                 if (!allowedProtocols[protocol.toLowerCase()]) {
-                    uri = uri.substr(colonPos + 1);
+                    uri = uri.substring(colonPos + 1);
                 }
             }
         } while (before != uri);
diff --git a/src/core/features/h5p/classes/core.ts b/src/core/features/h5p/classes/core.ts
index ac6dddb45..948dabf40 100644
--- a/src/core/features/h5p/classes/core.ts
+++ b/src/core/features/h5p/classes/core.ts
@@ -216,7 +216,7 @@ export class CoreH5PCore {
 
         // Prevent too long slug.
         if (newInput.length > 91) {
-            newInput = newInput.substr(0, 92);
+            newInput = newInput.substring(0, 92);
         }
 
         // Prevent empty slug
diff --git a/src/core/features/question/services/question-helper.ts b/src/core/features/question/services/question-helper.ts
index b8ab02ad4..27bdfe3d4 100644
--- a/src/core/features/question/services/question-helper.ts
+++ b/src/core/features/question/services/question-helper.ts
@@ -303,7 +303,7 @@ export class CoreQuestionHelperProvider {
 
                 // Remove start and end of the match, we only want the object.
                 initMatch = initMatch.replace('M.qtype_' + question.type + '.init_question(', '');
-                initMatch = initMatch.substr(0, initMatch.length - 2);
+                initMatch = initMatch.substring(0, initMatch.length - 2);
 
                 // Try to convert it to an object and add it to the question.
                 question.initObjects = CoreTextUtils.parseJSON(initMatch, null);
diff --git a/src/core/features/settings/pages/deviceinfo/deviceinfo.ts b/src/core/features/settings/pages/deviceinfo/deviceinfo.ts
index 2911ec1cd..da72645ff 100644
--- a/src/core/features/settings/pages/deviceinfo/deviceinfo.ts
+++ b/src/core/features/settings/pages/deviceinfo/deviceinfo.ts
@@ -100,7 +100,7 @@ export class CoreSettingsDeviceInfoPage implements OnDestroy {
 
         if (window.location && window.location.href) {
             const url = window.location.href;
-            this.deviceInfo.locationHref = url.indexOf('#') > 0 ? url.substr(0, url.indexOf('#')) : url;
+            this.deviceInfo.locationHref = url.indexOf('#') > 0 ? url.substring(0, url.indexOf('#')) : url;
         }
 
         if (window.screen) {
diff --git a/src/core/services/file.ts b/src/core/services/file.ts
index 698cdac02..21fdc08bd 100644
--- a/src/core/services/file.ts
+++ b/src/core/services/file.ts
@@ -232,8 +232,8 @@ export class CoreFileProvider {
         } else {
             // The file plugin doesn't allow creating more than 1 level at a time (e.g. tmp/folder).
             // We need to create them 1 by 1.
-            const firstDir = path.substr(0, path.indexOf('/'));
-            const restOfPath = path.substr(path.indexOf('/') + 1);
+            const firstDir = path.substring(0, path.indexOf('/'));
+            const restOfPath = path.substring(path.indexOf('/') + 1);
 
             this.logger.debug('Create dir ' + firstDir + ' in ' + base);
 
@@ -692,7 +692,7 @@ export class CoreFileProvider {
      */
     async removeExternalFile(fullPath: string): Promise<void> {
         const directory = fullPath.substring(0, fullPath.lastIndexOf('/'));
-        const filename = fullPath.substr(fullPath.lastIndexOf('/') + 1);
+        const filename = fullPath.substring(fullPath.lastIndexOf('/') + 1);
 
         await File.removeFile(directory, filename);
     }
@@ -885,7 +885,7 @@ export class CoreFileProvider {
         };
 
         file.directory = path.substring(0, path.lastIndexOf('/'));
-        file.name = path.substr(path.lastIndexOf('/') + 1);
+        file.name = path.substring(path.lastIndexOf('/') + 1);
 
         return file;
     }
@@ -1035,7 +1035,7 @@ export class CoreFileProvider {
      */
     removeStartingSlash(path: string): string {
         if (path[0] == '/') {
-            return path.substr(1);
+            return path.substring(1);
         }
 
         return path;
@@ -1232,7 +1232,7 @@ export class CoreFileProvider {
         const position = window.location.href.indexOf(window.location.pathname);
 
         if (position != -1) {
-            return window.location.href.substr(0, position);
+            return window.location.href.substring(0, position);
         }
 
         return window.location.href;
diff --git a/src/core/services/filepool.ts b/src/core/services/filepool.ts
index 3674b9fc7..99d5ea855 100644
--- a/src/core/services/filepool.ts
+++ b/src/core/services/filepool.ts
@@ -777,7 +777,7 @@ export class CoreFilepoolProvider {
                 // Calculate the path to the file.
                 path = file.filename || '';
                 if (file.filepath && file.filepath !== '/') {
-                    path = file.filepath.substr(1) + path;
+                    path = file.filepath.substring(1) + path;
                 }
                 path = CoreTextUtils.concatenatePaths(dirPath, path);
             }
@@ -871,7 +871,7 @@ export class CoreFilepoolProvider {
                     // Calculate the path to the file.
                     path = file.filename || '';
                     if (file.filepath && file.filepath !== '/') {
-                        path = file.filepath.substr(1) + path;
+                        path = file.filepath.substring(1) + path;
                     }
                     path = CoreTextUtils.concatenatePaths(dirPath, path);
                 }
@@ -1837,7 +1837,7 @@ export class CoreFilepoolProvider {
             return;
         }
 
-        const relativePath = url.substr(url.indexOf('/pluginfile.php') + 16);
+        const relativePath = url.substring(url.indexOf('/pluginfile.php') + 16);
         const args = relativePath.split('/');
 
         if (args.length < 3) {
@@ -2084,7 +2084,7 @@ export class CoreFilepoolProvider {
             // It's a pluginfile URL. Search for the 'file' param to extract the name.
             const params = CoreUrlUtils.extractUrlParams(fileUrl);
             if (params.file) {
-                filename = params.file.substr(params.file.lastIndexOf('/') + 1);
+                filename = params.file.substring(params.file.lastIndexOf('/') + 1);
             } else {
                 // 'file' param not found. Extract what's after the last '/' without params.
                 filename = CoreUrlUtils.getLastFileWithoutParams(fileUrl);
@@ -2115,7 +2115,7 @@ export class CoreFilepoolProvider {
             // Remove the URL from the array.
             hashes.shift();
 
-            filename = filename.substr(0, index);
+            filename = filename.substring(0, index);
         }
 
         // Remove the extension from the filename.
diff --git a/src/core/services/lang.ts b/src/core/services/lang.ts
index e8c09518c..d76c6153a 100644
--- a/src/core/services/lang.ts
+++ b/src/core/services/lang.ts
@@ -256,7 +256,7 @@ export class CoreLangProvider {
             // Language code defined by locale has a dash, like en-US or es-ES. Check if it's supported.
             if (CoreConstants.CONFIG.languages && CoreConstants.CONFIG.languages[preferredLanguage] === undefined) {
                 // Code is NOT supported. Fallback to language without dash. E.g. 'en-US' would fallback to 'en'.
-                preferredLanguage = preferredLanguage.substr(0, preferredLanguage.indexOf('-'));
+                preferredLanguage = preferredLanguage.substring(0, preferredLanguage.indexOf('-'));
             }
         }
 
diff --git a/src/core/services/urlschemes.ts b/src/core/services/urlschemes.ts
index 7cbe49670..f1b6aaa36 100644
--- a/src/core/services/urlschemes.ts
+++ b/src/core/services/urlschemes.ts
@@ -249,7 +249,7 @@ export class CoreCustomURLSchemesProvider {
 
         // Remove the params to get the site URL.
         if (url.indexOf('?') != -1) {
-            url = url.substr(0, url.indexOf('?'));
+            url = url.substring(0, url.indexOf('?'));
         }
 
         if (!url.match(/https?:\/\//)) {
diff --git a/src/core/services/utils/iframe.ts b/src/core/services/utils/iframe.ts
index 99f6e15bf..2e93414c7 100644
--- a/src/core/services/utils/iframe.ts
+++ b/src/core/services/utils/iframe.ts
@@ -443,7 +443,7 @@ export class CoreIframeUtilsProvider {
             }
         } else if (CoreUrlUtils.isLocalFileUrl(url)) {
             // It's a local file.
-            const filename = url.substr(url.lastIndexOf('/') + 1);
+            const filename = url.substring(url.lastIndexOf('/') + 1);
 
             if (!CoreFileHelper.isOpenableInApp({ filename })) {
                 try {
@@ -522,7 +522,7 @@ export class CoreIframeUtilsProvider {
             // Opening links with _parent, _top or _blank can break the app. We'll open it in InAppBrowser.
             event && event.preventDefault();
 
-            const filename = link.href.substr(link.href.lastIndexOf('/') + 1);
+            const filename = link.href.substring(link.href.lastIndexOf('/') + 1);
 
             if (!CoreFileHelper.isOpenableInApp({ filename })) {
                 try {
diff --git a/src/core/services/utils/mimetype.ts b/src/core/services/utils/mimetype.ts
index 98ab537a6..d1c51fa1c 100644
--- a/src/core/services/utils/mimetype.ts
+++ b/src/core/services/utils/mimetype.ts
@@ -84,13 +84,13 @@ export class CoreMimetypeUtilsProvider {
         // If the extension has parameters, remove them.
         let position = extension.indexOf('?');
         if (position > -1) {
-            extension = extension.substr(0, position);
+            extension = extension.substring(0, position);
         }
 
         // If the extension has an anchor, remove it.
         position = extension.indexOf('#');
         if (position > -1) {
-            extension = extension.substr(0, position);
+            extension = extension.substring(0, position);
         }
 
         // Remove hash in extension if there's any (added by filepool).
@@ -98,7 +98,7 @@ export class CoreMimetypeUtilsProvider {
 
         // Remove dot from the extension if found.
         if (extension && extension[0] == '.') {
-            extension = extension.substr(1);
+            extension = extension.substring(1);
         }
 
         return extension;
@@ -311,12 +311,12 @@ export class CoreMimetypeUtilsProvider {
             // Remove params if any.
             position = candidate.indexOf('?');
             if (position > -1) {
-                candidate = candidate.substr(0, position);
+                candidate = candidate.substring(0, position);
             }
             // Remove anchor if any.
             position = candidate.indexOf('#');
             if (position > -1) {
-                candidate = candidate.substr(0, position);
+                candidate = candidate.substring(0, position);
             }
 
             if (EXTENSION_REGEX.test(candidate)) {
@@ -346,7 +346,7 @@ export class CoreMimetypeUtilsProvider {
         let ext;
 
         if (dot > -1) {
-            ext = filename.substr(dot + 1).toLowerCase();
+            ext = filename.substring(dot + 1).toLowerCase();
             ext = this.cleanExtension(ext);
 
             // Check extension corresponds to a mimetype to know if it's valid.
@@ -589,9 +589,9 @@ export class CoreMimetypeUtilsProvider {
 
         if (position > -1) {
             // Check extension corresponds to a mimetype to know if it's valid.
-            extension = path.substr(position + 1).toLowerCase();
+            extension = path.substring(position + 1).toLowerCase();
             if (this.getMimeType(extension) !== undefined) {
-                return path.substr(0, position); // Remove extension.
+                return path.substring(0, position); // Remove extension.
             }
         }
 
diff --git a/src/core/services/utils/text.ts b/src/core/services/utils/text.ts
index c37c3f8a9..c227c1279 100644
--- a/src/core/services/utils/text.ts
+++ b/src/core/services/utils/text.ts
@@ -279,7 +279,7 @@ export class CoreTextUtilsProvider {
         const firstCharRight = rightPath.charAt(0);
 
         if (lastCharLeft === '/' && firstCharRight === '/') {
-            return leftPath + rightPath.substr(1);
+            return leftPath + rightPath.substring(1);
         } else if (lastCharLeft !== '/' && firstCharRight !== '/') {
             return leftPath + '/' + rightPath;
         } else {
@@ -539,7 +539,7 @@ export class CoreTextUtilsProvider {
             const url = CoreFileHelper.getFileUrl(files[0]);
 
             // Remove text after last slash (encoded or not).
-            return url?.substr(0, Math.max(url.lastIndexOf('/'), url.lastIndexOf('%2F')));
+            return url?.substring(0, Math.max(url.lastIndexOf('/'), url.lastIndexOf('%2F')));
         }
 
         return undefined;
@@ -778,9 +778,9 @@ export class CoreTextUtilsProvider {
             }
 
             // Get the filename from the URL.
-            let filename = url.substr(url.lastIndexOf('/') + 1);
+            let filename = url.substring(url.lastIndexOf('/') + 1);
             if (filename.indexOf('?') != -1) {
-                filename = filename.substr(0, filename.indexOf('?'));
+                filename = filename.substring(0, filename.indexOf('?'));
             }
 
             if (pluginfileMap[filename]) {
@@ -904,12 +904,12 @@ export class CoreTextUtilsProvider {
      */
     shortenText(text: string, length: number): string {
         if (text.length > length) {
-            text = text.substr(0, length);
+            text = text.substring(0, length);
 
             // Now, truncate at the last word boundary (if exists).
             const lastWordPos = text.lastIndexOf(' ');
             if (lastWordPos > 0) {
-                text = text.substr(0, lastWordPos);
+                text = text.substring(0, lastWordPos);
             }
             text += '&hellip;';
         }
diff --git a/src/core/services/utils/url.ts b/src/core/services/utils/url.ts
index 15ed16dfc..06681b696 100644
--- a/src/core/services/utils/url.ts
+++ b/src/core/services/utils/url.ts
@@ -329,9 +329,9 @@ export class CoreUrlUtilsProvider {
      * @return Last file without params.
      */
     getLastFileWithoutParams(url: string): string {
-        let filename = url.substr(url.lastIndexOf('/') + 1);
+        let filename = url.substring(url.lastIndexOf('/') + 1);
         if (filename.indexOf('?') != -1) {
-            filename = filename.substr(0, filename.indexOf('?'));
+            filename = filename.substring(0, filename.indexOf('?'));
         }
 
         return filename;
diff --git a/src/core/services/utils/utils.ts b/src/core/services/utils/utils.ts
index e66e673fd..2b72fb6c3 100644
--- a/src/core/services/utils/utils.ts
+++ b/src/core/services/utils/utils.ts
@@ -1254,7 +1254,7 @@ export class CoreUtilsProvider {
         const mapped = {};
         objects.forEach((item) => {
             const keyValue = item[keyName] as string;
-            const key = prefixSubstr > 0 ? keyValue.substr(prefixSubstr) : keyValue;
+            const key = prefixSubstr > 0 ? keyValue.substring(prefixSubstr) : keyValue;
             mapped[key] = item[valueName];
         });
 
diff --git a/src/core/singletons/colors.ts b/src/core/singletons/colors.ts
index 5a5eeb0c9..368b3e99d 100644
--- a/src/core/singletons/colors.ts
+++ b/src/core/singletons/colors.ts
@@ -112,7 +112,7 @@ export class CoreColors {
      */
     static hexToRGB(color: string): ColorComponents {
         if (color.charAt(0) == '#') {
-            color = color.substr(1);
+            color = color.substring(1);
         }
 
         if (color.length === 3) {
@@ -122,9 +122,9 @@ export class CoreColors {
         }
 
         return {
-            red: parseInt(color.substr(0, 2), 16),
-            green: parseInt(color.substr(2, 2), 16),
-            blue: parseInt(color.substr(4, 2), 16),
+            red: parseInt(color.substring(0, 2), 16),
+            green: parseInt(color.substring(2, 2), 16),
+            blue: parseInt(color.substring(4, 2), 16),
         };
 
     }
diff --git a/src/core/singletons/locutus.ts b/src/core/singletons/locutus.ts
index c39484399..ac9b5bc3e 100644
--- a/src/core/singletons/locutus.ts
+++ b/src/core/singletons/locutus.ts
@@ -123,7 +123,7 @@ function readBytes (str, len, escapedString = false) {
     const isLowSurrogate = code >= 0xdc00 && code <= 0xdfff
 
     if (escapedString && chr === '\\') {
-      chr = String.fromCharCode(parseInt(str.substr(c + 1, 2), 16))
+      chr = String.fromCharCode(parseInt(str.substring(c + 1, 2), 16))
       escapedChars++
 
       // each escaped sequence is 3 characters. Go 2 chars ahead.
@@ -167,7 +167,7 @@ function expectString (str) {
 
   const len = parseInt(byteLenMatch, 10)
 
-  str = str.substr(match.length)
+  str = str.substring(match.length)
 
   let [ strMatch, bytes ] = readBytes(str, len)
 
@@ -175,7 +175,7 @@ function expectString (str) {
     throw SyntaxError(`Expected string of ${len} bytes, but got ${bytes}`)
   }
 
-  str = str.substr((strMatch as string).length)
+  str = str.substring((strMatch as string).length)
 
   // strict parsing, match closing "; chars
   if (!str.startsWith('";')) {
@@ -195,7 +195,7 @@ function expectEscapedString (str) {
 
   const len = parseInt(strLenMatch, 10)
 
-  str = str.substr(match.length)
+  str = str.substring(match.length)
 
   let [ strMatch, bytes, escapedChars ] = readBytes(str, len, true)
 
@@ -203,7 +203,7 @@ function expectEscapedString (str) {
     throw SyntaxError(`Expected escaped string of ${len} bytes, but got ${bytes}`)
   }
 
-  str = str.substr((strMatch as string).length + (escapedChars as number) * 2)
+  str = str.substring((strMatch as string).length + (escapedChars as number) * 2)
 
   // strict parsing, match closing "; chars
   if (!str.startsWith('";')) {
@@ -249,15 +249,15 @@ function expectObject (str, cache) {
   const obj = {}
   cache([obj])
 
-  str = str.substr(totalOffset)
+  str = str.substring(totalOffset)
 
   for (let i = 0; i < propCount; i++) {
     const prop = expectKeyOrIndex(str)
-    str = str.substr(prop[1])
+    str = str.substring(prop[1])
     totalOffset += prop[1] as number
 
     const value = expectType(str, cache)
-    str = str.substr(value[1])
+    str = str.substring(value[1])
     totalOffset += value[1]
 
     obj[prop[0]] = value[0]
@@ -299,7 +299,7 @@ function expectArray (str, cache) {
     throw SyntaxError('Expected array length annotation')
   }
 
-  str = str.substr(arrayLiteralBeginMatch.length)
+  str = str.substring(arrayLiteralBeginMatch.length)
 
   const array = expectArrayItems(str, parseInt(arrayLengthMatch, 10), cache)
 
@@ -327,14 +327,14 @@ function expectArrayItems (str, expectedItems = 0, cache) {
       hasStringKeys = (typeof key[0] === 'string')
     }
 
-    str = str.substr(key[1])
+    str = str.substring(key[1])
     totalOffset += key[1]
 
     // references are resolved immediately, so if duplicate key overwrites previous array index
     // the old value is anyway resolved
     // fixme: but next time the same reference should point to the new value
     item = expectType(str, cache)
-    str = str.substr(item[1])
+    str = str.substring(item[1])
     totalOffset += item[1]
 
     items[key[0]] = item[0]
@@ -428,7 +428,7 @@ function substr_replace (str, replace, start, length) {
 
   return [
     str.slice(0, start),
-    replace.substr(0, length),
+    replace.substring(0, length),
     replace.slice(length),
     str.slice(start + length)
   ].join('')
diff --git a/src/core/singletons/text.ts b/src/core/singletons/text.ts
index c95fa2a5b..9f6c1af11 100644
--- a/src/core/singletons/text.ts
+++ b/src/core/singletons/text.ts
@@ -34,7 +34,7 @@ export class CoreText {
         }
 
         if (text.slice(-1) == '/') {
-            return text.substr(0, text.length - 1);
+            return text.substring(0, text.length - 1);
         }
 
         return text;
diff --git a/src/core/singletons/url.ts b/src/core/singletons/url.ts
index 097f05155..ebb7aa533 100644
--- a/src/core/singletons/url.ts
+++ b/src/core/singletons/url.ts
@@ -216,7 +216,7 @@ export class CoreUrl {
             return;
         }
 
-        return url.substr(firstAnchorIndex);
+        return url.substring(firstAnchorIndex);
     }
 
     /**
diff --git a/src/core/singletons/window.ts b/src/core/singletons/window.ts
index 5463c7521..328fbbda6 100644
--- a/src/core/singletons/window.ts
+++ b/src/core/singletons/window.ts
@@ -82,7 +82,7 @@ export class CoreWindow {
      */
     static async open(url: string, name?: string): Promise<void> {
         if (CoreUrlUtils.isLocalFileUrl(url)) {
-            const filename = url.substr(url.lastIndexOf('/') + 1);
+            const filename = url.substring(url.lastIndexOf('/') + 1);
 
             if (!CoreFileHelper.isOpenableInApp({ filename })) {
                 try {

From 4a83b2b29f6d1c3435ba1d80a45af184b06717a0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 14:54:43 +0100
Subject: [PATCH 4/6] MOBILE-3814 mod: Add module name to module info box

---
 src/addons/mod/forum/components/index/index.html     |  2 +-
 .../wiki/components/index/addon-mod-wiki-index.html  |  2 +-
 src/addons/mod/wiki/components/index/index.ts        |  1 -
 src/addons/mod/wiki/pages/index/index.html           |  4 ----
 src/addons/mod/wiki/pages/index/index.ts             | 12 ------------
 .../module-info/core-course-module-info.html         |  1 +
 .../components/module-info/course-module-info.scss   | 10 +++++++++-
 7 files changed, 12 insertions(+), 20 deletions(-)

diff --git a/src/addons/mod/forum/components/index/index.html b/src/addons/mod/forum/components/index/index.html
index 5000be62a..09e94eb1a 100644
--- a/src/addons/mod/forum/components/index/index.html
+++ b/src/addons/mod/forum/components/index/index.html
@@ -41,7 +41,7 @@
         <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
             [description]="forum && forum.type != 'single' && description" [component]="component" [componentId]="componentId"
             [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
-            <ion-item>
+            <ion-item lines="none" class="ion-text-wrap">
                 <ion-label>
                     {{descriptionNote}}
                 </ion-label>
diff --git a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
index ee8fec538..9d9fdf7fb 100644
--- a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
+++ b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
@@ -50,7 +50,6 @@
     <!-- Activity info. -->
     <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
         [component]="component" [componentId]="componentId" [courseId]="courseId">
-        <h2 *ngIf="pageTitle" title>{{pageTitle}}</h2>
     </core-course-module-info>
 
     <div *ngIf="pageIsOffline || hasOffline || pageWarning">
@@ -74,6 +73,7 @@
         </ion-card>
     </div>
     <div class="ion-padding addon-mod_wiki-page-content">
+        <h2 *ngIf="pageTitle">{{pageTitle}}</h2>
         <article [ngClass]="{'addon-mod_wiki-noedit': !canEdit}">
             <core-format-text *ngIf="pageContent" [component]="component" [componentId]="componentId" [text]="pageContent"
                 contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
diff --git a/src/addons/mod/wiki/components/index/index.ts b/src/addons/mod/wiki/components/index/index.ts
index 45ea90277..4f5a4709f 100644
--- a/src/addons/mod/wiki/components/index/index.ts
+++ b/src/addons/mod/wiki/components/index/index.ts
@@ -427,7 +427,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp
         const pageContents = await this.fetchPageContents(this.currentPage);
 
         if (pageContents) {
-            this.dataRetrieved.emit(pageContents.title);
             this.setSelectedWiki(pageContents.subwikiid, pageContents.userid, pageContents.groupid);
 
             this.pageTitle = pageContents.title;
diff --git a/src/addons/mod/wiki/pages/index/index.html b/src/addons/mod/wiki/pages/index/index.html
index 6c07ead01..a33c7c251 100644
--- a/src/addons/mod/wiki/pages/index/index.html
+++ b/src/addons/mod/wiki/pages/index/index.html
@@ -8,10 +8,6 @@
                 <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
                 </core-format-text>
             </h1>
-            <h2>
-                <core-format-text [text]="pageTitle" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
-                </core-format-text>
-            </h2>
         </ion-title>
 
         <ion-buttons slot="end">
diff --git a/src/addons/mod/wiki/pages/index/index.ts b/src/addons/mod/wiki/pages/index/index.ts
index 0d374feaa..34311f8ad 100644
--- a/src/addons/mod/wiki/pages/index/index.ts
+++ b/src/addons/mod/wiki/pages/index/index.ts
@@ -49,18 +49,6 @@ export class AddonModWikiIndexPage extends CoreCourseModuleMainActivityPage<Addo
         this.groupId = CoreNavigator.getRouteNumberParam('groupId');
     }
 
-    /**
-     * @inheritdoc
-     */
-    updateData(data: { name: string } | string): void {
-        if (typeof data == 'string') {
-            // We received the title to display.
-            this.pageTitle = data;
-        } else {
-            super.updateData(data);
-        }
-    }
-
     /**
      * User entered the page.
      */
diff --git a/src/core/features/course/components/module-info/core-course-module-info.html b/src/core/features/course/components/module-info/core-course-module-info.html
index 702b6ff54..66eb61541 100644
--- a/src/core/features/course/components/module-info/core-course-module-info.html
+++ b/src/core/features/course/components/module-info/core-course-module-info.html
@@ -2,6 +2,7 @@
     <core-mod-icon slot="start" [modicon]="modicon" [modname]="module.modname" [componentId]="module.instance">
     </core-mod-icon>
     <ion-label>
+        <p class="core-modulename" *ngIf="moduleNameTranslated">{{moduleNameTranslated}}</p>
         <h1>
             <core-format-text [text]="module.name" contextLevel="module" [component]="component" [componentId]="componentId"
                 [contextInstanceId]="module.id" [courseId]="courseId">
diff --git a/src/core/features/course/components/module-info/course-module-info.scss b/src/core/features/course/components/module-info/course-module-info.scss
index 0a0b5bce7..514315b48 100644
--- a/src/core/features/course/components/module-info/course-module-info.scss
+++ b/src/core/features/course/components/module-info/course-module-info.scss
@@ -6,6 +6,14 @@
     margin-bottom: 8px;
     padding-bottom: 1px; // To allow margins inside.
     background-color: var(--contrast-background);
-    
+
     @include padding-horizontal(var(--ion-safe-area-left), var(--ion-safe-area-right));
+
+    .core-modulename {
+        text-transform: uppercase;
+    }
+
+    core-mod-icon {
+        align-self: flex-start;
+    }
 }

From 6998c05d5cc861555e6dad066c319c18c33f69a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 15:22:10 +0100
Subject: [PATCH 5/6] MOBILE-3814 mod: Move completion to course module
 navigation component

---
 .../index/addon-mod-assign-index.html         |  7 ++++---
 .../components/index/index.html               |  6 +++---
 .../index/addon-mod-book-index.html           |  6 +++---
 .../index/addon-mod-chat-index.html           |  6 +++---
 .../index/addon-mod-choice-index.html         |  6 +++---
 .../index/addon-mod-data-index.html           |  6 +++---
 .../index/addon-mod-feedback-index.html       |  6 +++---
 .../index/addon-mod-folder-index.html         |  6 +++---
 .../mod/forum/components/index/index.html     |  8 ++++----
 .../index/addon-mod-glossary-index.html       |  7 ++++---
 .../index/addon-mod-h5pactivity-index.html    |  6 +++---
 .../index/addon-mod-imscp-index.html          |  4 ++--
 .../index/addon-mod-lesson-index.html         |  6 +++---
 .../components/index/addon-mod-lti-index.html |  7 +++----
 .../index/addon-mod-page-index.html           |  6 +++---
 .../index/addon-mod-quiz-index.html           |  7 +++----
 .../index/addon-mod-resource-index.html       |  4 ++--
 .../index/addon-mod-scorm-index.html          |  6 +++---
 .../index/addon-mod-survey-index.html         |  7 +++----
 .../components/index/addon-mod-url-index.html |  6 +++---
 .../index/addon-mod-wiki-index.html           |  6 +++---
 .../index/addon-mod-workshop-index.html       |  4 ++--
 .../module-info/core-course-module-info.html  | 19 +++++--------------
 .../components/module-info/module-info.ts     |  8 ++------
 .../core-course-module-navigation.html        |  8 ++++++++
 .../module-navigation/module-navigation.ts    | 17 ++++++++++++-----
 .../pages/module-preview/module-preview.html  |  6 +++---
 .../core-siteplugins-module-index.html        |  3 ++-
 28 files changed, 98 insertions(+), 96 deletions(-)

diff --git a/src/addons/mod/assign/components/index/addon-mod-assign-index.html b/src/addons/mod/assign/components/index/addon-mod-assign-index.html
index 2382ff0e7..de9b9a462 100644
--- a/src/addons/mod/assign/components/index/addon-mod-assign-index.html
+++ b/src/addons/mod/assign/components/index/addon-mod-assign-index.html
@@ -30,8 +30,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="hasOffline">
         <ion-list inset="true" description *ngIf="assign && assign.introattachments && assign.introattachments.length">
             <core-file *ngFor="let file of assign.introattachments" [file]="file" [component]="component" [componentId]="componentId">
             </core-file>
@@ -148,4 +148,5 @@
     </addon-mod-assign-submission>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id"></core-course-module-navigation>
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
+</core-course-module-navigation>
diff --git a/src/addons/mod/bigbluebuttonbn/components/index/index.html b/src/addons/mod/bigbluebuttonbn/components/index/index.html
index a5a2baeb8..7b5f0aa7b 100644
--- a/src/addons/mod/bigbluebuttonbn/components/index/index.html
+++ b/src/addons/mod/bigbluebuttonbn/components/index/index.html
@@ -23,8 +23,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-page">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId">
     </core-course-module-info>
 
     <ng-container *ngIf="groupInfo && (groupInfo.separateGroups || groupInfo.visibleGroups)">
@@ -126,5 +126,5 @@
     </ng-container>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/book/components/index/addon-mod-book-index.html b/src/addons/mod/book/components/index/addon-mod-book-index.html
index 247a4b5c7..0789f53c5 100644
--- a/src/addons/mod/book/components/index/addon-mod-book-index.html
+++ b/src/addons/mod/book/components/index/addon-mod-book-index.html
@@ -24,8 +24,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId">
     </core-course-module-info>
 
     <ion-card class="core-warning-card" *ngIf="warning">
@@ -56,5 +56,5 @@
 
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/chat/components/index/addon-mod-chat-index.html b/src/addons/mod/chat/components/index/addon-mod-chat-index.html
index 046853afd..d9106e2bf 100644
--- a/src/addons/mod/chat/components/index/addon-mod-chat-index.html
+++ b/src/addons/mod/chat/components/index/addon-mod-chat-index.html
@@ -27,8 +27,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId">
     </core-course-module-info>
 
     <ion-card *ngIf="chatInfo" class="core-info-card">
@@ -48,5 +48,5 @@
     </ng-container>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/choice/components/index/addon-mod-choice-index.html b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
index 4d291227e..730623b79 100644
--- a/src/addons/mod/choice/components/index/addon-mod-choice-index.html
+++ b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
@@ -29,8 +29,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="hasOffline">
     </core-course-module-info>
 
     <!-- Activity availability messages -->
@@ -155,7 +155,7 @@
     </ion-card>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
 
 <!-- Template to render a choice option label. -->
diff --git a/src/addons/mod/data/components/index/addon-mod-data-index.html b/src/addons/mod/data/components/index/addon-mod-data-index.html
index 1bb70403b..c33a3a94a 100644
--- a/src/addons/mod/data/components/index/addon-mod-data-index.html
+++ b/src/addons/mod/data/components/index/addon-mod-data-index.html
@@ -39,8 +39,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
     </core-course-module-info>
 
     <ion-item class="ion-text-wrap" *ngIf="groupInfo && (groupInfo.separateGroups || groupInfo.visibleGroups)">
@@ -138,7 +138,7 @@
 
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
 
 <ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="canAdd">
diff --git a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
index 685a98db0..f7bde4f52 100644
--- a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
+++ b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
@@ -29,8 +29,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="hasOffline">
     </core-course-module-info>
 
     <core-tabs [hideUntil]="tabsReady" [selectedIndex]="firstSelectedTab">
@@ -55,7 +55,7 @@
     </core-tabs>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
 
 <ng-template #basicInfo>
diff --git a/src/addons/mod/folder/components/index/addon-mod-folder-index.html b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
index 6c8d1aaeb..adceb5976 100644
--- a/src/addons/mod/folder/components/index/addon-mod-folder-index.html
+++ b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
@@ -26,8 +26,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="!subfolder" [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info *ngIf="!subfolder" [module]="module" [description]="description" [component]="component"
+        [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
     <ion-list *ngIf="contents && (contents.files.length + contents.folders.length > 0)">
@@ -49,5 +49,5 @@
 
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/forum/components/index/index.html b/src/addons/mod/forum/components/index/index.html
index 09e94eb1a..eebda708e 100644
--- a/src/addons/mod/forum/components/index/index.html
+++ b/src/addons/mod/forum/components/index/index.html
@@ -38,9 +38,8 @@
 
     <core-loading [hideUntil]="discussions && discussions.loaded">
         <!-- Activity info. -->
-        <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
-            [description]="forum && forum.type != 'single' && description" [component]="component" [componentId]="componentId"
-            [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
+        <core-course-module-info [module]="module" [description]="forum && forum.type != 'single' && description" [component]="component"
+            [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
             <ion-item lines="none" class="ion-text-wrap">
                 <ion-label>
                     {{descriptionNote}}
@@ -140,7 +139,8 @@
         </ng-container>
     </core-loading>
 
-    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module"
+        (completionChanged)="onCompletionChange()">
     </core-course-module-navigation>
 
     <ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="forum && canAddDiscussion">
diff --git a/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html b/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
index d6f12a61e..a3437f70d 100644
--- a/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
+++ b/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
@@ -50,8 +50,8 @@
 
     <core-loading [hideUntil]="loaded">
         <!-- Activity info. -->
-        <core-course-module-info *ngIf="!isSearch" [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-            [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
+        <core-course-module-info *ngIf="!isSearch" [module]="module" [description]="description" [component]="component"
+            [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline || hasOfflineRatings">
         </core-course-module-info>
 
         <ion-list *ngIf="!isSearch && entries && entries.offlineEntries.length > 0">
@@ -96,7 +96,8 @@
         </core-infinite-loading>
     </core-loading>
 
-    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module"
+        (completionChanged)="onCompletionChange()">
     </core-course-module-navigation>
 
     <ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="canAdd">
diff --git a/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html b/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
index 300b5feb7..26790f9c0 100644
--- a/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
+++ b/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
@@ -36,8 +36,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="hasOffline">
     </core-course-module-info>
 
     <!-- Offline disabled. -->
@@ -85,5 +85,5 @@
     </core-h5p-iframe>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html b/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
index 056553b9f..4a92470fb 100644
--- a/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
+++ b/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
@@ -29,7 +29,7 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module">
     </core-course-module-info>
 
     <ion-card class="core-warning-card" *ngIf="warning">
@@ -46,5 +46,5 @@
     </div>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
index 0219bef8c..0f1de12a2 100644
--- a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
+++ b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
@@ -33,8 +33,8 @@
             <ng-template>
 
                 <!-- Activity info. -->
-                <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-                    [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
+                <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+                    [courseId]="courseId" [hasDataToSync]="hasOffline">
                 </core-course-module-info>
 
                 <!-- Prevent access messages. Only show the first one. -->
@@ -298,5 +298,5 @@
     </core-tabs>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/lti/components/index/addon-mod-lti-index.html b/src/addons/mod/lti/components/index/addon-mod-lti-index.html
index 20cf1a86e..9430ef52b 100644
--- a/src/addons/mod/lti/components/index/addon-mod-lti-index.html
+++ b/src/addons/mod/lti/components/index/addon-mod-lti-index.html
@@ -20,9 +20,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
-        [description]="lti && lti.showdescriptionlaunch && description" [component]="component" [componentId]="componentId"
-        [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="lti && lti.showdescriptionlaunch && description" [component]="component"
+        [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
     <div class="ion-padding">
@@ -33,5 +32,5 @@
     </div>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/page/components/index/addon-mod-page-index.html b/src/addons/mod/page/components/index/addon-mod-page-index.html
index 078f5c5c9..1c8cab9ed 100644
--- a/src/addons/mod/page/components/index/addon-mod-page-index.html
+++ b/src/addons/mod/page/components/index/addon-mod-page-index.html
@@ -26,8 +26,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="displayDescription && description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="displayDescription && description" [component]="component"
+        [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
     <ion-card class="core-warning-card" *ngIf="warning">
@@ -49,5 +49,5 @@
 
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html b/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
index 5d39ece10..dffa76b76 100644
--- a/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
+++ b/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
@@ -29,9 +29,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId"
-        [hasDataToSync]="buttonText && hasOffline && !showStatusSpinner">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="buttonText && hasOffline && !showStatusSpinner">
     </core-course-module-info>
 
     <!-- Access rules description messages. -->
@@ -227,5 +226,5 @@
     </ion-card>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/resource/components/index/addon-mod-resource-index.html b/src/addons/mod/resource/components/index/addon-mod-resource-index.html
index 9638db04e..e0f1279be 100644
--- a/src/addons/mod/resource/components/index/addon-mod-resource-index.html
+++ b/src/addons/mod/resource/components/index/addon-mod-resource-index.html
@@ -21,7 +21,7 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" [courseId]="courseId" (completionChanged)="onCompletionChange()"
+    <core-course-module-info [module]="module" [courseId]="courseId"
         [description]="mode != 'iframe' && (mode != 'embedded' || displayDescription) && description" [component]="component"
         [componentId]="componentId">
     </core-course-module-info>
@@ -61,5 +61,5 @@
     </ng-container>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html b/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
index 37ae91bfa..aeb744521 100644
--- a/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
+++ b/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
@@ -29,8 +29,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="!errorMessage && hasOffline">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId" [hasDataToSync]="!errorMessage && hasOffline">
     </core-course-module-info>
 
     <!-- Warning message. -->
@@ -237,5 +237,5 @@
     </ng-container>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/survey/components/index/addon-mod-survey-index.html b/src/addons/mod/survey/components/index/addon-mod-survey-index.html
index 345c10b5a..99a46962c 100644
--- a/src/addons/mod/survey/components/index/addon-mod-survey-index.html
+++ b/src/addons/mod/survey/components/index/addon-mod-survey-index.html
@@ -30,9 +30,8 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
-        [description]="survey && !survey.surveydone && !hasOffline && description" [component]="component" [componentId]="componentId"
-        [courseId]="courseId" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [description]="survey && !survey.surveydone && !hasOffline && description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline">
     </core-course-module-info>
 
     <!-- Survey already done -->
@@ -148,5 +147,5 @@
 
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/url/components/index/addon-mod-url-index.html b/src/addons/mod/url/components/index/addon-mod-url-index.html
index 7026fddf3..24f4579bd 100644
--- a/src/addons/mod/url/components/index/addon-mod-url-index.html
+++ b/src/addons/mod/url/components/index/addon-mod-url-index.html
@@ -16,8 +16,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="displayDescription && description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="displayDescription && description" [component]="component"
+        [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
     <div *ngIf="shouldIframe || (shouldEmbed && isOther)" class="addon-mod_url-embedded-url">
@@ -53,5 +53,5 @@
     </ion-list>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
index 9d9fdf7fb..7db05d66b 100644
--- a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
+++ b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
@@ -48,8 +48,8 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
-        [component]="component" [componentId]="componentId" [courseId]="courseId">
+    <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId">
     </core-course-module-info>
 
     <div *ngIf="pageIsOffline || hasOffline || pageWarning">
@@ -89,7 +89,7 @@
     </div>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
 
 <ion-fab slot="fixed" core-fab vertical="bottom" horizontal="end" *ngIf="canEdit">
diff --git a/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html b/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
index 8a5e5543d..a5a979a6f 100644
--- a/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
+++ b/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
@@ -30,7 +30,7 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [hasDataToSync]="hasOffline">
+    <core-course-module-info [module]="module" [hasDataToSync]="hasOffline">
     </core-course-module-info>
 
     <ion-card *ngIf="phases">
@@ -254,5 +254,5 @@
     </div>
 </core-loading>
 
-<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id">
+<core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 </core-course-module-navigation>
diff --git a/src/core/features/course/components/module-info/core-course-module-info.html b/src/core/features/course/components/module-info/core-course-module-info.html
index 66eb61541..88060b6ca 100644
--- a/src/core/features/course/components/module-info/core-course-module-info.html
+++ b/src/core/features/course/components/module-info/core-course-module-info.html
@@ -19,21 +19,12 @@
     </ion-label>
 </ion-item>
 <ng-content select="[description]"></ng-content>
-<ion-item class="ion-text-wrap" lines="none" *ngIf="showCompletion && (module.dates?.length ||
-        (module.completiondata && (module.completiondata.isautomatic || showManualCompletion) && module.uservisible))">
+<!-- Activity dates. -->
+<ion-item class="ion-text-wrap core-module-dates" lines="none" *ngIf="showCompletion && module.dates?.length">
     <ion-label>
-        <!-- Activity dates. -->
-        <div *ngIf="module.dates?.length" class="core-module-dates">
-            <p *ngFor="let date of module.dates">
-                <strong>{{ date.label }}</strong> {{ date.timestamp * 1000 | coreFormatDate:'strftimedatetime' }}
-            </p>
-        </div>
-
-        <!-- Module completion. -->
-        <core-course-module-completion *ngIf="module.completiondata && module.uservisible" [completion]="module.completiondata"
-            [moduleName]="module.name" [moduleId]="module.id" [showCompletionConditions]="true"
-            [showManualCompletion]="showManualCompletion" (completionChanged)="completionChanged.emit($event)">
-        </core-course-module-completion>
+        <p *ngFor="let date of module.dates">
+            <strong>{{ date.label }}</strong> {{ date.timestamp * 1000 | coreFormatDate:'strftimedatetime' }}
+        </p>
     </ion-label>
 </ion-item>
 <ng-content></ng-content>
diff --git a/src/core/features/course/components/module-info/module-info.ts b/src/core/features/course/components/module-info/module-info.ts
index 43fbe8ec4..f57b95e7e 100644
--- a/src/core/features/course/components/module-info/module-info.ts
+++ b/src/core/features/course/components/module-info/module-info.ts
@@ -12,9 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { CoreCourse } from '@features/course/services/course';
-import { CoreCourseModuleData, CoreCourseModuleCompletionData } from '@features/course/services/course-helper';
+import { CoreCourseModuleData } from '@features/course/services/course-helper';
 import { CoreCourseModuleDelegate } from '@features/course/services/module-delegate';
 import { CoreSites } from '@services/sites';
 
@@ -36,7 +36,6 @@ import { CoreSites } from '@services/sites';
 export class CoreCourseModuleInfoComponent implements OnInit {
 
     @Input() module!: CoreCourseModuleData; // The module to render.
-    @Input() showManualCompletion = true; // Whether to show manual completion, true by default.
     @Input() courseId!: number; // The courseId the module belongs to.
 
     @Input() component!: string; // Component for format text directive.
@@ -47,8 +46,6 @@ export class CoreCourseModuleInfoComponent implements OnInit {
 
     @Input() hasDataToSync = false; // If the activity has any data to be synced.
 
-    @Output() completionChanged = new EventEmitter<CoreCourseModuleCompletionData>(); // Notify when completion changes.
-
     modicon = '';
     showCompletion = false; // Whether to show completion.
     moduleNameTranslated = '';
@@ -60,7 +57,6 @@ export class CoreCourseModuleInfoComponent implements OnInit {
         this.modicon = await CoreCourseModuleDelegate.getModuleIconSrc(this.module.modname, this.module.modicon, this.module);
 
         this.moduleNameTranslated = CoreCourse.translateModuleName(this.module.modname || '');
-
         this.showCompletion = CoreSites.getRequiredCurrentSite().isVersionGreaterEqualThan('3.11');
     }
 
diff --git a/src/core/features/course/components/module-navigation/core-course-module-navigation.html b/src/core/features/course/components/module-navigation/core-course-module-navigation.html
index 74fc6f584..7d0fde92d 100644
--- a/src/core/features/course/components/module-navigation/core-course-module-navigation.html
+++ b/src/core/features/course/components/module-navigation/core-course-module-navigation.html
@@ -6,6 +6,14 @@
                 <ion-icon name="fas-arrow-left" slot="icon-only" aria-hidden="true"></ion-icon>
             </ion-button>
         </ion-col>
+        <ion-col *ngIf="showCompletion && (currentModule.completiondata &&
+            (currentModule.completiondata.isautomatic || showManualCompletion) && currentModule.uservisible)">
+            <!-- Module completion. -->
+            <core-course-module-completion [completion]="currentModule.completiondata" [moduleName]="currentModule.name"
+                [moduleId]="currentModule.id" [showCompletionConditions]="true" [showManualCompletion]="showManualCompletion"
+                (completionChanged)="completionChanged.emit($event)">
+            </core-course-module-completion>
+        </ion-col>
         <ion-col size="auto">
             <ion-button fill="clear" class="core-course-next-module" *ngIf="nextModule" (click)="goToActivity(true)"
                 [attr.aria-label]="'core.course.gotonextactivity' | translate">
diff --git a/src/core/features/course/components/module-navigation/module-navigation.ts b/src/core/features/course/components/module-navigation/module-navigation.ts
index fa326b1c7..6da81c2f4 100644
--- a/src/core/features/course/components/module-navigation/module-navigation.ts
+++ b/src/core/features/course/components/module-navigation/module-navigation.ts
@@ -12,9 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core';
+import { Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
 import { CoreCourse, CoreCourseProvider, CoreCourseWSSection } from '@features/course/services/course';
-import { CoreCourseModuleData } from '@features/course/services/course-helper';
+import { CoreCourseModuleCompletionData, CoreCourseModuleData } from '@features/course/services/course-helper';
 import { CoreCourseModuleDelegate } from '@features/course/services/module-delegate';
 import { IonContent } from '@ionic/angular';
 import { ScrollDetail } from '@ionic/core';
@@ -29,7 +29,7 @@ import { CoreMath } from '@singletons/math';
  * Component to show a button to go to the next resource/activity.
  *
  * Example usage:
- * <core-course-module-navigation [courseId]="courseId" [currentModuleId]="module.id"></core-course-module-navigation>
+ * <core-course-module-navigation [courseId]="courseId" [currentModule]="module"></core-course-module-navigation>
  */
 @Component({
     selector: 'core-course-module-navigation',
@@ -39,13 +39,17 @@ import { CoreMath } from '@singletons/math';
 export class CoreCourseModuleNavigationComponent implements OnInit, OnDestroy {
 
     @Input() courseId!: number; // Course ID.
-    @Input() currentModuleId!: number; // Current module ID.
+    @Input() currentModule!: CoreCourseModuleData; // Current module.
+    @Input() showManualCompletion = true; // Whether to show manual completion, true by default.
+
+    @Output() completionChanged = new EventEmitter<CoreCourseModuleCompletionData>(); // Notify when completion changes.
 
     nextModule?: CoreCourseModuleData;
     previousModule?: CoreCourseModuleData;
     nextModuleSection?: CoreCourseWSSection;
     previousModuleSection?: CoreCourseWSSection;
     loaded = false;
+    showCompletion = false; // Whether to show completion.
 
     protected element: HTMLElement;
     protected initialHeight = 0;
@@ -78,6 +82,8 @@ export class CoreCourseModuleNavigationComponent implements OnInit, OnDestroy {
      * @inheritdoc
      */
     async ngOnInit(): Promise<void> {
+        this.showCompletion = CoreSites.getRequiredCurrentSite().isVersionGreaterEqualThan('3.11');
+
         try {
             await this.setNextAndPreviousModules(CoreSitesReadingStrategy.PREFER_CACHE);
         } finally {
@@ -172,6 +178,7 @@ export class CoreCourseModuleNavigationComponent implements OnInit, OnDestroy {
         }
 
         const preSets = CoreSites.getReadingStrategyPreSets(readingStrategy);
+        const currentModuleId = this.currentModule.id;
 
         const sections = await CoreCourse.getSections(this.courseId, false, true, preSets);
 
@@ -184,7 +191,7 @@ export class CoreCourseModuleNavigationComponent implements OnInit, OnDestroy {
                 return false;
             }
 
-            currentModuleIndex = section.modules.findIndex((module: CoreCourseModuleData) => module.id == this.currentModuleId);
+            currentModuleIndex = section.modules.findIndex((module: CoreCourseModuleData) => module.id == currentModuleId);
 
             return currentModuleIndex >= 0;
         });
diff --git a/src/core/features/course/pages/module-preview/module-preview.html b/src/core/features/course/pages/module-preview/module-preview.html
index 8f352f3b5..711f8c740 100644
--- a/src/core/features/course/pages/module-preview/module-preview.html
+++ b/src/core/features/course/pages/module-preview/module-preview.html
@@ -25,8 +25,7 @@
     </ion-refresher>
     <core-loading [hideUntil]="loaded">
         <core-course-module-info [module]="module" [courseId]="courseId" [description]="module.description" [component]="module.modname"
-            [componentId]="module.id" (completionChanged)="onCompletionChange()" [expandDescription]="true"
-            [showManualCompletion]="showManualCompletion">
+            [componentId]="module.id" [expandDescription]="true">
 
             <div class="safe-area-padding-horizontal ion-padding" *ngIf="module.handlerData?.extraBadge">
                 <ion-badge class="ion-text-wrap ion-text-start" [color]="module.handlerData?.extraBadgeColor">
@@ -61,5 +60,6 @@
         </core-course-module-info>
     </core-loading>
 
-    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModuleId]="module.id"></core-course-module-navigation>
+    <core-course-module-navigation [hidden]="!loaded" [courseId]="courseId" [currentModule]="module"
+        (completionChanged)="onCompletionChange()" [showManualCompletion]="showManualCompletion"></core-course-module-navigation>
 </ion-content>
diff --git a/src/core/features/siteplugins/components/module-index/core-siteplugins-module-index.html b/src/core/features/siteplugins/components/module-index/core-siteplugins-module-index.html
index ac5c6b837..89dfe24d8 100644
--- a/src/core/features/siteplugins/components/module-index/core-siteplugins-module-index.html
+++ b/src/core/features/siteplugins/components/module-index/core-siteplugins-module-index.html
@@ -30,4 +30,5 @@
     (onLoadingContent)="contentLoading()">
 </core-site-plugins-plugin-content>
 
-<core-course-module-navigation *ngIf="module" [courseId]="courseId" [currentModuleId]="module.id"></core-course-module-navigation>
+<core-course-module-navigation *ngIf="module" [courseId]="courseId" [currentModule]="module">
+</core-course-module-navigation>

From a2a6c5d3f6dc3fca33c4784bd724981543e30db5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 19 Jan 2022 15:57:03 +0100
Subject: [PATCH 6/6] MOBILE-3814 user: Apply new UX to user menu

---
 .../components/user-menu/user-menu.html       | 38 +++++++++++--------
 .../components/user-menu/user-menu.scss       | 15 +++++++-
 src/theme/theme.base.scss                     |  2 +-
 3 files changed, 37 insertions(+), 18 deletions(-)

diff --git a/src/core/features/mainmenu/components/user-menu/user-menu.html b/src/core/features/mainmenu/components/user-menu/user-menu.html
index 2f30c77d8..5b9b777b3 100644
--- a/src/core/features/mainmenu/components/user-menu/user-menu.html
+++ b/src/core/features/mainmenu/components/user-menu/user-menu.html
@@ -14,23 +14,21 @@
 </ion-header>
 <ion-content>
     <ion-list>
-        <ion-item button class="core-user-profile-maininfo" *ngIf="siteInfo" lines="full" (click)="switchAccounts($event)" detail="true"
-            [attr.aria-label]="'core.mainmenu.switchaccount' | translate">
-            <core-user-avatar [user]="siteInfo" [userId]="siteInfo.userid" [linkProfile]="false" slot="start"></core-user-avatar>
+        <ion-item button class="core-usermenu-siteinfo ion-text-wrap" *ngIf="siteInfo" lines="full" detail="false" [href]="siteUrl"
+            core-link auto-login="yes">
             <ion-label>
-                <h2>{{ siteInfo.fullname }}</h2>
-                <p class="core-usermenu-siteinfo core-usermenu-sitename">
+                <p class="core-usermenu-sitename">
                     <core-format-text [text]="siteName" contextLevel="system" [contextInstanceId]="0" [wsNotFiltered]="true">
                     </core-format-text>
                 </p>
+                <a [href]="siteUrl" core-link auto-login="yes" class="core-usermenu-siteurl">{{ siteUrl }}</a>
             </ion-label>
         </ion-item>
-
-        <ion-item button class="ion-text-wrap core-usermenu-handler" (click)="openUserProfile($event)"
-            [attr.aria-label]="'core.user.details' | translate" detail="true" lines="none">
-            <ion-icon name="fas-user" slot="start" aria-hidden="true"></ion-icon>
+        <ion-item button class="core-usermenu-handler ion-text-wrap" *ngIf="siteInfo" lines="full" (click)="openUserProfile($event)"
+            detail="true" [attr.aria-label]="'core.user.profile' | translate">
+            <core-user-avatar [user]="siteInfo" [userId]="siteInfo.userid" [linkProfile]="false" slot="start"></core-user-avatar>
             <ion-label>
-                <p class="item-heading">{{ 'core.user.profile' | translate }}</p>
+                <h2>{{ siteInfo.fullname }}</h2>
             </ion-label>
         </ion-item>
 
@@ -66,10 +64,18 @@
         </ion-item>
     </ion-list>
 </ion-content>
-<ion-footer class="ion-padding">
-    <ion-button (click)="logout($event)" expand="block" color="danger" [attr.aria-label]="'core.mainmenu.logout' | translate"
-        class="ion-text-wrap">
-        <ion-icon name="fas-sign-out-alt" slot="start" aria-hidden="true"></ion-icon>
-        {{ 'core.mainmenu.logout' | translate }}
-    </ion-button>
+<ion-footer>
+    <ion-item button lines="full" (click)="switchAccounts($event)" detail="true" class="ion-text-wrap">
+        <ion-icon name="fas-exchange-alt" slot="start" aria-hidden="true"></ion-icon>
+        <ion-label>
+            <p class="item-heading">{{ 'core.mainmenu.switchaccount' | translate }}</p>
+        </ion-label>
+    </ion-item>
+    <div class="ion-padding">
+        <ion-button (click)="logout($event)" expand="block" color="danger" [attr.aria-label]="'core.mainmenu.logout' | translate"
+            class="ion-text-wrap">
+            <ion-icon name="fas-sign-out-alt" slot="start" aria-hidden="true"></ion-icon>
+            {{ 'core.mainmenu.logout' | translate }}
+        </ion-button>
+    </div>
 </ion-footer>
diff --git a/src/core/features/mainmenu/components/user-menu/user-menu.scss b/src/core/features/mainmenu/components/user-menu/user-menu.scss
index 74e3b93a4..924139eef 100644
--- a/src/core/features/mainmenu/components/user-menu/user-menu.scss
+++ b/src/core/features/mainmenu/components/user-menu/user-menu.scss
@@ -3,16 +3,25 @@
 :host {
     .core-user-menu-preferences {
         --inner-border-width: 0;
-        --border-width: 1px 0 0 0; 
+        --border-width: 1px 0 0 0;
     }
 }
 
+.core-usermenu-siteinfo {
+    --padding-top: 10px;
+    --padding-bottom: 10px;
+}
+
 @if ($core-user-hide-siteinfo) {
     .core-usermenu-siteinfo {
         display: none;
     }
 }
 
+.core-usermenu-sitename {
+    font-size: 16px;
+}
+
 @if ($core-user-hide-sitename) {
     .core-usermenu-sitename {
         display: none;
@@ -24,3 +33,7 @@
         display: none;
     }
 }
+
+ion-footer {
+    background: var(--contrast-background);
+}
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index fa122a16c..204469c4c 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -554,7 +554,7 @@ body.core-iframe-fullscreen ion-router-outlet {
             display: block;
             height: 100% !important;
             width: auto;
-            min-width: #{$modal-lateral-width};
+            min-width: calc(#{$modal-lateral-width} - 16px);
             box-shadow: 0 28px 48px rgba(0, 0, 0, 0.4);
         }
         ion-backdrop {