Rich webhook event subscription input - #3326
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
3e8fa0a to
8172938
Compare
| Event subscriptions may include simple globs to subscribe to multiple categories of | ||
| events. E.g. <code className={globCode}>hardware.**</code> or{' '} | ||
| <code className={globCode}>**.fault</code>.{' '} |
There was a problem hiding this comment.
Can we call these "Alerts" and "alert classes" rather than "events"? This is the language used in the API and in the documentation.
| Event subscriptions may include simple globs to subscribe to multiple categories of | |
| events. E.g. <code className={globCode}>hardware.**</code> or{' '} | |
| <code className={globCode}>**.fault</code>.{' '} | |
| Alert subscriptions may include simple globs to subscribe to multiple classes of | |
| alerts. E.g. <code className={globCode}>hardware.**</code> or{' '} | |
| <code className={globCode}>**.fault</code>.{' '} |
There was a problem hiding this comment.
Yep, we talked about this on a call yesterday after the FMA sync. also saying “subscriptions” as appropriate
There was a problem hiding this comment.
Great, just wanted to make sure we were all up to date since I think Benji had first started working on this several months ago, before we renamed basically everything.
| <a | ||
| href={links.webhooksGuide} | ||
| target="_blank" | ||
| rel="noreferrer" | ||
| className="mt-1 inline-block" | ||
| > | ||
| Read the Webhooks guide |
There was a problem hiding this comment.
does this link to the section on globing in the alerts guide?
| }, | ||
| { | ||
| "label": "New webhook receiver", | ||
| "path": "/system/alerts-new", |
There was a problem hiding this comment.
I don't think the name "alerts new" makes sense here. We aren't creating a new alert, we are creating a new webhook receiver, which is a kind of alert receiver.
| // TODO: this guide does not exist yet; make sure it does before release | ||
| webhooksGuide: 'https://docs.oxide.computer/guides/operator/webhooks', |
There was a problem hiding this comment.
I think this might be out of date: we could link to the top level alerts guide at https://docs.oxide.computer/guides/alerts/overview (which contains the explanation of alert classes and how glob patterns match them), and/or the webhooks guide at https://docs.oxide.computer/guides/alerts/webhooks (which discusses secrets and other details of how alerts are sent to webhooks receivers), as appropriate
|
|
||
| describe('subscriptionRegex', () => { | ||
| it('matches exact class names', () => { | ||
| expect(subscriptionRegex('probe').test('probe')).toBe(true) |
There was a problem hiding this comment.
'probe' is not a valid alert class to subscribe to, and the server will reject attempts to subscribe to the probe class with a 400 error. it's not treated as a "real" alert class. i think we shouldn't be testing with it if the API will reject it; we might want to explicitly include that rule in client side validation.
what does this, uh. mean? |
|
Backspace when the cursor is right next to a tag highlights the tag and then a second press deletes in. In this clip when the highlight ring is toggling on and off I'm pressing backspace, right, backspace, right. Then I press backspace twice to delete. Left/right also lets you move focus between the tags. 2026-08-14-webhook-arm.mp4 |
Rich event subscription input. Will require a bit of QA to check for robustness but the UX pattern feels satisfying. Good for both quickly adding classes and discoverability of the glob pattern matching.
Tag style input with chips for each of the subscription globs. Colour-coded to distinguish between exact and broad classes.
Dropdown opens on focus, showing the full catalog with name and description per row, subscribed classes sorted to the top (order is frozen while open so rows don't jump mid-picking). Rows are checkboxes: ticking commits an exact class without resetting the query, so multiple picks are cheap. Row states:
HARDWARE.*.FAULT)**widening that would cover itvia hardware.**label so it can't be double-added*.shows the whole catalog rather than no results.Enter commits the query or toggles the highlighted row. Up/Down navigate rows, skipping covered ones. Backspace on an empty query arms the last chip; a second press deletes it. Left/Right move the armed selection so any chip can be deleted, and typing disarms.
Adding or removing chips can wrap the input to a new line, which would shift the dropdown; a ResizeObserver scrolls the page by the height delta so the panel and the line you're typing on stay put.
Also included:
subscriptionRegexmoved from the mock handlers intoapp/api/util.ts(with tests) since the field now matches globs client side against a single catalog fetch.hardware.sled.*,hardware.disk.*,system.update.*, etc.) modeled on the existing PSU classes and RFD 538's FMA framing. Mock-only; Omicron still defines just three.guides/operator/webhooks) doesn't exist yet and needs to before release.