From a41df38a714fe6c533f33cae811c2c624c5d58f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Mon, 10 May 2021 16:54:50 +0200
Subject: [PATCH] MOBILE-3749 a11y: Remove usage of routerlink attribute

---
 .../courses/pages/categories/categories.html  |  5 ++---
 .../courses/pages/categories/categories.ts    |  9 ++++++++
 .../login/pages/credentials/credentials.html  |  6 ++----
 .../login/pages/credentials/credentials.ts    | 14 +++++++++++++
 src/core/features/login/pages/site/site.html  |  3 +--
 src/core/features/login/pages/site/site.ts    |  7 +++++++
 .../features/login/pages/sites/sites.html     |  3 +--
 src/core/features/login/pages/sites/sites.ts  |  7 +++++++
 .../features/sitehome/pages/index/index.html  |  8 +++----
 .../features/sitehome/pages/index/index.ts    | 21 +++++++++++++++++++
 10 files changed, 68 insertions(+), 15 deletions(-)

diff --git a/src/core/features/courses/pages/categories/categories.html b/src/core/features/courses/pages/categories/categories.html
index 190552887..e1216beb6 100644
--- a/src/core/features/courses/pages/categories/categories.html
+++ b/src/core/features/courses/pages/categories/categories.html
@@ -39,9 +39,8 @@
                 </ion-label>
             </ion-item-divider>
             <section *ngFor="let category of categories">
-                <ion-item class="ion-text-wrap" router-direction="forward"
-                    [routerLink]="['/main/home/courses/categories', category.id]"
-                    [attr.aria-label]="category.name" detail="true">
+                <ion-item button class="ion-text-wrap" (click)="openCategory(category.id)" [attr.aria-label]="category.name"
+                    detail="true">
                     <ion-icon name="fas-folder" slot="start" [attr.aria-label]="'core.category' | translate"></ion-icon>
                     <ion-label>
                         <h2>
diff --git a/src/core/features/courses/pages/categories/categories.ts b/src/core/features/courses/pages/categories/categories.ts
index f38243bbe..1714f4ebb 100644
--- a/src/core/features/courses/pages/categories/categories.ts
+++ b/src/core/features/courses/pages/categories/categories.ts
@@ -117,4 +117,13 @@ export class CoreCoursesCategoriesPage implements OnInit {
         });
     }
 
+    /**
+     * Open a category.
+     *
+     * @param categoryId Category Id.
+     */
+    openCategory(categoryId: number): void {
+        CoreNavigator.navigateToSitePath('courses/categories/' + categoryId);
+    }
+
 }
diff --git a/src/core/features/login/pages/credentials/credentials.html b/src/core/features/login/pages/credentials/credentials.html
index 18ed8045b..5d34e1eef 100644
--- a/src/core/features/login/pages/credentials/credentials.html
+++ b/src/core/features/login/pages/credentials/credentials.html
@@ -7,8 +7,7 @@
         <ion-title>{{ 'core.login.login' | translate }}</ion-title>
 
         <ion-buttons slot="end">
-            <ion-button fill="clear" router-direction="forward" routerLink="/settings"
-                [attr.aria-label]="'core.settings.appsettings' | translate">
+            <ion-button fill="clear" (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate">
                 <ion-icon slot="icon-only" name="fas-cog" aria-hidden="true"></ion-icon>
             </ion-button>
         </ion-buttons>
@@ -92,8 +91,7 @@
             <ion-item class="ion-text-wrap" lines="none" *ngIf="authInstructions">
                 <ion-label><p><core-format-text [text]="authInstructions" [filter]="false"></core-format-text></p></ion-label>
             </ion-item>
-            <ion-button expand="block" class="ion-margin" color="light" router-direction="forward" routerLink="/login/emailsignup"
-                [queryParams]="{siteUrl: siteUrl}">
+            <ion-button expand="block" class="ion-margin" color="light" (click)="openEmailSignup()">
                 {{ 'core.login.startsignup' | translate }}
             </ion-button>
         </ion-list>
diff --git a/src/core/features/login/pages/credentials/credentials.ts b/src/core/features/login/pages/credentials/credentials.ts
index 61cdeb2d5..ebde590b7 100644
--- a/src/core/features/login/pages/credentials/credentials.ts
+++ b/src/core/features/login/pages/credentials/credentials.ts
@@ -287,6 +287,20 @@ export class CoreLoginCredentialsPage implements OnInit, OnDestroy {
         }
     }
 
+    /**
+     * Open email signup page.
+     */
+    openEmailSignup(): void {
+        CoreNavigator.navigate('/login/emailsignup', { params: { siteUrl: this.siteUrl } });
+    }
+
+    /**
+     * Open settings page.
+     */
+    openSettings(): void {
+        CoreNavigator.navigate('/settings');
+    }
+
     /**
      * View destroyed.
      */
diff --git a/src/core/features/login/pages/site/site.html b/src/core/features/login/pages/site/site.html
index 2707d506e..7b509ee74 100644
--- a/src/core/features/login/pages/site/site.html
+++ b/src/core/features/login/pages/site/site.html
@@ -7,8 +7,7 @@
         <ion-title>{{ 'core.login.connecttomoodle' | translate }}</ion-title>
 
         <ion-buttons slot="end">
-            <ion-button fill="clear" router-direction="forward" routerLink="/settings"
-                [attr.aria-label]="'core.settings.appsettings' | translate">
+            <ion-button fill="clear" (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate">
                 <ion-icon slot="icon-only" name="fas-cog" aria-hidden="true"></ion-icon>
             </ion-button>
         </ion-buttons>
diff --git a/src/core/features/login/pages/site/site.ts b/src/core/features/login/pages/site/site.ts
index 88ee2c599..b37642d19 100644
--- a/src/core/features/login/pages/site/site.ts
+++ b/src/core/features/login/pages/site/site.ts
@@ -567,6 +567,13 @@ export class CoreLoginSitePage implements OnInit {
         CoreCustomURLSchemes.treatHandleCustomURLError(error);
     }
 
+    /**
+     * Open settings page.
+     */
+    openSettings(): void {
+        CoreNavigator.navigate('/settings');
+    }
+
 }
 
 /**
diff --git a/src/core/features/login/pages/sites/sites.html b/src/core/features/login/pages/sites/sites.html
index 20789cbb7..e9c437993 100644
--- a/src/core/features/login/pages/sites/sites.html
+++ b/src/core/features/login/pages/sites/sites.html
@@ -11,8 +11,7 @@
                 [attr.aria-label]="'core.delete' | translate">
                 <ion-icon slot="icon-only" name="fas-pen" aria-hidden="true"></ion-icon>
             </ion-button>
-            <ion-button router-direction="forward" routerLink="/settings"
-                [attr.aria-label]="'core.settings.appsettings' | translate">
+            <ion-button (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate">
                 <ion-icon slot="icon-only" name="fas-cog" aria-hidden="true"></ion-icon>
             </ion-button>
         </ion-buttons>
diff --git a/src/core/features/login/pages/sites/sites.ts b/src/core/features/login/pages/sites/sites.ts
index 7c5b778c5..34d4e873a 100644
--- a/src/core/features/login/pages/sites/sites.ts
+++ b/src/core/features/login/pages/sites/sites.ts
@@ -139,4 +139,11 @@ export class CoreLoginSitesPage implements OnInit {
         this.showDelete = !this.showDelete;
     }
 
+    /**
+     * Open settings page.
+     */
+    openSettings(): void {
+        CoreNavigator.navigate('/settings');
+    }
+
 }
diff --git a/src/core/features/sitehome/pages/index/index.html b/src/core/features/sitehome/pages/index/index.html
index 2a0225ab2..bb99d57cc 100644
--- a/src/core/features/sitehome/pages/index/index.html
+++ b/src/core/features/sitehome/pages/index/index.html
@@ -61,7 +61,7 @@
 </ion-content>
 
 <ng-template #allCourseList>
-    <ion-item button class="ion-text-wrap" router-direction="forward" routerLink="/main/home/courses/all" detail="true">
+    <ion-item button class="ion-text-wrap" (click)="openAvailableCourses()" detail="true">
         <ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true"></ion-icon>
         <ion-label>
             <h2>{{ 'core.courses.availablecourses' | translate}}</h2>
@@ -75,7 +75,7 @@
 </ng-template>
 
 <ng-template #categories>
-    <ion-item button class="ion-text-wrap" router-direction="forward" routerLink="/main/home/courses/categories" detail="true">
+    <ion-item button class="ion-text-wrap" (click)="openCourseCategories()" detail="true">
         <ion-icon name="fas-folder" slot="start" aria-hidden="true"></ion-icon>
         <ion-label>
             <h2>{{ 'core.courses.categories' | translate}}</h2>
@@ -84,7 +84,7 @@
 </ng-template>
 
 <ng-template #enrolledCourseList>
-    <ion-item button class="ion-text-wrap" router-direction="forward" routerLink="/main/home/courses/my" detail="true">
+    <ion-item button class="ion-text-wrap" (click)="openMyCourses()" detail="true">
         <ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true">
         </ion-icon>
         <ion-label><h2>{{ 'core.courses.mycourses' | translate}}</h2></ion-label>
@@ -92,7 +92,7 @@
 </ng-template>
 
 <ng-template #courseSearch>
-    <ion-item button class="ion-text-wrap" router-direction="forward" routerLink="/main/home/courses/search" detail="true">
+    <ion-item button class="ion-text-wrap" (click)="openSearch()" detail="true">
         <ion-icon name="fas-search" slot="start" aria-hidden="true"></ion-icon>
         <ion-label><h2>{{ 'core.courses.searchcourses' | translate}}</h2></ion-label>
     </ion-item>
diff --git a/src/core/features/sitehome/pages/index/index.ts b/src/core/features/sitehome/pages/index/index.ts
index 591da63fd..8976ef25e 100644
--- a/src/core/features/sitehome/pages/index/index.ts
+++ b/src/core/features/sitehome/pages/index/index.ts
@@ -221,6 +221,27 @@ export class CoreSiteHomeIndexPage implements OnInit, OnDestroy {
         CoreNavigator.navigateToSitePath('courses/search');
     }
 
+    /**
+     * Go to available courses.
+     */
+    openAvailableCourses(): void {
+        CoreNavigator.navigateToSitePath('courses/all');
+    }
+
+    /**
+     * Go to my courses.
+     */
+    openMyCourses(): void {
+        CoreNavigator.navigateToSitePath('courses/my');
+    }
+
+    /**
+     * Go to course categories.
+     */
+    openCourseCategories(): void {
+        CoreNavigator.navigateToSitePath('courses/categories');
+    }
+
     /**
      * Component being destroyed.
      */