feat: update some shit

routes/movies/[name].tsx

@@ -1,12 +1,13 @@
-import { Handlers, PageProps, RouteContext } from "$fresh/server.ts";
+import { PageProps, RouteContext } from "$fresh/server.ts";
 import { MainLayout } from "@components/layouts/main.tsx";
 import { getMovie, Movie } from "@lib/resource/movies.ts";
-import { RecipeHero } from "@components/RecipeHero.tsx";
 import { HashTags } from "@components/HashTags.tsx";
 import { renderMarkdown } from "@lib/documents.ts";
 import { KMenu } from "@islands/KMenu.tsx";
 import { RedirectSearchHandler } from "@islands/Search.tsx";
 import { Recommendations } from "@islands/Recommendations.tsx";
+import PageHero from "@components/PageHero.tsx";
+import { Star } from "@components/Stars.tsx";
 
 export default async function Greet(
   props: PageProps<{ movie: Movie; session: Record<string, string> }>,
@@ -23,19 +24,33 @@ export default async function Greet(
     <MainLayout url={props.url} title={`Movie > ${movie.name}`} context={movie}>
       <RedirectSearchHandler />
       <KMenu type="main" context={movie} />
-      <RecipeHero
-        data={movie}
-        subline={[
-          author && {
-            title: author,
-            href: `/?q=${encodeURIComponent(author)}`,
-          },
-          date.toString(),
-        ]}
-        editLink={session
-          ? `https://notes.max-richter.dev/Media/movies/${movie.id}`
-          : ""}
-        backlink="/movies"
+      <PageHero image={movie.meta.image} thumbnail={movie.meta.thumbnail}>
+        <PageHero.Header>
+          <PageHero.BackLink href="/movies" />
+          {session && (
+            <PageHero.EditLink
+              href={`https://notes.max-richter.dev/Media/movies/${movie.id}`}
+            />
+          )}
+        </PageHero.Header>
+        <PageHero.Footer>
+          <PageHero.Title>{movie.name}</PageHero.Title>
+          <PageHero.Subline
+            entries={[
+              author && {
+                title: author,
+                href: `/?q=${encodeURIComponent(author)}`,
+              },
+              date.toString(),
+            ]}
+          >
+            {movie.meta.rating && <Star rating={movie.meta.rating} />}
+          </PageHero.Subline>
+        </PageHero.Footer>
+      </PageHero>
+      <Recommendations
+        id={movie.id}
+        type="movie"
       />
       {movie.tags.length > 0 && (
         <>
@@ -53,8 +68,6 @@ export default async function Greet(
         >
           {content}
         </pre>
-
-        <Recommendations id={movie.id} type="movie"></Recommendations>
       </div>
     </MainLayout>
   );