Tour of the app
Every sidebar menu and header tool in one page, with its keyboard key and what it is for.
Try it in the demo. The demo is the real UI with sample data.
SendMock's screen has three parts: the sidebar on the left (where you go), the header at the top (tools that work everywhere), and the page. Most pages are a list with a detail beside it, like a mail client; on a phone the list and detail stack.
The sidebar
Press G and then the key in the table to jump to a menu from anywhere.
| Menu | Key | What it is for | Page |
|---|---|---|---|
| Overview | G O | the home dashboard: counts, activity, webhook health, recent failures and how to connect | Overview |
| Mail > Inbox | G M | every email your app sent, and the replies you simulate | |
| Mail > Providers | the email APIs SendMock answers (SendGrid, Mailgun, ..., your own) | Providers | |
| SMS > Messages | G S | every SMS and WhatsApp message, as conversations | SMS |
| SMS > Verify | G V | Twilio Verify codes, with their expiry and attempts | Verify |
| SMS > Providers | the SMS APIs SendMock answers (Twilio, Vonage, ..., your own) | Providers | |
| HTTP Catcher | G H | the catcher for any other HTTP call your app makes | HTTP Catcher |
| Webhooks | G W | what SendMock sends back to your app, and its health | Webhooks |
| Webhooks > Endpoints | where deliveries go and how they are shaped and signed | Endpoints | |
| Webhooks > Rules | which events go to which endpoint, automatically | Rules | |
| Webhooks > Inbound routes | where incoming email (replies) goes, like Mailgun Routes | Inbound routes | |
| Webhooks > Deliveries | G D | the log of everything sent, with retry and replay | Deliveries |
| Webhooks > Composer | a request written by hand, like a small Postman | Composer and Saved | |
| Webhooks > Templates | the shapes a request can take (Twilio, Postmark, Slack, your own) | Templates | |
| Webhooks > Variables | values templates read: tokens, secrets, ids, random values | Variables | |
| Webhooks > Saved | deliveries you bookmarked to send again | Composer and Saved | |
| Payments | G P | every test payment, with its timeline and Simulate menu | Payments |
| Payments > Gateways | the emulated providers: Stripe, PayPal, SSLCommerz, bKash, your own | Gateways | |
| Payments > Methods | what a customer pays with (card, bKash, Nagad, ...) and its test values | Methods | |
| Payments > Flows | the steps a checkout page asks for (card form, number, OTP, PIN, ...) | Flows | |
| Payments > Subscriptions | recurring payments, renewed, failed and canceled on their own clock | Subscriptions | |
| Numbers | G N | your fake phone numbers and Messaging Services, set up like a provider console | Numbers |
| Scenarios | G C | multi-step tests you write once and run again, step by step | Scenarios |
| Logs | G L | the raw SMTP sessions and API requests behind every message | Logs |
| Settings | G , | how SendMock behaves: outcomes, profiles, chaos, seed file, connection snippets | Settings |
The bottom of the sidebar has icon links to the docs, Report an issue, Request a feature, private security reporting and Star on GitHub (hover one for its name), and shows whether the live connection is up and the version. Mod+B (Cmd+B on macOS, Ctrl+B elsewhere) hides or shows the sidebar.
The header
- Guide link: the book icon next to the page title opens that screen's page in this guide, in a new tab.
- Search and the command palette (
Mod+K): jump to any screen, or run an action, by typing its name. - Notification bell: the unread count and the last 50 notable events (new email, new or inbound SMS, failed webhook deliveries), each linking to its item. Pop-up toasts can be turned off or moved in Settings > Notifications.
- Help menu: the docs, keyboard shortcuts, what's new, Report an issue, Request a feature, private security reporting and the repository.
- Theme (
T): light, dark or follow the system.
Every button or link that shows only an icon, here and on every screen, names its action in a tooltip when you hover or focus it, with its key when it has one (for example Delete email D).
Every control of the sidebar and the header, one by one: Sidebar and header in depth.
Keys that work in lists
| Key | Does |
|---|---|
J / K | next / previous item |
Enter | open the selected item |
D | delete the open item |
/ | focus the search |
? | show every shortcut, grouped as General, Lists and messages, and Navigation |
R, Shift+R, F | reply, reply all, forward as the recipient (Mail) |
Empty screens
A screen with nothing yet shows what will appear there, a how to connect card with the exact host and ports to copy, and a sample button (Send a sample email, Send a sample SMS, Start a sample verification, Add a sample number). Samples go through the same path as real traffic, so they fire events, webhooks and notifications. A screen that is empty only because of a search or filter says so and offers Clear filter instead.
The demo toolbar
The demo has a Demo controls button that installed SendMock does not have. It changes the sample data set (including Empty (no traffic)), API latency and errors, live traffic, and whether SendMock pretends to run in Docker, so every state of a screen can be seen.
Next
How it all connects explains how these menus feed each other.