feat: add movies

routes/movies/index.tsx

@@ -4,14 +4,18 @@ import { MainLayout } from "@components/layouts/main.tsx";
 import { Recipe } from "@lib/recipes.ts";
 import { getRecipes } from "../api/recipes/index.ts";
 import IconArrowLeft from "https://deno.land/x/tabler_icons_tsx@0.0.3/tsx/arrow-left.tsx";
-export const handler: Handlers<Recipe[] | null> = {
+import { getMovies } from "../api/movies/index.ts";
+import { Movie } from "@lib/movies.ts";
+import { MovieCard } from "@components/MovieCard.tsx";
+
+export const handler: Handlers<Movie[] | null> = {
   async GET(_, ctx) {
-    const recipes = await getRecipes();
-    return ctx.render(recipes);
+    const movies = await getMovies();
+    return ctx.render(movies);
   },
 };
 
-export default function Greet(props: PageProps<Recipe[] | null>) {
+export default function Greet(props: PageProps<Movie[] | null>) {
   return (
     <MainLayout url={props.url}>
       <header class="flex gap-4 items-center mb-5 md:hidden">
@@ -23,11 +27,11 @@ export default function Greet(props: PageProps<Recipe[] | null>) {
           Back
         </a>
 
-        <h3 class="text-2xl text-white font-light">Recipes</h3>
+        <h3 class="text-2xl text-white font-light">🍿 Movies</h3>
       </header>
       <div class="flex flex-wrap items-center gap-4 px-4">
         {props.data?.map((doc) => {
-          return <RecipeCard recipe={doc} />;
+          return <MovieCard movie={doc} />;
         })}
       </div>
     </MainLayout>