wip

fix: pass reactive getter to usePackage for version reactivity on client-side navigation

Author: taskylizard

app/components/diff/ViewerPanel.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { FileDiffResponse, FileChange, DiffHunk } from '#shared/types'
 import { createDiff, insertSkipBlocks, countDiffStats } from '#shared/utils/diff'
-// @ts-expect-error: (tasky): idk why this is type-erroring even if it has types? /shrug
 import { motion } from 'motion-v'
 
 const props = defineProps<{

app/pages/diff/[...path].vue

@@ -111,8 +111,12 @@ const toVersionUrlPattern = computed(() => {
 
 function packageRoute(ver?: string | null) {
   const segments = packageName.value.split('/')
-  if (ver) segments.push('v', ver)
-  return { name: 'package' as const, params: { package: segments } }
+  const org = segments.length > 1 ? segments[0] : undefined
+  const name = segments.length > 1 ? segments[1]! : segments[0]!
+  if (ver) {
+    return { name: 'package-version' as const, params: { org, name, version: ver } }
+  }
+  return { name: 'package' as const, params: { org, name } }
 }
 
 useSeoMeta({

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

@@ -142,7 +142,7 @@ const {
   data: pkg,
   status,
   error,
-} = usePackage(packageName, resolvedVersion.value ?? requestedVersion.value)
+} = usePackage(packageName, () => resolvedVersion.value ?? requestedVersion.value)
 const displayVersion = computed(() => pkg.value?.requestedVersion ?? null)
 
 // Process package description