Each homepage header should point to a specific sub-place. (#102)

diffplug · Jan 17, 2024 · 764567a · 764567a
2 parents fde9170 + ce883eb
commit 764567a
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 15 deletions.
diff --git a/docs/src/components/HeadingPopout.tsx b/docs/src/components/HeadingPopout.tsx
@@ -4,17 +4,16 @@ import { Button } from "./Button";
 import { Popout } from "./Icons/Popout";
 
 type HeadingPopoutProps = {
-  pathParts: PathParts;
+  destinationUrl: string;
   currentHeading: string;
 };
 
 export function HeadingPopout({
   currentHeading,
-  pathParts,
+  destinationUrl,
 }: HeadingPopoutProps) {
   function handleClick() {
-    window.history.pushState({}, "", `#${currentHeading}`);
-    window.location.href = `/${pathParts.language}/get-started#quickstart`;
+    window.location.href = destinationUrl;
   }
   return (
     <Button

diff --git a/docs/src/components/NavHeading.tsx b/docs/src/components/NavHeading.tsx
@@ -6,15 +6,10 @@ import { Selfie } from "./Selfie";
 
 type NavHeadingProps = {
   text: string;
+  popout: string;
 };
 
-export function NavHeading({ text }: NavHeadingProps) {
-  const router = useRouter();
-  const pathParts = getPathParts(router.pathname);
-  if (!pathParts.language) {
-    pathParts.language = "jvm";
-  }
-
+export function NavHeading({ text, popout }: NavHeadingProps) {
   return (
     <>
       <br />
@@ -24,7 +19,7 @@ export function NavHeading({ text }: NavHeadingProps) {
         </h2>
         <HeadingPopout
           currentHeading={text}
-          pathParts={pathParts}
+          destinationUrl={popout}
         />
       </div>
     </>

diff --git a/docs/src/pages/jvm/index.mdx b/docs/src/pages/jvm/index.mdx
@@ -5,7 +5,7 @@ import { NavHeading } from "@/components/NavHeading";
 
 export const showHero = true;
 
-<NavHeading text="literal" />
+<NavHeading text="literal" popout="/jvm/get-started#quickstart" />
 
 This is a reasonable way to test.
 
@@ -46,7 +46,7 @@ public void primesBelow100() {
 
 And from now on it's a proper assertion, but you didn't have to spend any time writing it. It's not only less work, but also more complete than the usual `.startsWith().endsWith()` rigamarole.
 
-<NavHeading text="like-a-filesystem" />
+<NavHeading text="like-a-filesystem" popout="/jvm/get-started#disk" />
 
 That `primesBelow(100)` snapshot above is almost too long. Something bigger, such as `primesBelow(10_000)` is definitely too big. To handle this, selfie lets you put your snapshots on disk.
 
@@ -87,7 +87,7 @@ Selfie's snapshot files `.ss` are simple to parse, just split them up on `\n╔
 
 You can treat your snapshot files as an output deliverable of your code, and use them as an input to other tooling.
 
-<NavHeading text="lensable" />
+<NavHeading text="lensable" popout="/jvm/advanced" />
 
 A problem with the snapshots we've shown so far is that they are one dimensional. What about headers and cookies? What about the content the user actually sees, without all the markup? What if we could do this?