From 3a9c4da429ce05b320c3c6b63dd3b802d487eac7 Mon Sep 17 00:00:00 2001
From: Jewgeni Lewash <j.lewash@gmail.com>
Date: Tue, 5 Mar 2024 15:59:55 +0100
Subject: [PATCH] feat(directus): use directus cms

---
 .astro/types.d.ts       | 14 ++++++++++++++
 src/lib/directus.ts     |  2 +-
 src/pages/recipes.astro | 32 ++++++++++++++++++++++++++++++++
 3 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/recipes.astro

diff --git a/.astro/types.d.ts b/.astro/types.d.ts
index c134edb..704bc1b 100644
--- a/.astro/types.d.ts
+++ b/.astro/types.d.ts
@@ -143,6 +143,20 @@ declare module 'astro:content' {
   collection: "blog";
   data: InferEntrySchema<"blog">
 } & { render(): Render[".mdx"] };
+"comparing-mvc-frameworks.mdx": {
+	id: "comparing-mvc-frameworks.mdx";
+  slug: "comparing-mvc-frameworks";
+  body: string;
+  collection: "blog";
+  data: InferEntrySchema<"blog">
+} & { render(): Render[".mdx"] };
+"dockerizing-front-end-development.mdx": {
+	id: "dockerizing-front-end-development.mdx";
+  slug: "dockerizing-front-end-development";
+  body: string;
+  collection: "blog";
+  data: InferEntrySchema<"blog">
+} & { render(): Render[".mdx"] };
 "essential-frontend-tools-for-astro-js-developers.mdx": {
 	id: "essential-frontend-tools-for-astro-js-developers.mdx";
   slug: "essential-frontend-tools-for-astro-js-developers";
diff --git a/src/lib/directus.ts b/src/lib/directus.ts
index b0679b0..b9d2700 100644
--- a/src/lib/directus.ts
+++ b/src/lib/directus.ts
@@ -10,7 +10,7 @@ type Recipe = {
 };
 
 type Schema = {
-	recipes: Recipe[];
+	Recipe: Recipe[];
 };
 
 const directus = createDirectus<Schema>(DIRECTUS_URL).with(rest());
diff --git a/src/pages/recipes.astro b/src/pages/recipes.astro
new file mode 100644
index 0000000..1bf1012
--- /dev/null
+++ b/src/pages/recipes.astro
@@ -0,0 +1,32 @@
+---
+import directus from '@/lib/directus.ts';
+import { readItems } from '@directus/sdk';
+
+const DIRECTUS_URL = process.env.DIRECTUS_URL || 'https://directus.astro.deployn.de';
+
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Heading from '@/components/ui/Heading.astro';
+
+const recipes = await directus.request(
+	readItems('Recipe', {
+		fields: ['name', 'description', 'image'],
+		sort: ['name'],
+	})
+);
+---
+
+<BaseLayout title="Recipes">
+	<Heading level={1}>Recipes</Heading>
+	<p>Here are some of my favorite recipes.</p>
+	<ul>
+		{
+			recipes.map((recipe) => (
+				<li>
+					<h2 class="mt-4 text-xl">{recipe.name}</h2>
+					<p>{recipe.description}</p>
+					<img src={`${DIRECTUS_URL}/assets/${recipe.image}?width=250`} alt={recipe.name} />
+				</li>
+			))
+		}
+	</ul>
+</BaseLayout>