1Strataix · Modals, drawers, toasts & forms
Rules of thumb · Modal for a single blocking question that doesn't fit inline · Drawer for context beside the work (detail, filters, logs) · Sheet for mobile · Toast for an async result that needs no decision. Never stack two modals. Esc, click-outside, and the X button all dismiss.
2Modals
2aDestructive confirm · key revoke
Revoke this key?
Revoking sk_live_legacy_…a81e is immediate and cannot be undone. Requests using it will start failing with 401.
Doesn't match — type the full name
I understand this action is immediate and cannot be undone
esc to cancel
2bCreate-resource modal · new route
New route
Step 1 of 2 · basics
Use area/action · lowercase · hyphens ok
Aclaude-sonnet-4
gpt-4o gemini-2.5-pro + add
seconds
rpm
Draft saved · 4s ago
3Drawers · right pane for context
3aEdit drawer · member role
DP
Deepak Patel
deepak@acme.com
Viewer · dashboards & requests only
Developer · routes, keys, guardrails
Admin · adds budgets, members, providers
Owner · billing & org · contact support to assign
Copilot Platform add
Admin gets 3 new capabilities
budgets · provider connect · invite members
3bFilter drawer · desktop
Filter requestsClear
PROVIDER
Anthropic 698k
OpenAI 377k
Google 118k
Fireworks 24k
STATUS
2004xx5xxtimeout
LATENCY >
2.0s
DATE RANGE
1h24h7d30dCustom
4Toasts · bottom-right · 5s default · up to 3 stacked
Route deployed · v12
support/triage · live in 4 regions · 842ms
Importing routes · 42 of 100
takes about a minute
Couldn't save key
Network error · changes kept locally
RULES
  • Toasts never ask a question that must be answered
  • Success · 4s · auto-dismiss · progress bar underneath
  • Info / progress · stays until done · no auto-dismiss
  • Error · 8s · includes a retry or undo when possible
  • Max 3 stacked · newest at bottom · older fade out
  • One voice: active, present, under 12 words
5Form patterns · inputs & states
5aField states
Use lowercase · hyphens ok
Used in 4 keys · changing the name breaks them
Spaces aren't allowed — try support/triage
sk-ant-api03-••••••••••••
Verified · 11 models available
priya@acme.com
Email can't be changed by the owner
5bControl kinds
Aclaude-sonnet-4
chat:write tools:read type to add…
24h7d30d90d
Block · reject with 400
Redact · replace with [PII]
Warn only · log but pass through
Auto-fallback · retry 2× before failing
Log full prompts (30-day retention)
Prompt-injection classifier threshold · higher = stricter
5cLong-form layout · label-on-left · fits beside the fields
Identity
How this route shows up in logs, keys and the API.
Models
Primary handles the traffic; fallbacks take over on 5xx or timeout.
Aclaude-sonnet-4
gpt-4o gemini-2.5-pro + add
Policies
Overridden by any org-level guardrails.
PII redaction · emails · phones · SSNs+3ms
Prompt injection · classifier threshold 0.85+6ms
Copyright filter · draft · not deployed
Unsaved changes · 3 edits