✨ Add top page link

wancup · Nov 23, 2024 · 174944f · 174944f
1 parent d2fe9f6
commit 174944f
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 3 deletions.
diff --git a/src/features/app-shell/components/global-header.tsx b/src/features/app-shell/components/global-header.tsx
@@ -1,11 +1,12 @@
 import { css } from "$panda/css";
 import { IconButton } from "$park/icon-button";
+import { A } from "@solidjs/router";
 import { MenuIcon } from "lucide-solid";
 import { type JSX, type Setter } from "solid-js";
 import darkLogo from "~/assets/images/wanTooLs_dark.svg";
 import lightLogo from "~/assets/images/wanTooLs_light.svg";
 import { ColorThemeSwitcher, useCurrentThemeColor } from "~/features/color-theme";
-import { SITE } from "~/site";
+import { PAGES, SITE } from "~/site";
 import { GitHubLink } from "./github-link";
 
 interface GlobalHeaderProps {
@@ -37,7 +38,16 @@ export function GlobalHeader(props: GlobalHeaderProps): JSX.Element {
           <MenuIcon class={css({ height: "var(--root-header-icon-size)", width: "var(--root-header-icon-size)" })} />
         </IconButton>
       </div>
-      <img alt={SITE.name} src={logoSrc()} class={css({ width: "10rem" })} />
+      <IconButton
+        variant="ghost"
+        asChild={(props) => {
+          return (
+            <A {...props} href={PAGES["/"].path}>
+              <img alt={SITE.name} src={logoSrc()} class={css({ width: "10rem" })} />
+            </A>
+          );
+        }}
+      />
       <div class={css({ display: "flex", columnGap: "4px" })}>
         <ColorThemeSwitcher />
         <GitHubLink />

diff --git a/src/features/app-shell/components/sidebar-content.tsx b/src/features/app-shell/components/sidebar-content.tsx
@@ -3,12 +3,14 @@ import { A } from "@solidjs/router";
 import { For, type JSX } from "solid-js";
 import { PAGES } from "~/site";
 
+const LINK_LIST = Object.values(PAGES).filter(p => !(Object.hasOwn(p, "hideOnSideBar")));
+
 export function SidebarContent(): JSX.Element {
   return (
     <aside>
       <nav>
         <ul class={css({ listStyle: "none", paddingLeft: 0 })}>
-          <For each={Object.values(PAGES)}>
+          <For each={LINK_LIST}>
             {(page) => {
               return (
                 <li>

diff --git a/src/site/pages.ts b/src/site/pages.ts
@@ -2,10 +2,16 @@ interface Pages {
   [page: string]: {
     name: string;
     path: string;
+    hideOnSideBar?: true;
   };
 }
 
 export const PAGES = {
+  "/": {
+    name: "Top Page",
+    path: "/",
+    hideOnSideBar: true,
+  },
   "directory-tree": {
     name: "Directory Tree",
     path: "/directory-tree",