fix: use consistent group-hover for deprecated version link colors

Author: danielroe

app/components/Package/Versions.vue

@@ -614,7 +614,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                 class="text-sm after:absolute after:inset-0 after:content-['']"
                 :class="
                   row.primaryVersion.deprecated
-                    ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                    ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                     : undefined
                 "
                 :title="
@@ -683,7 +683,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                 class="text-xs after:absolute after:inset-0 after:content-['']"
                 :class="
                   v.deprecated
-                    ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                    ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                     : undefined
                 "
                 :title="
@@ -795,7 +795,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                 class="text-xs after:absolute after:inset-0 after:content-['']"
                 :class="
                   row.primaryVersion.deprecated
-                    ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                    ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                     : undefined
                 "
                 :title="
@@ -882,7 +882,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                       class="text-xs after:absolute after:inset-0 after:content-['']"
                       :class="
                         group.versions[0]?.deprecated
-                          ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                          ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                           : undefined
                       "
                       :title="
@@ -949,7 +949,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                       class="text-xs ms-6 after:absolute after:inset-0 after:content-['']"
                       :class="
                         group.versions[0]?.deprecated
-                          ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                          ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                           : undefined
                       "
                       :title="
@@ -1021,7 +1021,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
                       class="text-xs after:absolute after:inset-0 after:content-['']"
                       :class="
                         v.deprecated
-                          ? 'text-red-800 hover:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
+                          ? 'text-red-800 group-hover/version-row:text-red-700 dark:text-red-400 dark:group-hover/version-row:text-red-300'
                           : undefined
                       "
                       :title="

test/nuxt/components/PackageVersions.spec.ts

@@ -101,7 +101,7 @@ describe('PackageVersions', () => {
       expect(versionLinks[0]?.text()).toBe('1.0.0')
     })
 
-    it('highlights the current version row when currentVersion prop matches', async () => {
+    it('highlights the current version row when selectedVersion prop matches', async () => {
       const component = await mountSuspended(PackageVersions, {
         props: {
           packageName: 'test-package',
@@ -114,11 +114,13 @@ describe('PackageVersions', () => {
             '2.0.0': '2024-01-15T12:00:00.000Z',
             '1.0.0': '2024-01-01T12:00:00.000Z',
           },
-          currentVersion: '1.0.0',
+          selectedVersion: '1.0.0',
         },
       })
 
-      const highlightedRows = component.findAll('.bg-bg-subtle')
+      // Find the version row divs that are direct children of the tag row containers
+      const versionRows = component.findAll('[class*="group/version-row"]')
+      const highlightedRows = versionRows.filter(row => row.classes().includes('bg-bg-subtle'))
       expect(highlightedRows.length).toBe(1)
       expect(highlightedRows[0]!.text()).toContain('1.0.0')
     })
@@ -136,7 +138,7 @@ describe('PackageVersions', () => {
             '2.0.0': '2024-01-15T12:00:00.000Z',
             '1.0.0': '2024-01-01T12:00:00.000Z',
           },
-          currentVersion: '1.0.0',
+          selectedVersion: '1.0.0',
         },
       })