refactor: rename component and translation keys

Author: ghostdevv

…nents/Package/ZeroDirectDependencies.vue …/components/Package/ZeroDependencies.vueapp/components/Package/ZeroDirectDependencies.vue renamed to app/components/Package/ZeroDependencies.vue app/components/Package/ZeroDirectDependencies.vue renamed to app/components/Package/ZeroDependencies.vue

@@ -5,10 +5,10 @@
     >
       <h2 id="zero-direct-deps-heading" class="font-medium mb-1 flex items-center gap-2">
         <span class="i-lucide:circle-check-big w-4 h-4" aria-hidden="true" />
-        {{ $t('package.dependencies.zero_direct_banner_title') }}
+        {{ $t('package.dependencies.zero_dependencies.title') }}
       </h2>
       <p class="text-sm m-0 mt-1">
-        {{ $t('package.dependencies.zero_direct_banner_desc') }}
+        {{ $t('package.dependencies.zero_dependencies.description') }}
       </p>
     </div>
   </section>

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

@@ -1394,7 +1394,7 @@ const showSkeleton = shallowRef(false)
         <!-- Size / dependency increase notice -->
         <PackageSizeIncrease v-if="sizeDiff" :diff="sizeDiff" />
         <!-- Positive signal: no direct runtime dependencies -->
-        <PackageZeroDirectDependencies v-if="hasZeroDirectDependencies" />
+        <PackageZeroDependencies v-if="hasZeroDirectDependencies" />
         <!-- Vulnerability scan -->
         <ClientOnly>
           <PackageVulnerabilityTree

i18n/locales/en.json

@@ -414,8 +414,10 @@
       "outdated_minor": "{count} minor version behind (latest: {latest}) | {count} minor versions behind (latest: {latest})",
       "outdated_patch": "Patch update available (latest: {latest})",
       "has_replacement": "This dependency has suggested replacements",
-      "zero_direct_banner_title": "0 direct dependencies",
-      "zero_direct_banner_desc": "This package can help keep node_modules smaller and reduce the risk of upcoming security issues."
+      "zero_dependencies": {
+        "title": "0 dependencies",
+        "description": "This package can help keep node_modules smaller and reduce the risk of upcoming security issues."
+      }
     },
     "peer_dependencies": {
       "title": "Peer Dependency ({count}) | Peer Dependencies ({count})",

i18n/locales/zh-CN.json

@@ -404,8 +404,10 @@
       "outdated_minor": "落后 {count} 个次要版本（最新：{latest}）",
       "outdated_patch": "有可用的补丁更新（最新：{latest}）",
       "has_replacement": "该依赖有推荐的替代包。",
-      "zero_direct_banner_title": "0 个直接依赖",
-      "zero_direct_banner_desc": "这个包有利于你维护更小体积的 node_modules ，并降低未来安全问题的风险。"
+      "zero_dependencies": {
+        "title": "0 个直接依赖",
+        "description": "这个包有利于你维护更小体积的 node_modules ，并降低未来安全问题的风险。"
+      }
     },
     "peer_dependencies": {
       "title": "对等依赖（{count} 个）",

i18n/schema.json

@@ -1246,11 +1246,17 @@
             "has_replacement": {
               "type": "string"
             },
-            "zero_direct_banner_title": {
-              "type": "string"
-            },
-            "zero_direct_banner_desc": {
-              "type": "string"
+            "zero_dependencies": {
+              "type": "object",
+              "properties": {
+                "title": {
+                  "type": "string"
+                },
+                "description": {
+                  "type": "string"
+                }
+              },
+              "additionalProperties": false
             }
           },
           "additionalProperties": false

test/nuxt/a11y.spec.ts

@@ -229,7 +229,7 @@ import PackageTrendsChart from '~/components/Package/TrendsChart.vue'
 import FacetBarChart from '~/components/Compare/FacetBarChart.vue'
 import PackageLikeCard from '~/components/Package/LikeCard.vue'
 import SizeIncrease from '~/components/Package/SizeIncrease.vue'
-import PackageZeroDirectDependencies from '~/components/Package/ZeroDirectDependencies.vue'
+import PackageZeroDependencies from '~/components/Package/ZeroDependencies.vue'
 
 describe('component accessibility audits', () => {
   describe('DateTime', () => {
@@ -3531,9 +3531,9 @@ describe('component accessibility audits', () => {
     })
   })
 
-  describe('PackageZeroDirectDependencies', () => {
+  describe('PackageZeroDependencies', () => {
     it('should have no accessibility violations', async () => {
-      const component = await mountSuspended(PackageZeroDirectDependencies)
+      const component = await mountSuspended(PackageZeroDependencies)
       const results = await runAxe(component)
       expect(results.violations).toEqual([])
     })