fix: resolve CI failures (unused imports, type errors, i18n schema, a11y, component test)

thegreatalxx · thegreatalxx · commit 71785d66eb36 · 2026-03-22T13:26:25.000-04:00
diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue
@@ -24,7 +24,7 @@ const closeModal = () => modalRef.value?.close?.()
         <div class="hidden sm:grid sm:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-1 min-h-11 text-xs">
           <!-- Column 1: Product -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wider text-2xs mb-1">{{ $t('footer.product') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.product') }}</span>
             <LinkBase :to="{ name: 'about' }">{{ $t('footer.about') }}</LinkBase>
             <LinkBase :to="{ name: 'blog' }">{{ $t('footer.blog') }}</LinkBase>
             <LinkBase :to="NPMX_DOCS_SITE">{{ $t('footer.docs') }}</LinkBase>
@@ -119,15 +119,15 @@ const closeModal = () => modalRef.value?.close?.()
 
           <!-- Column 2: Legal & Info -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wider text-2xs mb-1">{{ $t('footer.legal') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.legal') }}</span>
             <LinkBase :to="{ name: 'privacy' }">{{ $t('privacy_policy.title') }}</LinkBase>
             <LinkBase :to="{ name: 'accessibility' }">{{ $t('a11y.footer_title') }}</LinkBase>
             <LinkBase :to="{ name: 'translation-status' }">{{ $t('translation_status.title') }}</LinkBase>
           </div>
 
           <!-- Column 3: Community -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wider text-2xs mb-1">{{ $t('footer.community') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.community') }}</span>
             <LinkBase to="https://repo.npmx.dev">{{ $t('footer.source') }}</LinkBase>
             <LinkBase to="https://social.npmx.dev">{{ $t('footer.social') }}</LinkBase>
             <LinkBase :to="discord.url">{{ discord.label }}</LinkBase>
diff --git a/app/components/CollapsibleSection.vue b/app/components/CollapsibleSection.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { shallowRef, computed } from 'vue'
-import { LinkBase } from '#components'
 
 interface Props {
   title: string
diff --git a/app/pages/package/[[org]]/[name].vue b/app/pages/package/[[org]]/[name].vue
@@ -322,11 +322,11 @@ const latestVersion = computed(() => {
 })
 
 // Detect license changes between current version and latest
+// SlimVersion does not carry license, so we compare against the package-level license
 const licenseChanged = computed(() => {
   const currentLicense = displayVersion.value?.license
-  const latestLicense = latestVersion.value?.license ?? pkg.value?.license
+  const latestLicense = pkg.value?.license
   if (!currentLicense || !latestLicense) return false
-  // Normalize: compare string representations
   const normalize = (l: unknown): string =>
     typeof l === 'string' ? l : (l as { type?: string })?.type ?? ''
   return normalize(currentLicense) !== normalize(latestLicense)
@@ -394,18 +394,6 @@ const sizeTooltip = computed(() => {
   return chunks.filter(Boolean).join('\n')
 })
 
-const hasDependencies = computed(() => {
-  if (!displayVersion.value) return false
-  const deps = displayVersion.value.dependencies
-  const peerDeps = displayVersion.value.peerDependencies
-  const optionalDeps = displayVersion.value.optionalDependencies
-  return (
-    (deps && Object.keys(deps).length > 0) ||
-    (peerDeps && Object.keys(peerDeps).length > 0) ||
-    (optionalDeps && Object.keys(optionalDeps).length > 0)
-  )
-})
-
 // Vulnerability count for the stats banner
 const vulnCount = computed(() => vulnTree.value?.totalCounts.total ?? 0)
 const hasVulnerabilities = computed(() => vulnCount.value > 0)
@@ -610,14 +598,14 @@ const showSkeleton = shallowRef(false)
                 {{ $t('package.stats.license') }}
               </dt>
               <dd class="font-mono text-sm text-fg flex items-center gap-2 flex-wrap">
-                <LicenseDisplay v-if="displayVersion?.license ?? pkg.license" :license="displayVersion?.license ?? pkg.license" />
+                <LicenseDisplay v-if="displayVersion?.license ?? pkg.license" :license="(displayVersion?.license ?? pkg.license) as string" />
                 <span v-else>{{ $t('package.license.none') }}</span>
                 <TooltipApp
                   v-if="licenseChanged"
-                  :text="$t('package.license.changed', { latest: latestVersion?.license ?? pkg.license })"
+                  :text="$t('package.license.changed', { latest: pkg.license })"
                   position="bottom"
                 >
-                  <span class="inline-flex items-center gap-1 px-1.5 py-0.5 text-2xs font-sans rounded bg-amber-500/15 text-amber-700 dark:text-amber-400 border border-amber-500/30 cursor-help">
+                  <span tabindex="0" class="inline-flex items-center gap-1 px-1.5 py-0.5 text-2xs font-sans rounded bg-amber-500/15 text-amber-700 dark:text-amber-400 border border-amber-500/30 cursor-help focus-visible:outline-2 focus-visible:outline-accent/70">
                     <span class="i-lucide:triangle-alert w-3 h-3" aria-hidden="true" />
                     {{ $t('package.license.changed_badge') }}
                   </span>
diff --git a/app/pages/package/[[org]]/[name]/dependents.vue b/app/pages/package/[[org]]/[name]/dependents.vue
@@ -19,12 +19,14 @@ const resolvedVersion = computed(() => {
   return latest
 })
 
-const displayVersion = computed(() => {
-  if (!pkg.value || !resolvedVersion.value) return null
-  return pkg.value.versions[resolvedVersion.value] ?? null
-})
+const displayVersion = computed(() => pkg.value?.requestedVersion ?? null)
 
-const latestVersion = computed(() => displayVersion.value ?? null)
+const latestVersion = computed(() => {
+  if (!pkg.value) return null
+  const latestTag = pkg.value['dist-tags']?.latest
+  if (!latestTag) return null
+  return pkg.value.versions[latestTag] ?? null
+})
 
 const versionUrlPattern = computed(() => {
   const split = packageName.value.split('/')
diff --git a/i18n/schema.json b/i18n/schema.json
@@ -63,6 +63,15 @@
         },
         "keyboard_shortcuts": {
           "type": "string"
+        },
+        "product": {
+          "type": "string"
+        },
+        "legal": {
+          "type": "string"
+        },
+        "community": {
+          "type": "string"
         }
       },
       "additionalProperties": false
@@ -625,6 +634,12 @@
         "scroll_to_top": {
           "type": "string"
         },
+        "previous": {
+          "type": "string"
+        },
+        "next": {
+          "type": "string"
+        },
         "cancel": {
           "type": "string"
         },
@@ -960,6 +975,9 @@
             },
             "compare_this_package": {
               "type": "string"
+            },
+            "dependents": {
+              "type": "string"
             }
           },
           "additionalProperties": false
@@ -1060,6 +1078,27 @@
           },
           "additionalProperties": false
         },
+        "dependents": {
+          "type": "object",
+          "properties": {
+            "title": {
+              "type": "string"
+            },
+            "subtitle": {
+              "type": "string"
+            },
+            "count": {
+              "type": "string"
+            },
+            "none": {
+              "type": "string"
+            },
+            "error": {
+              "type": "string"
+            }
+          },
+          "additionalProperties": false
+        },
         "readme": {
           "type": "object",
           "properties": {
@@ -1368,6 +1407,9 @@
             },
             "vulnerabilities_count": {
               "type": "string"
+            },
+            "none": {
+              "type": "string"
             }
           },
           "additionalProperties": false
@@ -1698,6 +1740,12 @@
             },
             "none": {
               "type": "string"
+            },
+            "changed_badge": {
+              "type": "string"
+            },
+            "changed": {
+              "type": "string"
             }
           },
           "additionalProperties": false
@@ -2526,6 +2574,9 @@
         },
         "binary_rendering_warning": {
           "type": "string"
+        },
+        "toggle_word_wrap": {
+          "type": "string"
         }
       },
       "additionalProperties": false
diff --git a/server/api/registry/dependents/[...pkg].get.ts b/server/api/registry/dependents/[...pkg].get.ts
@@ -1,4 +1,4 @@
-import { CACHE_MAX_AGE_FIVE_MINUTES, NPM_REGISTRY } from '#shared/utils/constants'
+import { CACHE_MAX_AGE_FIVE_MINUTES } from '#shared/utils/constants'
 
 const NPM_SEARCH_BASE = 'https://registry.npmjs.org/-/v1/search'
 

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { CACHE_MAX_AGE_FIVE_MINUTES, NPM_REGISTRY } from '#shared/utils/constants'`
	`1`	`+import { CACHE_MAX_AGE_FIVE_MINUTES } from '#shared/utils/constants'`
`2`	`2`
`3`	`3`	`const NPM_SEARCH_BASE = 'https://registry.npmjs.org/-/v1/search'`
`4`	`4`