From dc23a15a99ad6a200b11dcba55a4b7c90ca80fa9 Mon Sep 17 00:00:00 2001
From: Allen Bai <abai@redhat.com>
Date: Aug 25 2020 21:01:06 +0000
Subject: coreos: add initial boiler plate code for release notes


The design discussion of Fedora CoreOS release notes is located at https://github.com/coreos/fedora-coreos-tracker/issues/194. This commit adds boiler plate code for future addition of Fedora CoreOS release notes to the website, though currently there's no metadata available and no actual rendering will happen on the website.

Signed-off-by: Allen Bai <abai@redhat.com>

---

diff --git a/sites/static/js/coreos-release-notes.js b/sites/static/js/coreos-release-notes.js
index d89a736..79444d4 100644
--- a/sites/static/js/coreos-release-notes.js
+++ b/sites/static/js/coreos-release-notes.js
@@ -3,6 +3,10 @@
 //  - builds.json
 //  - meta.json
 //  - commitmeta.json
+// TODO: fetch and render the release notes objects
+//  - release-notes-stable.json
+//  - release-notes-testing.json
+//  - release-notes-next.json
 
 // In this implementation, only render the page after fetching all
 // of the four json files in the first place, and re-render if the user changes
@@ -54,6 +58,12 @@ function findImportantPkgs(commitmeta) {
   return r;
 }
 
+// Fetch function for release-notes-${stream}.json
+function fetchReleaseNotes(base, stream) {
+  return fetch(`${base}/release-notes-${stream}.json`)
+    .then(response => response.ok ? response.json() : []);
+}
+
 // The actual fetch function for `releases.json`
 function fetchReleases(base) {
   return fetch(`${base}/releases.json`)
@@ -333,7 +343,9 @@ var coreos_release_notes = new Vue({
     // list of unshown {id, arches, meta, commitmeta} build objects
     unshown_builds: [],
     // toggles "Loading..."
-    loading: true
+    loading: true,
+    // fetched release notes object
+    releaseNotes: {}
   },
   watch: {
     stream: function () {
@@ -407,6 +419,20 @@ var coreos_release_notes = new Vue({
 
         // Right pane consists of detailed package information
         let date = h('p', {}, `Release Date: ${timestampToPrettyString(build.meta['coreos-assembler.build-timestamp'])}`);
+
+        // TODO: render release notes with corresponding release notes object
+        let releaseNotesElements = []
+        if (this.releaseNotes.length > 0 && this.releaseNotes[build.id] != null) {
+          // TODO: naive implementation is a list of subjects under each component header
+          // in the future add buttons for detailed information of each note item
+          Object.keys(this.releaseNotes[build.id]).forEach((component, _) => {
+            let componentNoteItems = this.releaseNotes[build.id][component];
+            let releaseNotesComponentHeader = h('h5', {}, component);
+            let releaseNotesItems = h('ul', {}, componentNoteItems.map(noteItem => h('li', {}, noteItem.subject)));
+            releaseNotesElements.push(releaseNotesComponentHeader, releaseNotesItems);
+          });
+        }
+
         // List of important packages and versions
         let importantPkgsElements = [];
         build.commitmeta.importantPkgs.forEach((pkg, _) => {
@@ -622,7 +648,7 @@ var coreos_release_notes = new Vue({
         }
         let downgradedPkgsElements = h('div', { attrs: { hidden: true } }, [downgradedPkgsHeading, h('ul', {}, downgradedPkgsElementsList)]);
 
-        let rightPane = h('div', { class: "col-lg-10 border-bottom mb-5 pb-4" }, [date, importantPkgsElements, pkgSummaryDiv, totalPkgsElements, addedPkgsElements, removedPkgsElements, upgradedPkgsElements, downgradedPkgsElements]);
+        let rightPane = h('div', { class: "col-lg-10 border-bottom mb-5 pb-4" }, [date, releaseNotes, importantPkgsElements, pkgSummaryDiv, totalPkgsElements, addedPkgsElements, removedPkgsElements, upgradedPkgsElements, downgradedPkgsElements]);
         let row = h('div', { class: "row" }, [leftPane, rightPane]);
         rows.push(row);
       })
@@ -632,6 +658,8 @@ var coreos_release_notes = new Vue({
       this.loading = true
       this.releasesUrl = getBaseUrl(this.stream, this.developer);
       this.buildsUrl = getBaseUrl(this.stream, this.developer) + "/builds";
+      // TODO: fetch and store release notes objects and lets assume the endpoint is this.releasesUrl
+      fetchReleaseNotes(this.releasesUrl, this.stream).them(releaseNotes => this.releaseNotes = releaseNotes);
       fetchReleases(this.releasesUrl).then(releaseVersions => {
         fetchBuilds(this.buildsUrl).then(result => {
           [legacy, builds] = result;