feat: dynamically set curriculum href (#130)

* Edited curriculum_slug usage and added supported languages by freeCodeCamp which correspond to forum category slugs

* Edited decorateWidget() to refresh on every page change and update href of "Visit the Curriculum"

* Removed test case

* Fixed comment spacing

* Moved /learn from settings.yml

* Returned old script to previous state and added new one for href change logic

* Fixed lint issue

* Added toLowerCase() for category.name, others don't need it

* use api for container lookup

* fix: use category slug instead of name

* test: register home logo callback

* chore: use discovery service

* test: elements

* test: move curriculum-nav selector

* test: slugs

* test: settings

* fix: remove href overwrite

* fix: remove learn path

* fix: remove inline yaml comment

* fix: add german

---------

Co-authored-by: Erikas Bykovskis <[email protected]>

javascripts/discourse/api-initializers/freecodecamp.gjs

@@ -24,4 +24,25 @@ export default apiInitializer("0.8", (api) => {
       </div>
     </nav>
   </template>);
+
+  const curriculum_slugs = settings.curriculum_slug.split('|');
+  const languages = settings.languages.split('|');
+
+  api.onPageChange((_url, _title) => {
+    const curriculum_nav = document.querySelector('.curriculum-nav');
+    const category = api.container.lookup("service:discovery").category;
+
+    if (!curriculum_nav) {
+      return;
+    }
+    // Reset to default href;
+    curriculum_nav.href = settings.curriculum_src;
+
+    languages.forEach((lang, i) => {
+      if (lang.toLowerCase() === category?.slug?.toLowerCase()) {
+        const url_path = new URL(curriculum_slugs[i], settings.curriculum_src);
+        curriculum_nav.href = url_path.href;
+      }
+    });
+  })
 });

settings.yml

@@ -1,13 +1,44 @@
+# Forum languages
+# These settings are needed because forum languages and /learn/<language> are different
+languages:
+  default: espanol|chinese|chinese-traditional|italiano|portugues|ukrainian|japanese|german
+  description: "Languages forum slug names which are also available on freeCodeCamp curriculum"
+  type: list
+  list_type: simple
+  choices:
+    - espanol
+    - chinese
+    - chinese-traditional
+    - italiano
+    - portugues
+    - ukrainian
+    - japanese
+    - german
+
 # Navigation
 curriculum_title:
   default: Visit the Curriculum
-  description: "This text will be displayed in the curriculum navigation item"
+  description: "Text displayed in the curriculum navigation item"
 curriculum_title_short:
   default: Curriculum
-  description: "This is the short version of curriculum title used for mobile devices"
+  description: "The short version of curriculum title used for mobile devices"
 curriculum_src:
-  default: https://www.freecodecamp.org/learn
-  description: "This the link to related language curriculum"
+  default: https://www.freecodecamp.org/
+  description: "The link to related language curriculum"
+curriculum_slug:
+  default: espanol|chinese|chinese-traditional|italian|portuguese|ukrainian|japanese|german
+  description: "Slug attached to curriculum_src"
+  type: list
+  list-type: simple
+  choices:
+    - espanol
+    - chinese
+    - chinese-traditional
+    - italian
+    - portuguese
+    - ukrainian
+    - japanese
+    - german
 
 # Analytics
 Google_Tag_Manager: