import { Handlers, PageProps } from "$fresh/server.ts";
import { getNote } from "@/db/mod.ts";
import { Page } from "@/components/Page.tsx";
import { type Note } from "@/types.ts";

export const handler: Handlers<Note> = {
  async GET(request, context) {
    console.debug({ request, context });
    const note = await getNote(context.params.id);
    if (!note) throw "unable to fetch from database";
    return await context.render(note);
  },
};

export default function NotesPage(
  { data: { id, createdAt, content } }: PageProps<Note>,
) {
  return (
    <Page>
      <a href="/note">Back to notes</a>
      <h1>Note {id} created at {createdAt.toLocaleString()}</h1>
      <div class="my-4" key={id}>
        <blockquote class="mt-2 pl-4 border-l(solid 4)">
          <pre>{content}</pre>
        </blockquote>
      </div>
    </Page>
  );
}