Note dialog

The note's own detail — the one place a note is written, read and extended with voice. A document-class form-less dialog (formless-dialog, shape A): no primary button, text autosaves while typing, and the header shows the save state. Code: apps/web/src/components/notes/NoteDialog.tsx (shell, autosave), NoteMetaRow.tsx (links), NoteDictation.tsx + use-dictation.ts (Dictate), NoteAudio.tsx (Add audio, recordings), ds/note-dialog.css.

Voice was approved by the product owner on 16–17 September 2026 (prototype proto/poznamka-audio, :3777/preview/poznamka-audio-diktat.html) as two gestures, not one menu:

  • Dictate — voice becomes text; the audio is thrown away (acrm !3807, !3808).
  • Add audio — a file or a Plaud recording stays attached to the note: player and transcript below the text, and the AI summary is written into the note body when it is ready (acrm !3891 and follow-ups, migrations 0414/0415). Recordings that used to hang on a project became notes linked to the project.

When to use

  • Writing, reading or editing any note — from a person, company, deal or project card, the Notes tab, the timeline or a permalink. There is no second note editor.
  • Capturing a spoken thought quickly (Dictate) or keeping a meeting recording with its summary next to the notes about it (Add audio).

When not to use

  • A meeting recording that belongs to a calendar meeting — it goes to the meeting (minutes, speakers, dialogue view), not to a note.
  • A quick one-line note on a card — the inline composer (note-card family) writes it without a window; the dialog opens only when the note grows.
  • A form that must be confirmed with a primary button — that is the commit class of the dialog, not a document.

Anatomy

  • Shell — flexi <Dialog size="l"> with the document body (bodyClass="doc"); window states (compact, minimised to the dock) are owned by the host, like the mail compose window.
  • Header — lead entity (LeadEntity: the record the note hangs on) and the save state icon (Ukládá se · Uloženo · Chyba · Konflikt). No actions in the header.
  • Title — auto-growing textarea.fl-title.
  • Chip row .flc.nd-meta — in this order:
  • author (locked MetaChip), only on someone else's note;
  • links (NoteMetaRow: people, companies, deals, projects — many of each);
  • Diktovat (NoteRecChip): one canonical .tk-chip that widens while recording into the live bar — red dot, clock, level meter .nd-level, pause/resume and Hotovo — přepsat. The text is appended to the end of the body as a new paragraph.
  • Přidat audio (NoteAudioMenu, icon upload): without Plaud configured it opens the file picker straight away; with Plaud it opens a menu Nahrát soubor · Z Plaudu (the Plaud picker is the meeting's PlaudPickerDialog in pick-only mode). Hidden on someone else's note.
  • Body — the note editor (Markdown: headings, lists, quote, code); an existing note opens in reading mode and a click switches to editing.
  • Recordings .nd-audio — below the body, separated by a hairline, only when the note has a recording or one is being added. Each item reuses the recording row of the project detail 1:1: .prj-rec (microphone, name, muted meta m:ss · Soubor|Plaud · stage, remove IconButton x), <audio class="prj-rec-audio" controls> shown as soon as the file is stored, transcript collapsed in details.prj-rec-fold once done. Stages: Nahrávám… · Přepisuji… · Shrnuji… · Přepis se nepovedl · Souhrn se nepovedl.
  • Summary — not shown in the recording block: it becomes the note text (## Souhrn nahrávky, purpose, summary, Témata, Rozhodnutí, Otevřené otázky). The server writes it once, in the same transaction as the done state; an open dialog merges it into what is being typed. Tasks from the recording go to task suggestions, personal to the note's author.
  • Footer — + menu (block types) on the left, kebab ⋮ (Smazat) on the right; no primary button.

Best practices

Do

  • Let a new note be created by the first gesture that needs it: typing, a link, or adding audio (an empty new note is saved with the file name as its title).
  • Keep both voice gestures in the chip row — content input sits next to the properties, the footer carries only actions on the document.
  • Reuse the recording row, player and transcript fold as they are; the note does not get its own visual language for a recording.
  • Poll the recording list only while something is processing; don't ask the server about Plaud or recordings until the user shows intent.

Don't

  • Don't put the summary in a second panel next to the text — it is the text.
  • Don't write the summary again after regenerating it; the user may have edited the first one.
  • Don't let dictated text replace what was typed; it is always appended.
  • Don't offer Add audio or remove on someone else's note — it is read there.

Content

  • Chip labels: Diktovat, Přidat audio; menu items Nahrát soubor, Z Plaudu.
  • Confirmation before removing a recording: Odebrat nahrávku? Souhrn v textu poznámky zůstane.
  • Errors are toasts in one sentence (Nahrávku se nepodařilo nahrát.); dictation that heard nothing says Nerozuměl jsem — zkuste to prosím znovu. and inserts nothing.
  • No explanatory text inside the dialog.
  • formless-dialog — the shape and the chip row.
  • dialog — shell, window states, dock.
  • note-card — the card and the inline composer that open this dialog.
  • entity-reference — the lead entity and link chips.

Source: docs/dialog/note-dialog.usage.md · GitLab