Sonarist project

Sonarist / Design system

Documentation v1.0.0 · Work in progress · UI prototype with separate server foundations

Design system contents

Patterns

Start a new conversation

Compose intentional outreach while allowing a one-off address without silently creating a saved contact.

On this page

User goal

Compose intentional outreach while allowing a one-off address without silently creating a saved contact.

Workflow

Workflow
StepExpected behavior
1Open New message from the global header.
2Confirm the source inbox and choose known recipients or enter a valid custom address.
3Add copies only where appropriate.
4Write a useful subject and complete body.
5Select work type and assigned owner.
6Use Send to create a local waiting conversation; unknown recipient receives a contactSnapshot.

Decision and composition rules

  • Known contact IDs are reused.
  • One-off recipient snapshots are not automatically added to People.
  • New Sales threads use Contacted stage.

Edge cases and recovery

  • Blank subject/body or no recipient blocks sending.
  • Source sample defaults should not be treated as a recommended production preset.
  • The local attachment is fixed metadata.
  • Route changes or reload can lose the draft.

Persistence boundary

The demonstrated frontend uses local React state or static fixtures. Read the readiness topic before connecting these actions to authenticated persistence. A visible toast, badge or timer is not a server acknowledgement.

Source references

Source references
FileResponsibility
components/inbox/new-message-view.tsxNewMessageView and snapshot creation
components/helpdesk-app.tsxLocal new conversation callback

Examples from the app

Actual Sonarist components with fictional conversations, people, example.com addresses and simulated operational states. Captured at 2× resolution or higher. Select an image to inspect it full size.

New Message · Screen · Light · Desktop · 2880 × 2000 px
New Message · Screen · Light · Desktop · Draft With Attachment · 2880 × 2000 px

Source audit: 2026-10-08 · Revision 10f45d1377b5 · Documentation v1.0.0