diff --git a/examples/linearlite/src/pages/List/IssueRow.tsx b/examples/linearlite/src/pages/List/IssueRow.tsx
index 05d5f45b53..b840261dc9 100644
--- a/examples/linearlite/src/pages/List/IssueRow.tsx
+++ b/examples/linearlite/src/pages/List/IssueRow.tsx
@@ -8,7 +8,7 @@ import PriorityIcon from '../../components/PriorityIcon'
 import StatusIcon from '../../components/StatusIcon'
 import Avatar from '../../components/Avatar'
 import { memo } from 'react'
-import { useNavigate } from 'react-router-dom'
+import { Link } from 'react-router-dom'
 import { formatDate } from '../../utils/date'
 import { Issue } from '../../types/types'
 
@@ -19,7 +19,6 @@ interface Props {
 
 function IssueRow({ issue, style }: Props) {
   const pg = usePGlite()
-  const navigate = useNavigate()
 
   const handleChangeStatus = (status: string) => {
     pg.sql`
@@ -49,11 +48,11 @@ function IssueRow({ issue, style }: Props) {
   }
 
   return (
-    <div
+    <Link
       key={issue.id}
+      to={`/issue/${issue.id}`}
       className="flex items-center flex-grow w-full min-w-0 pl-2 pr-8 text-sm border-b border-gray-100 hover:bg-gray-100 shrink-0"
       id={issue.id}
-      onClick={() => navigate(`/issue/${issue.id}`)}
       style={style}
     >
       <div className="flex-shrink-0 ml-4">
@@ -86,7 +85,7 @@ function IssueRow({ issue, style }: Props) {
           <UnsyncedIcon className="text-orange-500 w-4 h-4" />
         )}
       </div>
-    </div>
+    </Link>
   )
 }