import { AutoSaveTextarea } from "@/components/AutoSaveTextarea";
import { useDocumentCache } from "@/context/document/hooks";
import { pb } from "@/lib/pocketbase";
import type { Session } from "@/lib/types";

export const SessionEditForm = ({ session }: { session: Session }) => {
  const { dispatch } = useDocumentCache();

  async function saveStrongStart(strongStart: string) {
    const doc: Session = await pb.collection("documents").update(session.id, {
      data: {
        ...session.data,
        strongStart,
      },
    });
    dispatch({
      type: "setDocument",
      doc,
    });
  }

  return (
    <form>
      <h3 className="text-lg font-bold mb-4 text-slate-100">Strong Start</h3>
      <AutoSaveTextarea
        value={session.data.strongStart}
        onSave={saveStrongStart}
        placeholder="Enter a strong start for this session..."
        aria-label="Strong Start"
      />
    </form>
  );
};
