Add regex cheat-sheet icon next to regex inputs
Adds RegexHelpIcon, a hover/click popover (modeled on HelpIcon) showing a compact cheat sheet for the Rust `regex` crate's actual syntax, and places it next to every user-facing regex field: Params/Metrics message match regex, Alerts field regex, and FilterBar's regex(...) helper. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XFUNZwCvz3kcod3352ZR2o
This commit is contained in:
co-authored by
Claude Sonnet 5
parent
e6e5bc8f50
commit
83cc7105d6
@@ -11,6 +11,7 @@ import {
|
||||
} from '../lib/api'
|
||||
import { sectionHeaderClassName, sectionHeaderLeftClassName } from './CollapsibleSection'
|
||||
import { HelpIcon } from './HelpIcon'
|
||||
import { RegexHelpIcon } from './RegexHelpIcon'
|
||||
import { queryInputClassName } from './FilterBar'
|
||||
|
||||
type ConditionKind = AlertCondition['kind']
|
||||
@@ -323,7 +324,10 @@ export function Alerts() {
|
||||
{form.kind === 'newvalue' && (
|
||||
<div className="space-y-1">
|
||||
<div>
|
||||
<label className="mb-1 block text-xs text-text-subtle">Field regex</label>
|
||||
<label className="mb-1 flex items-center gap-1 text-xs text-text-subtle">
|
||||
Field regex
|
||||
<RegexHelpIcon label="Help: Field regex syntax" />
|
||||
</label>
|
||||
<input
|
||||
className="w-full rounded border border-border-soft bg-surface-1 px-2 py-1 font-mono text-sm text-text placeholder:text-text-subtle focus:border-border-strong focus:outline-none"
|
||||
value={form.fieldRegex}
|
||||
|
||||
Reference in New Issue
Block a user