🐛 Bug Details

View, edit, and collaborate on individual issues. The detail drawer brings together core fields, diagnostics, automated test scenarios, and the customer-facing panel in one side-by-side workspace.

🌟 Overview#

Click any issue on the 📋 Task Board to open the Bug Detail Drawer — a side panel that displays everything about a single bug, task, or feature request. The drawer is where your team collaborates: editing fields inline, adding comments with @mentions, uploading annotated screenshots, logging work, and reviewing the diagnostic data captured by the 💬 Feedback widget and the 🔌 Browser Extension .

Every change auto-saves and, when 🔗 Jira sync is active, propagates to the corresponding Jira ticket in real time. The full activity history provides a complete audit trail.

A standalone full-screen version is also available at /bug-view/:bugId — useful for sharing a link or embedding the bug view inside another tool (e.g., the 🧩 Sniffer for Jira panel). It supports ?embed=true to hide chrome.

The drawer header shows:

Element	Description
Issue Key	e.g., `SNF-142` — click to copy
Title	Editable summary text
Status Badge	Current status as a colored lozenge (click to change)
Priority Badge	Color-coded priority pill
Jira Link	If synced, an “Open in Jira ↗” link
✏️ Edit button	Toggle inline editing mode
🔗 Share button	Copy a deep link to this bug
🗑️ Delete button	Remove the issue (with confirmation)
✕ Close button	Close the drawer

📑 Tabs#

The detail drawer organizes information across up to four context-aware tabs. Tabs only appear when they have content to show — e.g., Diagnostics is hidden if the issue has no captured attachments, and Test Automation is hidden if no video recording is attached.

1. ℹ️ Overview#

The default tab. All core fields, editable inline:

Field	Type	Description
Summary	Text input	Brief title of the issue (editable)
Description	Rich text editor	WYSIWYG with bold, italic, lists, code blocks, images, tables, headings
Status	Dropdown	Select from configured statuses
Priority	Selector with icons	Highest 🔴, High 🟠, Medium 🟡, Low 🟢
Type	Selector	Bug, Defect, Task, Story, Feature, Epic, Suggestion, Observation
Assignees	Multi-select with avatars	Search and assign team members
Reporter	Read-only (autopopulated)	Who created the issue
Due Date	Date picker	Target completion date
Start Date	Date picker	When work begins
Tags	Multi-select chips	Color-coded labels
Severity	Dropdown	Blocker, Critical, Major, Minor, Trivial
Estimation	Composite input	Days, hours, minutes
Page URL	URL field	Where the bug was reported
Platform	Dropdown	Windows, macOS, iOS, Android, Web

Inside the Overview tab you’ll also find:

📎 Attachments panel — list / grid toggle, full-size image viewer with zoom & pan, video playback with timeline scrubber and speed control, the 🎨 annotation tool (draw, add text, shapes, choose colors, undo/redo), and download / delete actions. File limit: up to 25 MB per file.
💬 Comments panel — rich-text editor with @mentions, emoji, inline file attachments, edit / delete on your own comments, and threaded replies. Comments sync bidirectionally with Jira when comment sync is enabled in 🔗 Integrations .
⏱️ Work Logs — click ➕ Add Work Log to capture time spent, a description, the date, and the user. Estimation vs. actual time rolls up to 📊 Dashboard analytics .
📜 Activity history — chronological audit trail of every change, comment, status transition, assignment, and link, with timestamps and user attribution. Filterable by event type.

2. 🩺 Diagnostics#

Shown when the issue has captured attachments (screenshots, videos, console logs, network logs). The Diagnostics tab is the “what was happening on the user’s screen” view.

Section	Description
Video Preview	Inline replay of session recordings — scrub, change speed, focus / full toggle
Console Logs	Errors ❌, warnings ⚠️, info ℹ️, and debug 🔧 — color-coded, searchable, with source line when available
Network Logs	Method, URL, status (🟢 2xx, 🟡 3xx, 🔴 4xx/5xx), timing, expandable request / response body and headers
Action Logs	Chronological list of clicks, scrolls, and inputs (first 30 entries)
DOM Snapshot	The HTML state captured at the moment the bug was reported

Screenshots, recordings, and logs captured via the 💬 Feedback Widget , 🔌 Browser Extension , 📡 Live Logs , or 🤖 Sniffer AutoBug land here automatically.

3. 🧪 Test Automation (Coming Soon)#

Shown when the issue has at least one video attachment. The Test Automation tab is a placeholder for generating a runnable UI test scenario from the recorded session.

4. 👥 Customer Panel#

Shown for non-EPIC issues. The Customer Panel is the customer-facing context — who reported it, which account they belong to, prior interactions, and any contact / triage actions you take from here are recorded against the bug.

✏️ Inline Editing#

All fields in the Overview tab are editable directly — click any field to modify it. Changes are:

Auto-saved immediately (optimistic UI with rollback on error)
Synced to Jira in real time (if integration is active)
Logged in activity history with before/after values

🔐 Permissions#

Action	Required Permission
📋 View bug details	`TASK_BOARD.VIEW`
✏️ Edit fields	`TASK_BOARD.EDIT`
💬 Add comments	`TASK_BOARD.EDIT`
🗑️ Delete issue	`TASK_BOARD.DELETE`

Topic	Description
📋 Task Board →	Navigate issues on the board
🔗 Integrations →	How changes sync to Jira in real time
🧩 Sniffer for Jira →	View bug details inside Jira’s sidebar
📊 Dashboard →	Track work logs and team performance