Makes session row and form components

src/components/documents/session/SessionForm.tsx

@@ -0,0 +1,22 @@
+import { AutoSaveTextarea } from "@/components/AutoSaveTextarea";
+import type { Session } from "@/lib/types";
+
+export const SessionForm = ({
+  session,
+  onSubmit,
+}: {
+  session: Session;
+  onSubmit: (data: Session["data"]) => Promise<void>;
+}) => {
+  return (
+    <form>
+      <h3 className="text-lg font-bold mb-4 text-slate-100">Strong Start</h3>
+      <AutoSaveTextarea
+        value={session.data.session.strongStart}
+        onSave={(value) => onSubmit({ session: { strongStart: value } })}
+        placeholder="Enter a strong start for this session..."
+        aria-label="Strong Start"
+      />
+    </form>
+  );
+};

src/components/documents/session/SessionRow.tsx

@@ -0,0 +1,17 @@
+import type { Session } from "@/lib/types";
+import { Link } from "@tanstack/react-router";
+
+export const SessionRow = ({ session }: { session: Session }) => {
+  return (
+    <div>
+      <Link
+        to="/document/$documentId"
+        params={{ documentId: session.id }}
+        className="block font-semibold text-lg text-slate-300"
+      >
+        {session.created}
+      </Link>
+      <div className="">{session.data.session.strongStart}</div>
+    </div>
+  );
+};