WIP

src/pages/resources/index.astro

@@ -0,0 +1,64 @@
+---
+import Layout from "@layouts/Layout.astro";
+import HeroCard from "@components/HeroCard.astro";
+
+const collection = "resources";
+
+const wiki = {
+  id: "wiki",
+  collection,
+  body: "My knowledge base",
+  data: {
+    title: "Wiki",
+    icon: "🧠",
+  },
+};
+
+const articles = {
+  id: "articles",
+  collection,
+  body: "Articles saved",
+  data: {
+    title: "Articles",
+    icon: "📰",
+  },
+};
+
+const recipes = {
+  id: "recipes",
+  collection,
+  body: "Recipes",
+  data: {
+    title: "Recipes",
+    icon: "🍲",
+  },
+};
+
+const movies = {
+  id: "movies",
+  collection,
+  body: "Movies",
+  data: {
+    title: "Movies",
+    icon: "🎥",
+  },
+};
+
+const series = {
+  id: "series",
+  collection,
+  body: "Series",
+  data: {
+    title: "Series",
+    icon: "📺",
+  },
+};
+---
+
+<Layout title="Max Richter">
+  <HeroCard post={wiki} />
+  <HeroCard post={recipes} />
+  <HeroCard post={articles} />
+  <HeroCard post={movies} />
+  <HeroCard post={series} />
+</Layout>

src/pages/resources/movies/[movieName].astro

@@ -0,0 +1,35 @@
+---
+import Layout from "@layouts/Layout.astro";
+
+export async function getStaticPaths() {
+  const response = await fetch(
+    "http://localhost:8080/resources?name=Media/movies/*",
+  );
+  const movieReviews = await response.json();
+
+  const paths = movieReviews.map((review: any) => {
+    return {
+      params: {
+        movieName: review.identifier
+          .replace("Media/movies/", "")
+          .replace(/\.md$/, ""),
+      },
+    };
+  });
+
+  return paths;
+}
+
+const response = await fetch(
+  //@ts-ignore
+  `http://localhost:8080/resources?name=Media/movies/${Astro.params.movieName}.md`,
+);
+const reviewes = await response.json();
+const review = reviewes[0];
+---
+
+<Layout title="Max Richter">
+  <h1>{review.itemReviewed?.name}</h1>
+  <p>{review.reviewBody}</p>
+  <!-- <pre><code>{JSON.stringify(review, null, 2)}</code></pre> -->
+</Layout>

src/pages/resources/movies/index.astro

@@ -0,0 +1,29 @@
+---
+import Layout from "@layouts/Layout.astro";
+import HeroCard from "@components/HeroCard.astro";
+
+const response = await fetch(
+  "http://localhost:8080/resources?name=Media/movies/*",
+);
+const movieReviews = await response.json();
+---
+
+<Layout title="Max Richter">
+  {
+    movieReviews.map((review: any) => (
+      <HeroCard
+        post={{
+          collection: "resources/movies",
+          id: review.identifier
+            .replace("Media/movies/", "")
+            .replace(/\.md$/, ""),
+          data: {
+            title: review.itemReviewed.name,
+            description: review.reviewBody,
+          },
+          body: review.reviewBody,
+        }}
+      />
+    ))
+  }
+</Layout>

src/pages/resources/recipes/[recipeName].astro

@@ -0,0 +1,66 @@
+---
+import Layout from "@layouts/Layout.astro";
+import { useTranslatedPath } from "@i18n/utils";
+import markdownToText from "@helpers/markdownToText";
+
+const path = useTranslatedPath(Astro.url);
+
+const collection = "resources/recipes";
+
+export async function getStaticPaths() {
+  const response = await fetch(
+    "http://localhost:8080/resources?name=Recipes/*",
+  );
+  const recipes = await response.json();
+
+  const paths = recipes.map((recipe: any) => {
+    return {
+      params: {
+        recipeName: recipe.identifier
+          .replace("Recipes/", "")
+          .replace(/\.md$/, ""),
+      },
+    };
+  });
+
+  return paths;
+}
+
+const response = await fetch(
+  //@ts-ignore
+  `http://localhost:8080/resources?name=Recipes/${Astro.params.recipeName}.md`,
+);
+const recipes = await response.json();
+const recipe = recipes[0];
+---
+
+<Layout title="Max Richter">
+  <div class="top-info flex items-center place-content-between m-y-2">
+    <a class="flex items-center gap-1 opacity-50" href={path("/" + collection)}>
+      <span class="i-tabler-arrow-left"></span> back
+    </a>
+    <div class="date opacity-50">
+      {
+        recipe.date?.toLocaleString("en-US", {
+          month: "long",
+          day: "numeric",
+          year: "numeric",
+        })
+      }
+    </div>
+  </div>
+
+  <h1>{recipe.name}</h1>
+
+  <h3>Ingredients</h3>
+  <ol>
+    {
+      recipe.recipeIngredient?.map((ingredient: any) => (
+        <li>{markdownToText(ingredient)}</li>
+      ))
+    }
+  </ol>
+
+  <h3>Instructions</h3>
+  <p>{recipe.recipeInstructions}</p>
+</Layout>

src/pages/resources/recipes/index.astro

@@ -0,0 +1,23 @@
+---
+import Layout from "@layouts/Layout.astro";
+import HeroCard from "@components/HeroCard.astro";
+
+const response = await fetch("http://localhost:8080/resources?name=Recipes/*");
+const recipes = await response.json();
+---
+
+<Layout title="Max Richter">
+  {
+    recipes.map((recipe: any) => (
+      <HeroCard
+        post={{
+          collection: "resources/recipes",
+          id: recipe.identifier.replace("Recipes/", "").replace(/\.md$/, ""),
+          data: {
+            title: recipe.name,
+          },
+        }}
+      />
+    ))
+  }
+</Layout>

src/pages/resources/series/[seriesName].astro

@@ -0,0 +1,54 @@
+---
+import Layout from "@layouts/Layout.astro";
+import { useTranslatedPath } from "@i18n/utils";
+
+const collection = "resources/series";
+
+const path = useTranslatedPath(Astro.url);
+
+export async function getStaticPaths() {
+  const response = await fetch(
+    "http://localhost:8080/resources?name=Media/series/*",
+  );
+  const seriesReviews = await response.json();
+
+  const paths = seriesReviews.map((review:any) => {
+    return {
+      params: {
+        seriesName: review.identifier
+          .replace("Media/series/", "")
+          .replace(/\.md$/, ""),
+      },
+    };
+  });
+
+  return paths;
+}
+
+const response = await fetch(
+  //@ts-ignore
+  `http://localhost:8080/resources?name=Media/series/${Astro.params.seriesName}.md`,
+);
+const reviewes = response.ok ? await response.json() : [];
+const review = reviewes[0];
+---
+
+<Layout title="Max Richter">
+  <div class="top-info flex items-center place-content-between m-y-2">
+    <a class="flex items-center gap-1 opacity-50" href={path("/" + collection)}>
+      <span class="i-tabler-arrow-left"></span> back
+    </a>
+    <div class="date opacity-50">
+      {
+        review.date?.toLocaleString("en-US", {
+          month: "long",
+          day: "numeric",
+          year: "numeric",
+        })
+      }
+    </div>
+  </div>
+
+  <h1>{review.itemReviewed?.name}</h1>
+  <p>{review.reviewBody}</p>
+</Layout>

src/pages/resources/series/index.astro

@@ -0,0 +1,29 @@
+---
+import Layout from "@layouts/Layout.astro";
+import HeroCard from "@components/HeroCard.astro";
+
+const response = await fetch(
+  "http://localhost:8080/resources?name=Media/series/*",
+);
+const seriesReviewes = await response.json();
+---
+
+<Layout title="Max Richter">
+  {
+    seriesReviewes.map((review: any) => (
+      <HeroCard
+        post={{
+          collection: "resources/series",
+          id: review.identifier
+            .replace("Media/series/", "")
+            .replace(/\.md$/, ""),
+          data: {
+            title: review.itemReviewed.name,
+            description: review.reviewBody,
+          },
+          body: review.reviewBody,
+        }}
+      />
+    ))
+  }
+</Layout>