updated command pallet to include changelog

Author: WilcoSp

app/composables/useCommandPalettePackageCommands.ts

@@ -27,6 +27,11 @@ export function useCommandPalettePackageCommands(
       .includes(packageName)
   }
 
+  const { data: changelog } = usePackageChangelog(
+    () => toValue(context)?.packageName,
+    () => toValue(context)?.resolvedVersion,
+  )
+
   useCommandPaletteContextCommands(
     computed((): CommandPaletteContextCommandInput[] => {
       const resolvedContext = toValue(context)
@@ -88,25 +93,43 @@ export function useCommandPalettePackageCommands(
           activeLabel: activeLabel(route.name === 'code', t('command_palette.here')),
           to: codeLink,
         },
-        {
-          id: 'package-compare',
+      ]
+
+      const uChangelog = changelog.value
+      if (uChangelog?.type === 'md' || uChangelog?.type === 'release') {
+        commands.push({
+          id: 'package-changelog',
           group: 'package',
-          label: t('command_palette.package.compare'),
-          keywords: [resolvedContext.packageName, t('shortcuts.compare_from_package')],
-          iconClass: 'i-lucide:git-compare',
-          active: route.name === 'compare' && isCurrentPackageCompare(resolvedContext.packageName),
+          label: t('command_palette.package.changelog'),
+          keywords: [resolvedContext.packageName, t('command_palette.package.changelog')],
+          iconClass: 'i-lucide:notebook-text',
+          to: changelogRoute(resolvedContext.packageName, resolvedContext.resolvedVersion),
+          active: route.name === 'changelog' || route.name === 'changelog-version',
           activeLabel: activeLabel(
-            route.name === 'compare' && isCurrentPackageCompare(resolvedContext.packageName),
+            route.name === 'changelog' || route.name === 'changelog-version',
             t('command_palette.here'),
           ),
-          to: {
-            name: 'compare',
-            query: {
-              packages: resolvedContext.packageName,
-            },
+        })
+      }
+
+      commands.push({
+        id: 'package-compare',
+        group: 'package',
+        label: t('command_palette.package.compare'),
+        keywords: [resolvedContext.packageName, t('shortcuts.compare_from_package')],
+        iconClass: 'i-lucide:git-compare',
+        active: route.name === 'compare' && isCurrentPackageCompare(resolvedContext.packageName),
+        activeLabel: activeLabel(
+          route.name === 'compare' && isCurrentPackageCompare(resolvedContext.packageName),
+          t('command_palette.here'),
+        ),
+        to: {
+          name: 'compare',
+          query: {
+            packages: resolvedContext.packageName,
           },
         },
-      ]
+      })
 
       if (resolvedContext.tarballUrl) {
         commands.push({

app/composables/usePackageChangelog.ts

@@ -1,11 +1,12 @@
 import type { ChangelogInfo } from '~~/shared/types/changelog'
 
 export function usePackageChangelog(
-  packageName: MaybeRefOrGetter<string>,
+  packageName: MaybeRefOrGetter<string | null | undefined>,
   version?: MaybeRefOrGetter<string | null | undefined>,
 ) {
-  return useLazyFetch<ChangelogInfo>(() => {
+  return useLazyFetch<ChangelogInfo | null>(() => {
     const name = toValue(packageName)
+    if (!name) return 'data:text/json,null' // returns null
     const ver = toValue(version)
     const base = `/api/changelog/info/${name}`
     return ver ? `${base}/v/${ver}` : base

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

@@ -70,6 +70,29 @@ const stickyStyle = computed(() => {
   }
 })
 
+// command pallet
+const { versions: commandPaletteVersions, ensureLoaded: ensureCommandPaletteVersionsLoaded } =
+  useCommandPalettePackageVersions(packageName)
+
+const commandPalettePackageContext = computed(() => {
+  const packageData = pkg.value
+  if (!packageData) return null
+
+  return {
+    packageName: packageData.name,
+    resolvedVersion: version.value ?? packageData['dist-tags']?.latest ?? null,
+    latestVersion: packageData['dist-tags']?.latest ?? null,
+    versions: commandPaletteVersions.value ?? Object.keys(packageData.versions ?? {}),
+    tarballUrl: packageData.requestedVersion?.dist.tarball ?? null,
+  }
+})
+
+useCommandPalettePackageContext(commandPalettePackageContext, {
+  onOpen: ensureCommandPaletteVersionsLoaded,
+})
+useCommandPalettePackageCommands(commandPalettePackageContext)
+
+// og image
 defineOgImageComponent('Default', {
   title: () => `${pkg.value?.name ?? 'Package'} - Changelogs`,
   description: () => pkg.value?.license ?? '',

i18n/locales/en.json

@@ -149,7 +149,8 @@
       "code": "Code",
       "diff": "Diff",
       "compare": "Compare this package",
-      "download": "Download tarball"
+      "download": "Download tarball",
+      "changelog": "Changelog"
     },
     "package_actions": {
       "copy_run": "Copy run command"

i18n/locales/fr-FR.json

@@ -149,7 +149,8 @@
       "code": "Code",
       "diff": "Diff",
       "compare": "Comparer ce paquet",
-      "download": "Télécharger le tarball"
+      "download": "Télécharger le tarball",
+      "changelog": "Changements"
     },
     "package_actions": {
       "copy_run": "Copier la commande d'exécution"
@@ -555,11 +556,7 @@
       },
       "page_title": "Historique des versions",
       "current_tags": "Tags actuels",
-      "no_match_filter": "Aucune version ne correspond à {filter}",
-      "copy_alt": {
-        "per_version_analysis": "La version {version} a été téléchargée {downloads} fois",
-        "general_description": "Graphique en barres montrant les téléchargements par version pour {versions_count} versions {semver_grouping_mode} du paquet {package_name}, {date_range_label} de la version {first_version} à la version {last_version}. La version la plus téléchargée est {max_downloaded_version} avec {max_version_downloads} téléchargements. {per_version_analysis}. {watermark}."
-      }
+      "no_match_filter": "Aucune version ne correspond à {filter}"
     },
     "dependencies": {
       "title": "Dépendances ({count})",

i18n/schema.json

@@ -453,6 +453,9 @@
             },
             "download": {
               "type": "string"
+            },
+            "changelog": {
+              "type": "string"
             }
           },
           "additionalProperties": false