Finish renderer editing

Keep selection, form input, and unsaved state in the renderer. Only privileged persistence crosses the bridge.

Create a new note with a browser-generated ID:

function createNote() {
  const note = {
    id: crypto.randomUUID(),
    title: 'Untitled',
    body: ''
  }

  notes.unshift(note)
  selectedId = note.id
  renderNotes()
  showSelectedNote()
}

When the form submits, copy the current values into the selected note. Then await the save:

async function save() {
  status.textContent = 'Saving…'

  try {
    const result = await window.notesAPI.saveNotes(notes)
    status.textContent = `Saved ${result.saved} notes`
  } catch {
    status.textContent = 'Could not save notes'
  }
}

Do not clear the editor on failure. The unsaved note must remain visible so the user can retry or copy it.

For deletion, remove only the selected ID, select the next available note, render, and save again.

Connect window.notesAPI.onNewNote(createNote) too. A native menu will call that renderer action later.

Think through overlapping saves. Disable the Save button while one write is pending, or serialize writes so an older slow request cannot finish after a newer one and overwrite it.

Exercise the failure path by temporarily making the main handler throw. Confirm the status changes, the note remains editable, and no success message appears before the promise resolves.