feat(release): auto-generate blog posts

.github/workflows/release.yml

@@ -36,7 +36,9 @@ jobs:
         shell: bash
         run: |
           set -euo pipefail
-          node scripts/update-versions.mjs "$TAG"
+          node scripts/release/update-versions.mjs "$TAG"
+          node scripts/release/create-post.mjs "$TAG"
+          node --run format
 
       - name: Open pull request
         uses: peter-evans/create-pull-request@5f6978faf089d4d20b00c7766989d076bb2fc7f1 # v8.1.1

.prettierignore

@@ -8,4 +8,5 @@ out
 /pages/docs/plugins/*
 !/pages/docs/plugins/index.md
 versions.json
-/generated
+/generated
+*.hbs

package.json

@@ -42,6 +42,7 @@
     "eslint": "^10.4.0",
     "feed": "^6.0.0",
     "globals": "^17.6.0",
+    "handlebars": "^4.7.9",
     "husky": "^9.1.7",
     "lint-staged": "^17.0.5",
     "prettier": "^3.8.3",

scripts/markdown/governance.mjs

@@ -1,14 +1,8 @@
 import { mkdir, writeFile } from 'node:fs/promises';
 import { join } from 'node:path';
-import { fetchWithRetry } from '../utils/fetch.mjs';
+import { fetchWithAuth } from '../utils/fetch.mjs';
 import { rewriteRelativeLinks } from './sanitize.mjs';
 
-const { GH_TOKEN } = process.env;
-
-const BASE_HEADERS = {
-  ...(GH_TOKEN && { Authorization: `Bearer ${GH_TOKEN}` }),
-};
-
 // Maps source filenames in webpack/governance repo to their output slug and sidebar label.
 // Insertion order determines sidebar order, this could be changed as per need.
 const FILE_MAP = {
@@ -50,7 +44,7 @@ await mkdir(outputDir, { recursive: true });
 const results = await Promise.all(
   Object.entries(FILE_MAP).map(async ([source, { output, label }]) => {
     const url = `https://raw.githubusercontent.com/webpack/governance/HEAD/${source}`;
-    const res = await fetchWithRetry(url, { headers: BASE_HEADERS });
+    const res = await fetchWithAuth(url);
 
     if (!res.ok) {
       console.error(`Failed: ${source} -> ${res.status} ${res.statusText}`);

scripts/markdown/readmes.mjs

@@ -1,15 +1,8 @@
 import { mkdir, writeFile } from 'node:fs/promises';
 import { join } from 'node:path';
-import { fetchWithRetry } from '../utils/fetch.mjs';
+import { fetchWithAuth, fetchWithRetry } from '../utils/fetch.mjs';
 import cleanupMarkdown from './sanitize.mjs';
 
-const { GH_TOKEN } = process.env;
-
-const BASE_HEADERS = {
-  ...(GH_TOKEN && { Authorization: `Bearer ${GH_TOKEN}` }),
-  'X-GitHub-Api-Version': '2022-11-28',
-};
-
 const parseNextLink = linkHeader =>
   linkHeader?.match(/<([^>]+)>;\s*rel="next"/)?.[1] ?? null;
 
@@ -20,7 +13,7 @@ const discoverRepos = async () => {
     'https://api.github.com/orgs/webpack/repos?per_page=100&type=public';
 
   while (url) {
-    const res = await fetchWithRetry(url, { headers: BASE_HEADERS });
+    const res = await fetchWithAuth(url);
 
     for (const repo of await res.json()) {
       if (repo.archived) continue;

scripts/release/create-post.mjs

@@ -0,0 +1,82 @@
+import { readFile, writeFile } from 'node:fs/promises';
+import { parseArgs } from 'node:util';
+
+import Handlebars from 'handlebars';
+import matter from 'gray-matter';
+
+import { fetchWithAuth } from '../../utils/fetch.mjs';
+
+const { values } = parseArgs({
+  options: {
+    // Author
+    author: { type: 'string', default: 'avivkeller' },
+  },
+});
+
+const API_BASE = 'https://api.github.com/repos/webpack/webpack';
+const TEMPLATE_PATH = new URL('./template.md.hbs', import.meta.url);
+
+const fetchJSON = url => fetchWithAuth(url).then(r => r.json());
+
+const getLatestVersion = async () => {
+  const { tag_name } = await fetchJSON(`${API_BASE}/releases/latest`);
+  return tag_name;
+};
+
+const getRemovedChangesets = async version => {
+  const { files = [] } = await fetchJSON(`${API_BASE}/commits/${version}`);
+
+  return files.filter(
+    file =>
+      file.status === 'removed' &&
+      file.filename.startsWith('.changeset/') &&
+      file.patch
+  );
+};
+
+const stripPatchMarkers = patch => patch.replace(/^@@.*\n|^[- ]/gm, '');
+const capitalize = value => value.charAt(0).toUpperCase() + value.slice(1);
+
+const parseChangeset = file => {
+  const { data, content } = matter(stripPatchMarkers(file.patch));
+  const [title, ...paragraphs] = content.trim().split(/\n{2,}/);
+
+  return {
+    notable: data.notable === true,
+    semver: capitalize(data.webpack),
+    title,
+    description: paragraphs.join('\n\n'),
+  };
+};
+
+async function renderReleaseNotes(version, changes, date) {
+  Handlebars.registerHelper('filter', (items, property, expected) =>
+    items.filter(item => item[property] === expected)
+  );
+
+  Handlebars.registerHelper('groupBy', (items, property) =>
+    Object.groupBy(items, item => item[property])
+  );
+
+  const source = await readFile(TEMPLATE_PATH, 'utf8');
+  const render = Handlebars.compile(source, { noEscape: true });
+
+  return render({
+    changes,
+    version,
+    date,
+    ...values,
+  });
+}
+
+const date = new Date().toISOString().slice(0, 10);
+const version = await getLatestVersion();
+const changesets = await getRemovedChangesets(version);
+const changes = changesets.map(parseChangeset);
+const post = await renderReleaseNotes(version, changes, date);
+writeFile(
+  new URL(
+    import.meta.resolve(`../../../pages/blog/${date}-webpack-${version}.md`)
+  ),
+  post
+);

scripts/release/template.md.hbs

@@ -0,0 +1,38 @@
+---
+date: '{{date}}'
+category: release
+title: 'webpack {{version}}'
+layout: blog-post
+author: '{{author}}'
+---
+
+# webpack {{version}}
+
+<!-- Hey Releaser! Add your super awesome description here. -->
+
+{{#with (filter changes "notable" true) as |notableChanges|}}
+{{#if notableChanges.length}}
+## Notable Changes
+
+{{#each notableChanges}}
+### _({{semver}})_ {{title}}
+
+{{description}}
+
+{{/each}}
+{{/if}}
+{{/with}}
+{{#with (filter changes "notable" false) as |otherChanges|}}
+{{#if otherChanges.length}}
+## Other Changes
+
+{{#each (groupBy otherChanges "semver")}}
+### {{@key}}
+
+{{#each this}}
+- {{title}}
+{{/each}}
+
+{{/each}}
+{{/if}}
+{{/with}}

scripts/utils/fetch.mjs

@@ -1,10 +1,8 @@
-// fetch()  wrapper that retries flakey responses like the  GitHub and Open Collective
-// occasionally 503 midbuild,so one blip doesn't fail the whole deploy.
+import { setTimeout as sleep } from 'node:timers/promises';
 
+const { GH_TOKEN } = process.env;
 const RETRYABLE = new Set([429, 502, 503, 504]);
 
-const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));
-
 // Use the server's Retry After when it sends one, otherwise back off.
 const delayFor = (attempt, baseDelay, response) => {
   const retryAfter = Number(response?.headers.get('retry-after'));
@@ -40,3 +38,21 @@ export const fetchWithRetry = async (
     await sleep(delayFor(attempt, baseDelay, response));
   }
 };
+
+const githubHeaders = {
+  ...(GH_TOKEN && { Authorization: `Bearer ${GH_TOKEN}` }),
+  'X-GitHub-Api-Version': '2022-11-28',
+};
+
+export const fetchWithAuth = (url, fetchOptions = {}, retryOptions) =>
+  fetchWithRetry(
+    url,
+    {
+      ...fetchOptions,
+      headers: {
+        ...fetchOptions?.headers,
+        githubHeaders,
+      },
+    },
+    retryOptions
+  );