From b1495c6c9d1366188ac6ce93ae6540592fb5f970 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Mon, 20 Mar 2023 09:49:45 +0100 Subject: [PATCH] MOBILE-4250 course: Improve translation of module names for a11y --- .../pages/course-storage/course-storage.html | 2 +- src/core/components/mod-icon/mod-icon.ts | 5 +++-- .../course/components/module-info/module-info.ts | 2 +- .../components/module-summary/module-summary.html | 3 ++- .../components/module-summary/module-summary.ts | 2 +- .../course/components/module/core-course-module.html | 2 +- src/core/features/course/components/module/module.ts | 2 +- src/core/features/course/services/course.ts | 12 ++++++------ 8 files changed, 16 insertions(+), 14 deletions(-) diff --git a/src/addons/storagemanager/pages/course-storage/course-storage.html b/src/addons/storagemanager/pages/course-storage/course-storage.html index c8a243275..51d3ebf7f 100644 --- a/src/addons/storagemanager/pages/course-storage/course-storage.html +++ b/src/addons/storagemanager/pages/course-storage/course-storage.html @@ -105,7 +105,7 @@ + [modname]="module.modname" [componentId]="module.instance" [fallbackTranslation]="module.modplural">

diff --git a/src/core/components/mod-icon/mod-icon.ts b/src/core/components/mod-icon/mod-icon.ts index 1d2f018b2..6cb43d41a 100644 --- a/src/core/components/mod-icon/mod-icon.ts +++ b/src/core/components/mod-icon/mod-icon.ts @@ -31,7 +31,8 @@ const fallbackModName = 'external-tool'; }) export class CoreModIconComponent implements OnInit, OnChanges { - @Input() modname?: string; // The module name. Used also as component if set. + @Input() modname = ''; // The module name. Used also as component if set. + @Input() fallbackTranslation = ''; // Fallback translation string if cannot auto translate. @Input() componentId?: number; // Component Id for external icons. @Input() modicon?: string; // Module icon url or local url. @Input() noFilter?: boolean; // Whether to disable filters. @@ -63,7 +64,7 @@ export class CoreModIconComponent implements OnInit, OnChanges { } } - this.modNameTranslated = this.modname ? CoreCourse.translateModuleName(this.modname) || '' : ''; + this.modNameTranslated = CoreCourse.translateModuleName(this.modname, this.fallbackTranslation); if (CoreSites.getCurrentSite()?.isVersionGreaterEqualThan('4.0')) { this.legacyIcon = false; 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 e66bc55e1..75999e0d8 100644 --- a/src/core/features/course/components/module-info/module-info.ts +++ b/src/core/features/course/components/module-info/module-info.ts @@ -61,7 +61,7 @@ export class CoreCourseModuleInfoComponent implements OnInit { async ngOnInit(): Promise { this.modicon = await CoreCourseModuleDelegate.getModuleIconSrc(this.module.modname, this.module.modicon, this.module); - this.moduleNameTranslated = CoreCourse.translateModuleName(this.module.modname || ''); + this.moduleNameTranslated = CoreCourse.translateModuleName(this.module.modname, this.module.modplural); this.showCompletion = CoreSites.getRequiredCurrentSite().isVersionGreaterEqualThan('3.11'); } diff --git a/src/core/features/course/components/module-summary/module-summary.html b/src/core/features/course/components/module-summary/module-summary.html index 49d4aca68..3a10cd9e5 100644 --- a/src/core/features/course/components/module-summary/module-summary.html +++ b/src/core/features/course/components/module-summary/module-summary.html @@ -14,7 +14,8 @@

- + {{moduleNameTranslated}}

diff --git a/src/core/features/course/components/module-summary/module-summary.ts b/src/core/features/course/components/module-summary/module-summary.ts index 1b6edd6df..e2f1415a4 100644 --- a/src/core/features/course/components/module-summary/module-summary.ts +++ b/src/core/features/course/components/module-summary/module-summary.ts @@ -174,7 +174,7 @@ export class CoreCourseModuleSummaryComponent implements OnInit, OnDestroy { this.componentId = this.module.id; this.externalUrl = this.module.url; this.courseId = this.courseId || this.module.course; - this.moduleNameTranslated = CoreCourse.translateModuleName(this.module.modname || ''); + this.moduleNameTranslated = CoreCourse.translateModuleName(this.module.modname, this.module.modplural); this.blog = await AddonBlog.isPluginEnabled(); diff --git a/src/core/features/course/components/module/core-course-module.html b/src/core/features/course/components/module/core-course-module.html index 3d8d08d2d..e76e3df4a 100644 --- a/src/core/features/course/components/module/core-course-module.html +++ b/src/core/features/course/components/module/core-course-module.html @@ -8,7 +8,7 @@ }"> + [componentId]="module.instance" [fallbackTranslation]="module.modplural"> diff --git a/src/core/features/course/components/module/module.ts b/src/core/features/course/components/module/module.ts index fa88c7094..e190819e8 100644 --- a/src/core/features/course/components/module/module.ts +++ b/src/core/features/course/components/module/module.ts @@ -69,7 +69,7 @@ export class CoreCourseModuleComponent implements OnInit, OnDestroy { * @inheritdoc */ async ngOnInit(): Promise { - this.modNameTranslated = CoreCourse.translateModuleName(this.module.modname) || ''; + this.modNameTranslated = CoreCourse.translateModuleName(this.module.modname, this.module.modplural); this.showLegacyCompletion = this.showLegacyCompletion ?? CoreConstants.CONFIG.uselegacycompletion ?? !CoreSites.getCurrentSite()?.isVersionGreaterEqualThan('3.11'); diff --git a/src/core/features/course/services/course.ts b/src/core/features/course/services/course.ts index b4c21263f..a2a18b9c7 100644 --- a/src/core/features/course/services/course.ts +++ b/src/core/features/course/services/course.ts @@ -1509,17 +1509,17 @@ export class CoreCourseProvider { * Translate a module name to current language. * * @param moduleName The module name. + * @param fallback Fallback text to use if not translated. Will use moduleName otherwise. + * * @returns Translated name. */ - translateModuleName(moduleName: string): string { - if (this.CORE_MODULES.indexOf(moduleName) < 0) { - moduleName = 'external-tool'; - } - + translateModuleName(moduleName: string, fallback?: string): string { const langKey = 'core.mod_' + moduleName; const translated = Translate.instant(langKey); - return translated !== langKey ? translated : moduleName; + return translated !== langKey ? + translated : + (fallback || moduleName); } /**