MOBILE-3659 course: Implement unsupported module page

src/core/components/tabs/core-tabs.html

@@ -1,5 +1,5 @@
 <ion-tabs class="hide-header">
-    <ion-tab-bar slot="top" class="core-tabs-bar" [hidden]="!tabs || numTabsShown < 1">
+    <ion-tab-bar slot="top" class="core-tabs-bar" [hidden]="!tabs || numTabsShown <= 1">
         <ion-spinner *ngIf="!hideUntil"></ion-spinner>
         <ion-row *ngIf="hideUntil">
             <ion-col class="col-with-arrow ion-no-padding" (click)="slidePrev()" size="1">

src/core/features/course/components/unsupported-module/core-course-unsupported-module.html

@@ -19,7 +19,7 @@
         <p><strong>{{ 'core.course.useactivityonbrowser' | translate }}</strong></p>
         <ion-button expand="block" [href]="module.url" core-link>
             {{ 'core.openinbrowser' | translate }}
-            <ion-icon name="open" slot="end"></ion-icon>
+            <ion-icon name="fas-external-link-alt" slot="end"></ion-icon>
         </ion-button>
     </div>
 </div>

src/core/features/course/course-lazy.module.ts

@@ -25,6 +25,11 @@ const routes: Routes = [
         path: 'index',
         loadChildren: () => import('./pages/index/index.module').then( m => m.CoreCourseIndexPageModule),
     },
+    {
+        path: 'unsupported-module',
+        loadChildren: () => import('./pages/unsupported-module/unsupported-module.module')
+            .then( m => m.CoreCourseUnsupportedModulePageModule),
+    },
 ];
 
 @NgModule({

src/core/features/course/pages/unsupported-module/unsupported-module.html

@@ -0,0 +1,25 @@
+<ion-header>
+    <ion-toolbar>
+        <ion-buttons slot="start">
+            <ion-back-button [attr.aria-label]="'core.back' | translate"></ion-back-button>
+        </ion-buttons>
+        <ion-title>
+            <core-format-text [text]="module?.name" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
+            </core-format-text>
+        </ion-title>
+
+        <ion-buttons slot="end">
+            <core-context-menu>
+                <core-context-menu-item [priority]="900" *ngIf="module?.url" [href]="module!.url"
+                    [content]="'core.openinbrowser' | translate" iconAction="fas-external-link-alt">
+                </core-context-menu-item>
+                <core-context-menu-item [priority]="800" *ngIf="module?.description" [content]="'core.moduleintro' | translate"
+                    (action)="expandDescription()" iconAction="fas-arrow-right">
+                </core-context-menu-item>
+            </core-context-menu>
+        </ion-buttons>
+    </ion-toolbar>
+</ion-header>
+<ion-content>
+    <core-course-unsupported-module [module]="module" [courseId]="courseId"></core-course-unsupported-module>
+</ion-content>

src/core/features/course/pages/unsupported-module/unsupported-module.module.ts

@@ -0,0 +1,46 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule, Routes } from '@angular/router';
+import { IonicModule } from '@ionic/angular';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { CoreSharedModule } from '@/core/shared.module';
+import { CoreCourseUnsupportedModulePage } from './unsupported-module';
+import { CoreCourseComponentsModule } from '@features/course/components/components.module';
+
+const routes: Routes = [
+    {
+        path: '',
+        component: CoreCourseUnsupportedModulePage,
+    },
+];
+
+@NgModule({
+    imports: [
+        RouterModule.forChild(routes),
+        CommonModule,
+        IonicModule,
+        TranslateModule.forChild(),
+        CoreSharedModule,
+        CoreCourseComponentsModule,
+    ],
+    declarations: [
+        CoreCourseUnsupportedModulePage,
+    ],
+    exports: [RouterModule],
+})
+export class CoreCourseUnsupportedModulePageModule {}

src/core/features/course/pages/unsupported-module/unsupported-module.ts

@@ -0,0 +1,54 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { Component, OnInit } from '@angular/core';
+
+import { CoreCourseWSModule } from '@features/course/services/course';
+import { CoreNavigator } from '@services/navigator';
+import { CoreTextUtils } from '@services/utils/text';
+import { Translate } from '@singletons';
+
+/**
+ * Page that displays info about an unsupported module.
+ */
+@Component({
+    selector: 'page-core-course-unsupported-module',
+    templateUrl: 'unsupported-module.html',
+})
+export class CoreCourseUnsupportedModulePage implements OnInit {
+
+    module?: CoreCourseWSModule;
+    courseId?: number;
+
+    /**
+     * @inheritDoc
+     */
+    ngOnInit(): void {
+        this.module = CoreNavigator.instance.getRouteParam('module');
+        this.courseId = CoreNavigator.instance.getRouteParam('courseId');
+    }
+
+    /**
+     * Expand the description.
+     */
+    expandDescription(): void {
+        CoreTextUtils.instance.viewText(Translate.instance.instant('core.description'), this.module!.description!, {
+            filter: true,
+            contextLevel: 'module',
+            instanceId: this.module!.id,
+            courseId: this.courseId,
+        });
+    }
+
+}

src/core/features/course/services/handlers/default-module.ts

@@ -13,7 +13,6 @@
 // limitations under the License.
 
 import { Injectable, Type } from '@angular/core';
-import { NavigationOptions } from '@ionic/angular/providers/nav-controller';
 
 import { CoreSites } from '@services/sites';
 import { CoreCourseModuleHandler, CoreCourseModuleHandlerData } from '../module-delegate';
@@ -21,6 +20,7 @@ import { CoreCourse, CoreCourseModuleBasicInfo, CoreCourseWSModule } from '../co
 import { CoreCourseAnyCourseData } from '@features/courses/services/courses';
 import { CoreCourseModule } from '../course-helper';
 import { CoreCourseUnsupportedModuleComponent } from '@features/course/components/unsupported-module/unsupported-module';
+import { CoreNavigationOptions, CoreNavigator } from '@services/navigator';
 
 /**
  * Default handler used when the module doesn't have a specific implementation.
@@ -59,12 +59,14 @@ export class CoreCourseModuleDefaultHandler implements CoreCourseModuleHandler {
             icon: CoreCourse.instance.getModuleIconSrc(module.modname, 'modicon' in module ? module.modicon : undefined),
             title: module.name,
             class: 'core-course-default-handler core-course-module-' + module.modname + '-handler',
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            action: (event: Event, module: CoreCourseModule, courseId: number, options?: CoreNavigationOptions): void => {
-            action: (event: Event, module: CoreCourseModule, courseId: number, options?: NavigationOptions): void => {
                 event.preventDefault();
                 event.stopPropagation();
 
-                // @todo navCtrl.push('CoreCourseUnsupportedModulePage', { module: module, courseId: courseId }, options);
+                options = options || {};
+                options.params = { module, courseId };
+
+                CoreNavigator.instance.navigateToSitePath('course/unsupported-module', options);
             },
         };