fix(#83): side nav links (#84)

remix-run · Mar 10, 2024 · 314325c · 314325c
1 parent 4b2bee1
commit 314325c
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/app/components/doc-route.tsx b/app/components/doc-route.tsx
@@ -20,6 +20,7 @@ import { useDelegatedReactRouterLinks } from "./delegate-markdown-links";
 import iconsHref from "~/icons.svg";
 import { type loader as rootLoader } from "~/root";
 import { type loader as langRefLoader } from "~/routes/$lang.$ref";
+import { Link } from "react-router-dom";
 
 export let loader = async ({ params, request }: LoaderFunctionArgs) => {
   await whyDoWeNotHaveGoodMiddleWareYetRyan(request);
@@ -131,8 +132,8 @@ function LargeOnThisPage({ doc }: { doc: SerializeFrom<Doc> }) {
       <ul>
         {doc.headings.map((heading, i) => (
           <li key={i}>
-            <a
-              href={`#${heading.slug}`}
+            <Link
+              to={`#${heading.slug}`}
               dangerouslySetInnerHTML={{ __html: heading.html || "" }}
               className="block py-1 text-sm text-gray-400 hover:text-gray-900 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50 dark:active:text-red-brand"
             />
@@ -160,8 +161,8 @@ function SmallOnThisPage({ doc }: { doc: SerializeFrom<Doc> }) {
       <ul className="pl-9">
         {doc.headings.map((heading, i) => (
           <li key={i}>
-            <a
-              href={`#${heading.slug}`}
+            <Link
+              to={`#${heading.slug}`}
               dangerouslySetInnerHTML={{ __html: heading.html || "" }}
               className="block py-2 text-sm text-gray-400 hover:text-gray-900 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50 dark:active:text-red-brand"
             />