feat: configurable header component

Signed-off-by: João Augusto Costa Branco Marado Torres <torres.dev@disroot.org>

5 files changed, 60 insertions, 39 deletions

diff --git a/src/components/Header.astro b/src/components/Header.astro
index 874a496..28ab542 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -1,41 +1,26 @@
 ---
 import HeaderLink from "./HeaderLink.astro";
+import Search from "./Search.astro";
+
+export interface Props {
+  showSearch?: boolean;
+  showNav?: boolean;
+}
+
+const { showSearch, showNav } = Astro.props;
 ---
 
 <header>
   <h1>&lt;<a href="/">cravodeabril.pt</a>&gt;</h1>
-  <search>
-    <form
-      action="https://www.google.com/search"
-      target="_blank"
-      rel="external noreferrer search"
-      role="search"
-      autocomplete="on"
-      name="search"
-    >
-      <p>
-        <label>Barra de pesquisa: <input
-            name="q"
-            type="search"
-            placeholder={`site:${Astro.site} consulta de pesquisa`}
-            value={`site:${Astro.site} `}
-            required
-            title={`"site:${Astro.site} " é usado para que os resultados da pesquisa fiquem restritos a este website`}
-            pattern={`site:${Astro.site} .+`}
-            size={`site:${Astro.site} .+`.length}
-          /></label>
-      </p>
-      <p><button type="submit">Pesquisar</button></p>
-      <p>
-        <small>Esta pesquisa é efectuada pelo Google e utiliza software
-          proprietário.</small>
-      </p>
-    </form>
-  </search>
-  <nav>
-    <ul>
-      <li><HeaderLink href="/blog">Publicações</HeaderLink></li>
-      <li><HeaderLink href="/blog/keywords">Palavras-Chave</HeaderLink></li>
-    </ul>
-  </nav>
+  {showSearch && <Search />}
+  {
+    showNav && (
+      <nav>
+        <ul>
+          <li><HeaderLink href="/blog">Publicações</HeaderLink></li>
+          <li><HeaderLink href="/blog/keywords">Palavras-Chave</HeaderLink></li>
+        </ul>
+      </nav>
+    )
+  }
 </header>
diff --git a/src/components/Search.astro b/src/components/Search.astro
new file mode 100644
index 0000000..5ca4569
--- /dev/null
+++ b/src/components/Search.astro
@@ -0,0 +1,32 @@
+---
+
+---
+
+<search>
+  <form
+    action="https://www.google.com/search"
+    target="_blank"
+    rel="external noreferrer search"
+    role="search"
+    autocomplete="on"
+    name="search"
+  >
+    <p>
+      <label>Barra de pesquisa: <input
+          name="q"
+          type="search"
+          placeholder={`site:${Astro.site} consulta de pesquisa`}
+          value={`site:${Astro.site} `}
+          required
+          title={`"site:${Astro.site} " é usado para que os resultados da pesquisa fiquem restritos a este website`}
+          pattern={`site:${Astro.site} .+`}
+          size={`site:${Astro.site} .+`.length}
+        /></label>
+    </p>
+    <p><button type="submit">Pesquisar</button></p>
+    <p>
+      <small>Esta pesquisa é efectuada pelo Google e utiliza software
+        proprietário.</small>
+    </p>
+  </form>
+</search>
diff --git a/src/components/signature/Commit.astro b/src/components/signature/Commit.astro
index 9cc997a..a2138ab 100644
--- a/src/components/signature/Commit.astro
+++ b/src/components/signature/Commit.astro
@@ -6,8 +6,7 @@ import { toIso8601Full } from "@utils/datetime";
 type Props = { commit: Commit; lang: string };
 
 const dir = await gitDir();
-const { hash, files, author, committer, signature } =
-  Astro.props.commit;
+const { hash, files, author, committer, signature } = Astro.props.commit;
 
 const formatter = new Intl.DateTimeFormat([Astro.props.lang], {
   dateStyle: "short",
diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro
index 60a9d4f..d80d6a8 100644
--- a/src/layouts/Base.astro
+++ b/src/layouts/Base.astro
@@ -1,7 +1,12 @@
 ---
-import BaseHead, { type Props } from "@components/BaseHead.astro";
+import BaseHead, {
+  type Props as HeadProps,
+} from "@components/BaseHead.astro";
+import { type Props as HeaderProps } from "@components/Header.astro";
 import Footer from "@components/Footer.astro";
 import Header from "@components/Header.astro";
+
+interface Props extends HeadProps, HeaderProps {}
 ---
 
 <!DOCTYPE html>
@@ -27,7 +32,7 @@ import Header from "@components/Header.astro";
     <BaseHead {...Astro.props} />
   </head>
   <body>
-    <Header />
+    <Header {...Astro.props} />
     <slot />
     <Footer />
     <noscript>I see, a man of culture :)</noscript>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index e1e97ef..eea5205 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,7 +3,7 @@ import Base from "@layouts/Base.astro";
 import { SITE_TITLE } from "src/consts";
 ---
 
-<Base title={SITE_TITLE}>
+<Base title={SITE_TITLE} showSearch={true} showNav={true}>
   <main>
     <article>
       <h2>Viva abril!</h2>