refactor: remove unused release comparison code

Author: serhalp

app/components/compare/FacetRow.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { FacetValue, FacetDiffResult } from '#shared/types'
+import type { FacetValue } from '#shared/types'
 
 const props = defineProps<{
   /** Facet label */
@@ -8,8 +8,6 @@ const props = defineProps<{
   description?: string
   /** Values for each column */
   values: (FacetValue | null | undefined)[]
-  /** Diff results between adjacent columns (for release comparison) */
-  diffs?: (FacetDiffResult | null | undefined)[]
   /** Whether this row is loading */
   loading?: boolean
   /** Whether to show the proportional bar (defaults to true for numeric values) */
@@ -52,27 +50,6 @@ function getStatusClass(status?: FacetValue['status']): string {
       return 'text-fg'
   }
 }
-
-function getDiffClass(diff?: FacetDiffResult | null): string {
-  if (!diff) return ''
-  if (diff.favorable === true) return 'text-emerald-400'
-  if (diff.favorable === false) return 'text-red-400'
-  return 'text-fg-muted'
-}
-
-function getDiffIcon(diff?: FacetDiffResult | null): string {
-  if (!diff) return ''
-  switch (diff.direction) {
-    case 'increase':
-      return 'i-carbon:arrow-up'
-    case 'decrease':
-      return 'i-carbon:arrow-down'
-    case 'changed':
-      return 'i-carbon:arrows-horizontal'
-    default:
-      return ''
-  }
-}
 </script>
 
 <template>
@@ -94,7 +71,7 @@ function getDiffIcon(diff?: FacetDiffResult | null): string {
     <div
       v-for="(value, index) in values"
       :key="index"
-      class="comparison-cell relative flex flex-col items-end justify-center gap-1 px-4 py-3 border-b border-border"
+      class="comparison-cell relative flex items-end justify-center px-4 py-3 border-b border-border"
     >
       <!-- Background bar for numeric values -->
       <div
@@ -124,21 +101,6 @@ function getDiffIcon(diff?: FacetDiffResult | null): string {
           <DateTime v-if="value.type === 'date'" :datetime="value.display" date-style="medium" />
           <template v-else>{{ value.display }}</template>
         </span>
-
-        <!-- Diff indicator (if provided) -->
-        <div
-          v-if="diffs && diffs[index] && diffs[index]?.direction !== 'same'"
-          class="relative flex items-center gap-1 text-xs tabular-nums"
-          :class="getDiffClass(diffs[index])"
-        >
-          <span
-            v-if="getDiffIcon(diffs[index])"
-            class="w-3 h-3"
-            :class="getDiffIcon(diffs[index])"
-            aria-hidden="true"
-          />
-          <span>{{ diffs[index]?.display }}</span>
-        </div>
       </template>
     </div>
   </div>

shared/types/comparison.ts

@@ -129,20 +129,6 @@ export interface FacetValue<T = unknown> {
   type?: 'date'
 }
 
-/** Result of comparing two facet values */
-export interface FacetDiffResult<_T = unknown> {
-  /** Absolute difference (for numeric values) */
-  absoluteDiff?: number
-  /** Percentage difference (for numeric values) */
-  percentDiff?: number
-  /** Human-readable difference string */
-  display: string
-  /** Direction of change */
-  direction: 'increase' | 'decrease' | 'same' | 'changed'
-  /** Whether the change is favorable (depends on facet semantics) */
-  favorable?: boolean
-}
-
 /** Package data for comparison */
 export interface ComparisonPackage {
   name: string

test/nuxt/components.spec.ts

@@ -1349,22 +1349,6 @@ describe('component accessibility audits', () => {
       expect(results.violations).toEqual([])
     })
 
-    it('should have no accessibility violations with diffs', async () => {
-      const component = await mountSuspended(CompareFacetRow, {
-        props: {
-          label: 'Package Size',
-          description: 'Size of the package',
-          values: [
-            { raw: 100, display: '100 KB' },
-            { raw: 150, display: '150 KB' },
-          ],
-          diffs: [null, { display: '+50%', direction: 'increase' as const, favorable: false }],
-        },
-      })
-      const results = await runAxe(component)
-      expect(results.violations).toEqual([])
-    })
-
     it('should have no accessibility violations when loading', async () => {
       const component = await mountSuspended(CompareFacetRow, {
         props: {

test/nuxt/components/compare/FacetRow.spec.ts

@@ -169,82 +169,6 @@ describe('FacetRow', () => {
     })
   })
 
-  describe('diff indicators', () => {
-    it('renders diff with increase direction', async () => {
-      const component = await mountSuspended(FacetRow, {
-        props: {
-          ...baseProps,
-          values: [
-            { raw: 100, display: '100', status: 'neutral' },
-            { raw: 200, display: '200', status: 'neutral' },
-          ],
-          diffs: [null, { direction: 'increase', display: '+100%', favorable: true }],
-        },
-      })
-      expect(component.find('.i-carbon\\:arrow-up').exists()).toBe(true)
-      expect(component.text()).toContain('+100%')
-    })
-
-    it('renders diff with decrease direction', async () => {
-      const component = await mountSuspended(FacetRow, {
-        props: {
-          ...baseProps,
-          values: [
-            { raw: 200, display: '200', status: 'neutral' },
-            { raw: 100, display: '100', status: 'neutral' },
-          ],
-          diffs: [null, { direction: 'decrease', display: '-50%', favorable: false }],
-        },
-      })
-      expect(component.find('.i-carbon\\:arrow-down').exists()).toBe(true)
-    })
-
-    it('applies favorable diff styling (green)', async () => {
-      const component = await mountSuspended(FacetRow, {
-        props: {
-          ...baseProps,
-          values: [
-            { raw: 100, display: '100', status: 'neutral' },
-            { raw: 50, display: '50', status: 'neutral' },
-          ],
-          diffs: [null, { direction: 'decrease', display: '-50%', favorable: true }],
-        },
-      })
-      expect(component.find('.text-emerald-400').exists()).toBe(true)
-    })
-
-    it('applies unfavorable diff styling (red)', async () => {
-      const component = await mountSuspended(FacetRow, {
-        props: {
-          ...baseProps,
-          values: [
-            { raw: 100, display: '100', status: 'neutral' },
-            { raw: 200, display: '200', status: 'neutral' },
-          ],
-          diffs: [null, { direction: 'increase', display: '+100%', favorable: false }],
-        },
-      })
-      // Find the diff section with red styling
-      const diffElements = component.findAll('.text-red-400')
-      expect(diffElements.length).toBeGreaterThan(0)
-    })
-
-    it('does not render diff indicator for same direction', async () => {
-      const component = await mountSuspended(FacetRow, {
-        props: {
-          ...baseProps,
-          values: [
-            { raw: 100, display: '100', status: 'neutral' },
-            { raw: 100, display: '100', status: 'neutral' },
-          ],
-          diffs: [null, { direction: 'same', display: '0%', favorable: undefined }],
-        },
-      })
-      expect(component.find('.i-carbon\\:arrow-up').exists()).toBe(false)
-      expect(component.find('.i-carbon\\:arrow-down').exists()).toBe(false)
-    })
-  })
-
   describe('date values', () => {
     it('renders DateTime component for date type values', async () => {
       const component = await mountSuspended(FacetRow, {