when the latest gh release contains a link to a changelog.md the changelog info endpoint will return ChangelogMarkdownInfo instead of ChangelogReleaseInfo

Author: WilcoSp

app/pages/package/[[org]]/[name].vue

@@ -195,10 +195,6 @@ const { data: packageAnalysis } = usePackageAnalysis(packageName, requestedVersi
 const { data: moduleReplacement } = useModuleReplacement(packageName)
 const { data: changelog } = usePackageChangelog(packageName, requestedVersion)
 
-const hasChangelog = computed(
-  () => changelog.value?.type == 'release' || changelog.value?.type == 'md',
-)
-
 const {
   data: resolvedVersion,
   status: versionStatus,

server/utils/changelog/detectChangelog.ts

@@ -1,7 +1,14 @@
-import type { ChangelogReleaseInfo, ChangelogMarkdownInfo } from '~~/shared/types/changelog'
-import { ERROR_CHANGELOG_NOT_FOUND } from '~~/shared/utils/constants'
+import type {
+  ChangelogMarkdownInfo,
+  ChangelogInfo,
+  ChangelogReleaseInfo,
+} from '~~/shared/types/changelog'
 import { type RepoRef, parseRepoUrl } from '~~/shared/utils/git-providers'
 import type { ExtendedPackageJson } from '~~/shared/utils/package-analysis'
+import { ERROR_CHANGELOG_NOT_FOUND } from '~~/shared/utils/constants'
+import * as v from 'valibot'
+import { GithubReleaseSchama } from '~~/shared/schemas/changelog/release'
+
 // ChangelogInfo
 
 /**
@@ -39,44 +46,88 @@ export async function detectChangelog(
  * check whether releases are being used with this repo
  * @returns true if in use
  */
-async function checkReleases(ref: RepoRef): Promise<ChangelogReleaseInfo | false> {
-  const checkUrls = getLatestReleaseUrl(ref)
-
-  for (const checkUrl of checkUrls ?? []) {
-    const exists = await fetch(checkUrl, {
-      headers: {
-        // GitHub API requires User-Agent
-        'User-Agent': 'npmx.dev',
-      },
-      method: 'HEAD', // we just need to know if it exists or not
-    })
-      .then(r => r.ok)
-      .catch(() => false)
-    if (exists) {
-      return {
-        provider: ref.provider,
-        type: 'release',
-        repo: `${ref.owner}/${ref.repo}`,
-      }
+async function checkReleases(ref: RepoRef): Promise<ChangelogInfo | false> {
+  switch (ref.provider) {
+    case 'github': {
+      return checkLatestGithubRelease(ref)
     }
   }
+
+  // const checkUrls = getLatestReleaseUrl(ref)
+
+  // for (const checkUrl of checkUrls ?? []) {
+  //   const exists = await fetch(checkUrl, {
+  //     headers: {
+  //       // GitHub API requires User-Agent
+  //       'User-Agent': 'npmx.dev',
+  //     },
+  //     method: 'HEAD', // we just need to know if it exists or not
+  //   })
+  //     .then(r => r.ok)
+  //     .catch(() => false)
+  //   if (exists) {
+  //     return {
+  //       provider: ref.provider,
+  //       type: 'release',
+  //       repo: `${ref.owner}/${ref.repo}`,
+  //     }
+  //   }
+  // }
   return false
 }
 
-/**
- * get the url to check if releases are being used.
- *
- * @returns returns an array so that if providers don't have a latest that we can check for versions
- */
-function getLatestReleaseUrl(ref: RepoRef): null | string[] {
-  switch (ref.provider) {
-    case 'github':
-      return [`https://ungh.cc/repos/${ref.owner}/${ref.repo}/releases/latest`]
-  }
+/// releases
 
-  return null
+// /**
+//  * get the url to check if releases are being used.
+//  *
+//  * @returns returns an array so that if providers don't have a latest that we can check for versions
+//  */
+// function getLatestReleaseUrl(ref: RepoRef): null | string[] {
+//   switch (ref.provider) {
+//     case 'github':
+//       return [`https://ungh.cc/repos/${ref.owner}/${ref.repo}/releases/latest`]
+//   }
+
+//   return null
+// }
+
+const MD_REGEX = /(?<=\[.*?(changelog|releases|changes|history|news)\.md.*?\]\()(.*?)(?=\))/i
+
+function checkLatestGithubRelease(ref: RepoRef): Promise<ChangelogInfo | false> {
+  return $fetch(`https://ungh.cc/repos/${ref.owner}/${ref.repo}/releases/latest`)
+    .then(r => {
+      console.log(r)
+      const { release } = v.parse(v.object({ release: GithubReleaseSchama }), r)
+
+      const matchedChangelog = release.markdown?.match(MD_REGEX)?.at(0)
+
+      // if no changelog.md or the url doesn't contain /blob/
+      if (!matchedChangelog || !matchedChangelog.includes('/blob/')) {
+        return {
+          provider: ref.provider,
+          type: 'release',
+          repo: `${ref.owner}/${ref.repo}`,
+        } satisfies ChangelogReleaseInfo
+      }
+
+      const path = matchedChangelog.replace(/^.*\/blob\/[^/]+\//i, '')
+      return {
+        provider: ref.provider,
+        type: 'md',
+        path,
+        repo: `${ref.owner}/${ref.repo}`,
+        link: matchedChangelog,
+      } satisfies ChangelogMarkdownInfo
+    })
+    .catch(e => {
+      console.log('changelog error', e)
+      return false
+    })
 }
 
+/// changelog markdown
+
 const EXTENSIONS = ['.md', ''] as const
 
 const CHANGELOG_FILENAMES = ['changelog', 'releases', 'changes', 'history', 'news']

shared/types/changelog.ts

@@ -15,6 +15,10 @@ export interface ChangelogMarkdownInfo {
    */
   path: string
   repo: `${string}/${string}`
+  /**
+   * link to a rendered changelog markdown file
+   */
+  link?: string
 }
 
 export type ChangelogInfo = ChangelogReleaseInfo | ChangelogMarkdownInfo

test/unit/a11y-component-coverage.spec.ts

@@ -47,6 +47,7 @@ const SKIPPED_COMPONENTS: Record<string, string> = {
   'SkeletonInline.vue': 'Already covered indirectly via other component tests',
   'Button/Group.vue': "Wrapper component, tests wouldn't make much sense here",
   'Changelog/Releases.vue': 'Requires API calls',
+  'Changelog/Markdown.vue': 'Requires API call & only renders markdown html',
 }
 
 /**