Diagnostics Report Panel
A diagnostics report with a rerun action, automatic checks in pass, warn, and fail states, an environment rail, and copy or attach actions.
A diagnostics report with a rerun action, automatic checks in pass, warn, and fail states, an environment rail, and copy or attach actions.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Diagnostics Report Panel is a pre-contact self check: a header card with the report ID, a failed count Badge, the generated time, and a Rerun checks action, then a checks card listing six automatic connectivity and environment tests. Each row carries a state icon for pass, warn, or fail, the check name, a plain result line, and, on the cookie failure, a fix link. A footer below the list states that attaching the report saves a round trip and offers Copy report and Attach to new ticket actions. An environment rail on the right lists the app version, browser, OS, workspace, region, and plan, closed by a privacy note.
Checks and environment rows are two typed const arrays, and a StateIcon helper maps each state to a filled, outlined, or crossed dot. The privacy line spelling out that only connection results and version numbers are included is the detail that makes users comfortable attaching the report.
Reach for this block on the contact or get-help route, run once when the page loads so a fresh report is ready before the user writes in. Map the checks to your own connectivity and environment probes and set the fix links to your relevant docs.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the pre-contact diagnostics snapshot. Other configurations:
Tip: state exactly what the report contains next to the attach button; users share diagnostics far more readily when the privacy scope is explicit.