import { PalmistryResultPage } from "@/components/domains/palmistry";
import { Typography } from "@/components/ui";
import { loadPalms } from "@/entities/dashboard/loaders";
import { startGeneration } from "@/entities/generations/api";

import styles from "./page.module.scss";

export default async function PalmistryResult({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  const actions = await loadPalms();
  const action = actions?.find(action => action._id === id) ?? null;
  const result = await startGeneration({
    actionType: "palm",
    actionId: id,
  });

  return (
    <>
      <Typography as="h1" size="xl" weight="semiBold" className={styles.title}>
        {action?.title}
      </Typography>
      <PalmistryResultPage id={result?.id} />
    </>
  );
}
