Log sheet

"use client";
import * as React from "react";
import { LogSheet } from "@/components/ui/notchset/blocks/log-sheet";
import { Button } from "@/components/ui/notchset/button";
import { notify, Toaster } from "@/components/ui/notchset/toast";

export default function LogSheetDemo() {
  const [open, setOpen] = React.useState(false);
  const [today, setToday] = React.useState([{ time: "07:40", text: "30 min walk" }]);
  return (
    <div>
      <Button variant="primary" onClick={() => setOpen(true)}>
        Log a reading
      </Button>
      <LogSheet
        open={open}
        onOpenChange={setOpen}
        today={today}
        onLog={async (entry) => {
          setToday((t) => [...t, { time: entry.time, text: entry.text }]);
          notify({ title: "Logged", detail: `${entry.text} · ${entry.time}`, action: { label: "Undo", onClick: () => setToday((t) => t.slice(0, -1)) } });
        }}
      />
      <Toaster />
    </div>
  );
}