---
import Layout from "@layouts/Layout.astro";
import Main from "@layouts/Main.astro";
import Header from "@components/Header.astro";
import Footer from "@components/Footer.astro";
import Search from "@components/Search";
import type { Frontmatter } from "@utils/types";

localStorage.setItem("myCat", "Tom");

// Retrieve all articles
const posts = await Astro.glob<Frontmatter>("../contents/*.md");

// List of items to search in
const searchList = posts.map(({ frontmatter }) => ({
  title: frontmatter.title,
  description: frontmatter.description,
  frontmatter,
  slug: frontmatter.slug,
}));
---

<Layout title={`Search | ${import.meta.env.PUBLIC_SITE_TITLE}`}>
  <Header activeNav="search" />
  <Main pageTitle="Search" pageDesc="Search any article ...">
    <Search client:load searchList={searchList} />
  </Main>
  <Footer />
</Layout>