import NoteSearch from "../notes/NoteSearch";
import NotesList from "../notes/NotesList";
import { useNotesStore } from "../../store/notesStore";
import Button from "../ui/Button";

type SidebarProps = {
  onNoteSelect?: () => void;
};

export default function Sidebar({ onNoteSelect }: SidebarProps) {
  const createNew = useNotesStore((state) => state.createNew);
  const isSaving = useNotesStore((state) => state.isSaving);

  return (
    <div className="flex h-full flex-col">
      <div className="flex items-center justify-between">
        <h2 className="font-display text-2xl text-[var(--ink)]">Memos</h2>
        <Button
          className="bg-[var(--accent)] px-3 py-1 text-xs font-semibold text-white"
          onClick={() => {
            createNew();
            onNoteSelect?.();
          }}
          disabled={isSaving}
        >
          Yeni
        </Button>
      </div>
      <div className="mt-4">
        <NoteSearch />
      </div>
      <NotesList onSelect={onNoteSelect} />
    </div>
  );
}
