diff --git a/app/components/DocsLayout.tsx b/app/components/DocsLayout.tsx
index 35896034a..c6d1929bd 100644
--- a/app/components/DocsLayout.tsx
+++ b/app/components/DocsLayout.tsx
@@ -455,7 +455,7 @@ export function DocsLayout({
   const logo = (
     <DocsLogo
       name={name}
-      linkTo={repo.replace('tanstack/', '')}
+      libraryId={libraryId}
       version={version}
       colorFrom={colorFrom}
       colorTo={colorTo}
diff --git a/app/components/DocsLogo.tsx b/app/components/DocsLogo.tsx
index d490b9d76..d011f4a6a 100644
--- a/app/components/DocsLogo.tsx
+++ b/app/components/DocsLogo.tsx
@@ -3,15 +3,19 @@ import { ThemeToggle } from './ThemeToggle'
 
 type Props = {
   name: string
-  linkTo: string
+  libraryId: string
   version: string
   colorFrom: string
   colorTo: string
 }
 
-export const DocsLogo = (props: Props) => {
-  const { name, version, colorFrom, colorTo } = props
-
+export const DocsLogo = ({
+  name,
+  version,
+  colorFrom,
+  colorTo,
+  libraryId,
+}: Props) => {
   const gradientText = `inline-block text-transparent bg-clip-text bg-gradient-to-r ${colorFrom} ${colorTo}`
 
   return (
@@ -20,9 +24,9 @@ export const DocsLogo = (props: Props) => {
         TanStack
       </Link>
       <Link
-        to={`/${props.linkTo}`}
+        to={`/$libraryId`}
         className="font-bold whitespace-nowrap"
-        params
+        params={{ libraryId }}
       >
         <span className={`${gradientText}`}>{name}</span>{' '}
         <span className="text-sm align-super">{version}</span>