release management api changelog

Author: aorcsik

src/css/changelog.css

@@ -150,6 +150,62 @@ aside.onebox .onebox-body h4 {
 
 /* aside.ondebox -- end */
 
+.rmcl {
+  display: flex;
+  flex-direction: column;
+  gap: .5rem;
+  margin-bottom: 2rem;
+}
+
+.rmcl h3, .rmcl p {
+  margin: 0;
+}
+
+.rmcl-http-method-tag {
+  background: #666;
+  border-radius: 3px;
+  padding: 0 10px;
+  color: #fff;
+  display: inline-block;
+  font-size: 0.75rem;
+  font-weight: bold;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+}
+.rmcl-http-method-tag.rmcl-http-method-get {
+  background: #61AFFE;
+}
+.rmcl-http-method-tag.rmcl-http-method-post {
+  background: #49CC90;
+}
+.rmcl-http-method-tag.rmcl-http-method-put {
+  background: #FAA130;
+}
+.rmcl-http-method-tag.rmcl-http-method-delete {
+  background: #F93E3E;
+}
+.rmcl-http-method-tag.rmcl-http-method-patch {
+  background: #50E3C2;
+}
+
+.rmcl-api-endpoint-url {
+  font-family: IBM Plex Mono, monospace;
+  font-size: 1rem;
+  color: #666;
+  font-weight: bold;
+}
+.rmcl-inline-code {
+  font-family: IBM Plex Mono, monospace;
+  font-size: .9rem;
+  color: #666;
+  background: var(--neutral-95);
+  border-radius: 3px;
+  padding: 0 5px;
+  display: inline-block;
+  line-height: 1.5;
+}
+
 /* skeleton loading */ 
 
 .changelog-loading {

src/js/changelog-topic.js

@@ -55,9 +55,17 @@ changelogService.loadTopic(topicSlugId).then((topic) => {
     lightboxWrapper.replaceWith(figure);
   });
 
-  document.getElementById('changelog-topic-leave-feedback-button').href =
-    `https://discuss.bitrise.io/t/${topic.slug}/${topic.id}`;
-  document.getElementById('changelog-topic-leave-feedback-button').target = '_blank';
+  if (topic.id === 0) {
+    document.querySelector('.changelog-topic-footer > div').textContent = 'Read more on Release Management API';
+    document.getElementById('changelog-topic-leave-feedback-button').href =
+      'https://api.bitrise.io/release-management/api-docs/index.html';
+    document.getElementById('changelog-topic-leave-feedback-button').target = '_blank';
+    document.getElementById('changelog-topic-leave-feedback-button').textContent = 'API Documentation';
+  } else {
+    document.getElementById('changelog-topic-leave-feedback-button').href =
+      `https://discuss.bitrise.io/t/${topic.slug}/${topic.id}`;
+    document.getElementById('changelog-topic-leave-feedback-button').target = '_blank';
+  }
 });
 
 if (import.meta.webpackHot) {

src/js/changelog/ChangelogService.js

@@ -27,10 +27,24 @@ class ChangelogService {
    * @returns {Promise<ChangelogTopic>}
    */
   async loadTopic(topicSlugId) {
+    if (topicSlugId.match(/rm-\d+/)) {
+      const url = `${this.apiBase}/changelog.json`;
+      const response = await fetch(url);
+      const json = await response.json();
+      const topicJson = json.topic_list.topics.filter((topic) => topic.id === 0 && topic.slug === topicSlugId);
+      if (topicJson.length > 0) {
+        return new ChangelogTopic(topicJson[0]);
+      }
+    }
+
     const url = `${this.apiBase}/changelog/api/t/${topicSlugId}.json`;
     const response = await fetch(url);
     const json = await response.json();
-    return new ChangelogTopic(json);
+    if (!json.errors || json.errors.length === 0) {
+      return new ChangelogTopic(json);
+    }
+
+    throw new Error(`Topic not found: ${topicSlugId}`);
   }
 }
 

src/js/changelog/ChangelogTagFactory.js

@@ -53,6 +53,11 @@ class ChangelogTagFactory {
       listItemTag.innerHTML = 'Step update';
       return listItemTag;
     }
+    if (tags.includes('api-update')) {
+      const listItemTag = this.tagBlueTemplate.cloneNode(true);
+      listItemTag.innerHTML = 'API update';
+      return listItemTag;
+    }
     if (tags.includes('deprecation')) {
       const listItemTag = this.tagYelowTemplate.cloneNode(true);
       listItemTag.innerHTML = 'Deprecation';

src/js/changelog/ChangelogTopic.js

@@ -9,9 +9,10 @@
  *  created_at: string,
  *  pinned: boolean,
  *  tags: string[],
- *  post_stream: {
+ *  post_stream?: {
  *    posts: DiscoursePost[]
  *  }
+ *  changelog?: RMAPIChangelog[]
  * }} DiscourseTopic
  */
 
@@ -22,6 +23,19 @@
  * }} DiscoursePost
  */
 
+/**
+ * @typedef {{
+ *  id: string,
+ *  level: number,
+ *  operation: string,
+ *  operationId: string,
+ *  path: string,
+ *  section: string,
+ *  source: string,
+ *  text: string
+ * }} RMAPIChangelog
+ */
+
 class ChangelogTopic {
   /** @param {DiscourseTopic} data */
   constructor(data) {
@@ -59,6 +73,9 @@ class ChangelogTopic {
 
   /** @returns {string} */
   get webflowUrl() {
+    if (this.id === 0) {
+      return `/changelog/${this.slug}`;
+    }
     return `/changelog/${this.slug}/${this.id}`;
   }
 
@@ -77,13 +94,29 @@ class ChangelogTopic {
 
   /** @returns {string} */
   get content() {
+    if (this.data.slug.match(/rm-\d+/) && this.data.changelog) {
+      return this.data.changelog
+        .map(
+          (changelog) => `
+          <div class='rmcl'>
+            <h3>${changelog.operationId}</h3>
+            <div>
+              <span class="rmcl-http-method-tag rmcl-http-method-${changelog.operation.toLocaleLowerCase()}">${changelog.operation}</span>
+              <span class="rmcl-api-endpoint-url">${changelog.path}</span>
+            </div>
+            <p>${changelog.text.replaceAll(/'([^']+)'/g, '<span class="rmcl-inline-code">$1</span>')}</p>
+          </div>
+      `,
+        )
+        .join('');
+    }
     return this.posts.length ? this.posts[0].cooked : '';
   }
 
   /** @returns {ChangelogTag[]} */
   get tags() {
     return (this.data.tags || []).filter((tag) =>
-      ['new-feature', 'feature-update', 'step-update', 'deprecation'].includes(tag),
+      ['new-feature', 'feature-update', 'step-update', 'deprecation', 'api-update'].includes(tag),
     );
   }
 }

src/js/changelog/build.js

@@ -95,6 +95,22 @@ async function buildChangelog() {
   const changelogTopics = await fetchCategory('/c/changelog/6.json');
   changelogTopics.forEach((topic) => topics.push(topic));
 
+  const releaseManagementPublicApiChangelog = await fetch(
+    'https://storage.googleapis.com/bitrise-release-management-public-api-docs/changelog.json',
+  );
+  (await releaseManagementPublicApiChangelog.json()).forEach((changelogLine) => {
+    const createdAt = Object.keys(changelogLine)[0];
+    topics.push({
+      id: 0,
+      title: `Release Management Public API Update`,
+      fancy_title: `Release Management Public API Update`,
+      slug: `rm-${createdAt.replaceAll(/[- :]/g, '')}`,
+      created_at: createdAt.replace(/(\d{2})-(\d{2})-(\d{4})(.*)/, '$3-$2-$1$4'),
+      tags: ['api-update'],
+      changelog: changelogLine[createdAt],
+    });
+  });
+
   topics.sort((a, b) => {
     const aDate = new Date(a.created_at);
     const bDate = new Date(b.created_at);