feat: correctly cache images with redis

2023-07-30 18:27:45 +02:00
parent 1917fc7d8f
commit af8adf9ce7
17 changed files with 321 additions and 121 deletions
--- a/routes/index.tsx
+++ b/routes/index.tsx
@@ -1,6 +1,8 @@
 import { Head } from "$fresh/runtime.ts";
 import { useSignal } from "@preact/signals";
 import Counter from "@islands/Counter.tsx";
+import { MainLayout } from "@components/layouts/main.tsx";
+import { Card } from "@components/Card.tsx";

 export default function Home() {
  const count = useSignal(3);
@@ -9,23 +11,15 @@ export default function Home() {
      <Head>
        <title>app</title>
      </Head>
-      <div class="px-4 py-8 mx-auto bg-[#86efac]">
-        <div class="max-w-screen-md mx-auto flex flex-col items-center justify-center">
-          <img
-            class="my-6"
-            src="/logo.svg"
-            width="128"
-            height="128"
-            alt="the fresh logo: a sliced lemon dripping with juice"
+      <MainLayout>
+        <div class="flex flex-wrap justify-center items-center gap-4 px-4">
+          <Card
+            title="Recipes"
+            image="/api/images?image=Recipes/images/placeholder.jpg&width=200&height=200"
+            link="/recipes"
          />
-          <h1 class="text-4xl font-bold">Welcome to fresh</h1>
-          <p class="my-4">
-            Try updating this message in the
-            <code class="mx-2">./routes/index.tsx</code> file, and refresh.
-          </p>
-          <Counter count={count} />
        </div>
-      </div>
+      </MainLayout>
    </>
  );
 }