relative links

solidjs · Mar 11, 2024 · 9024468 · 9024468
1 parent cb17923
commit 9024468
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 20 deletions.
diff --git a/src/components/comment.tsx b/src/components/comment.tsx
@@ -1,4 +1,5 @@
 import { createSignal, For, Show } from "solid-js";
+import { A } from "@solidjs/router";
 import type { CommentDefinition } from "../types";
 
 const pluralize = (n: number) => n + (n === 1 ? " reply" : " replies");
@@ -9,7 +10,7 @@ export default function Comment(props: { comment: CommentDefinition }) {
   return (
     <li class="comment">
       <div class="by">
-        <a href={`/users/${props.comment.user}`}>{props.comment.user}</a>{" "}
+        <A href={`/users/${props.comment.user}`}>{props.comment.user}</A>{" "}
         {props.comment.time_ago} ago
       </div>
       <div class="text" innerHTML={props.comment.content} />

diff --git a/src/components/nav.tsx b/src/components/nav.tsx
@@ -1,30 +1,32 @@
+import { A } from "@solidjs/router";
+
 export default function Nav() {
   return (
     <header class="header" $ServerOnly>
       <nav class="inner">
-        <a href="/">
+        <A href="/">
           <strong>HN</strong>
-        </a>
-        <a href="/new">
+        </A>
+        <A href="/new">
           <strong>New</strong>
-        </a>
-        <a href="/show">
+        </A>
+        <A href="/show">
           <strong>Show</strong>
-        </a>
-        <a href="/ask">
+        </A>
+        <A href="/ask">
           <strong>Ask</strong>
-        </a>
-        <a href="/job">
+        </A>
+        <A href="/job">
           <strong>Jobs</strong>
-        </a>
-        <a
+        </A>
+        <A
           class="github"
           href="https://github.com/solidjs/solid"
           target="_blank"
           rel="noreferrer"
         >
           Built with Solid
-        </a>
+        </A>
       </nav>
     </header>
   );

diff --git a/src/routes/[...stories].tsx b/src/routes/[...stories].tsx
@@ -1,5 +1,6 @@
 import {
   createAsync,
+  A,
   type RouteDefinition,
   cache,
   type RouteSectionProps,
@@ -48,13 +49,13 @@ export default function Stories(props: RouteSectionProps) {
             </span>
           }
         >
-          <a
+          <A
             class="page-link"
             href={`/${type()}?page=${page() - 1}`}
             aria-label="Previous Page"
           >
             {"<"} prev
-          </a>
+          </A>
         </Show>
         <span>page {page()}</span>
         <Show
@@ -65,13 +66,13 @@ export default function Stories(props: RouteSectionProps) {
             </span>
           }
         >
-          <a
+          <A
             class="page-link"
             href={`/${type()}?page=${page() + 1}`}
             aria-label="Next Page"
           >
             more {">"}
-          </a>
+          </A>
         </Show>
       </div>
       <main class="news-list">

diff --git a/src/routes/stories/[id].tsx b/src/routes/stories/[id].tsx
@@ -1,6 +1,7 @@
 import {
   cache,
   createAsync,
+  A,
   type RouteDefinition,
   type RouteSectionProps,
 } from "@solidjs/router";
@@ -25,15 +26,15 @@ export default function Story(props: RouteSectionProps) {
     <Show when={story()}>
       <div class="item-view">
         <div class="item-view-header">
-          <a href={story()!.url} target="_blank">
+          <A href={story()!.url} target="_blank">
             <h1>{story()!.title}</h1>
-          </a>
+          </A>
           <Show when={story()!.domain}>
             <span class="host">({story()!.domain})</span>
           </Show>
           <p class="meta">
             {story()!.points} points | by{" "}
-            <a href={`/users/${story()!.user}`}>{story()!.user}</a>{" "}
+            <A href={`/users/${story()!.user}`}>{story()!.user}</A>{" "}
             {story()!.time_ago} ago
           </p>
         </div>