Merge branch 'main' of github.com:harlan-zw/fork-npmx.dev into feat/og-image-v7

Author: harlan-zw

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -1,5 +1,7 @@
 name: "\U0001F41E Bug report"
 description: Create a report to help us improve npmx
+type: bug
+labels: ['pending triage']
 body:
   - type: markdown
     attributes:

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -1,5 +1,6 @@
 name: '🚀 Feature request'
 description: Suggest a feature that will improve npmx
+type: feature
 labels: ['pending triage']
 body:
   - type: markdown

app/components/AppFooter.vue

@@ -120,6 +120,10 @@ const closeModal = () => modalRef.value?.close?.()
                   <kbd class="kbd">f</kbd>
                   <span>{{ $t('shortcuts.open_diff') }}</span>
                 </li>
+                <li class="flex gap-2 items-center">
+                  <kbd class="kbd">t</kbd>
+                  <span>{{ $t('shortcuts.open_timeline') }}</span>
+                </li>
                 <li class="flex gap-2 items-center">
                   <kbd class="kbd">c</kbd>
                   <span>{{ $t('shortcuts.compare_from_package') }}</span>

app/components/Chart/SplitSparkline.vue

@@ -31,6 +31,9 @@ const props = defineProps<{
 
 const { locale } = useI18n()
 const colorMode = useColorMode()
+const numberFormatter = useNumberFormatter({
+  maximumFractionDigits: 0,
+})
 const resolvedMode = shallowRef<'light' | 'dark'>('light')
 const rootEl = shallowRef<HTMLElement | null>(null)
 const palette = getPalette('')
@@ -153,6 +156,9 @@ const configs = computed(() => {
           fontSize: 24,
           bold: false,
           color: colors.value.fg,
+          formatter: ({ value }) => {
+            return numberFormatter.value.format(value)
+          },
           datetimeFormatter: {
             enable: true,
             locale: locale.value,

app/components/Package/Header.vue

@@ -10,7 +10,7 @@ const props = defineProps<{
   latestVersion?: SlimVersion | null
   provenanceData?: ProvenanceDetails | null
   provenanceStatus?: string | null
-  page: 'main' | 'docs' | 'code' | 'diff'
+  page: 'main' | 'docs' | 'code' | 'diff' | 'timeline'
   versionUrlPattern: string
 }>()
 
@@ -162,12 +162,26 @@ const diffLink = computed((): RouteLocationRaw | null => {
   return diffRoute(props.pkg.name, props.resolvedVersion, props.latestVersion.version)
 })
 
+const timelineLink = computed((): RouteLocationRaw | null => {
+  if (props.pkg == null || props.resolvedVersion == null) return null
+  const split = props.pkg.name.split('/')
+  return {
+    name: 'timeline',
+    params: {
+      org: split.length === 2 ? split[0] : undefined,
+      packageName: split.length === 2 ? split[1]! : split[0]!,
+      version: props.resolvedVersion,
+    },
+  }
+})
+
 useShortcuts({
   '.': () => codeLink.value,
   'm': () => mainLink.value,
   'd': () => docsLink.value,
   'c': () => props.pkg && { name: 'compare' as const, query: { packages: props.pkg.name } },
   'f': () => diffLink.value,
+  't': () => timelineLink.value,
 })
 </script>
 
@@ -330,6 +344,15 @@ useShortcuts({
         >
           {{ $t('compare.compare_versions') }}
         </LinkBase>
+        <LinkBase
+          v-if="timelineLink"
+          :to="timelineLink"
+          aria-keyshortcuts="t"
+          class="decoration-none border-b-2 p-1 hover:border-accent/50 focus-visible:[outline-offset:-2px]!"
+          :class="page === 'timeline' ? 'border-accent text-accent!' : 'border-transparent'"
+        >
+          {{ $t('package.links.timeline') }}
+        </LinkBase>
       </nav>
     </div>
   </div>

app/components/Package/WeeklyDownloadStats.vue

@@ -60,7 +60,9 @@ function handleModalTransitioned() {
 }
 
 const { fetchPackageDownloadEvolution } = useCharts()
-const numberFormatter = useNumberFormatter()
+const numberFormatter = useNumberFormatter({
+  maximumFractionDigits: 0,
+})
 
 const { accentColors, selectedAccentColor } = useAccentColor()
 

app/composables/npm/usePackage.ts

@@ -86,12 +86,20 @@ export function transformPackument(
       const trustLevel = getTrustLevel(version)
       const hasProvenance = trustLevel !== 'none'
 
+      // Normalize license: some versions use { type: "MIT" } instead of "MIT"
+      let versionLicense = version.license
+      if (versionLicense && typeof versionLicense === 'object' && 'type' in versionLicense) {
+        versionLicense = (versionLicense as { type: string }).type
+      }
+
       filteredVersions[v] = {
         hasProvenance,
         trustLevel,
         version: version.version,
         deprecated: version.deprecated,
         tags: version.tags as string[],
+        license: typeof versionLicense === 'string' ? versionLicense : undefined,
+        type: typeof version.type === 'string' ? version.type : undefined,
       }
     }
   }

app/composables/useSettings.ts

@@ -73,7 +73,7 @@ const DEFAULT_SETTINGS: AppSettings = {
   },
   chartFilter: {
     averageWindow: 0,
-    smoothingTau: 1,
+    smoothingTau: 0,
     anomaliesFixed: true,
     predictionPoints: 4,
   },