Logo

Details

Intelligent data viewer for native MCP client. Display Model Context Protocol responses with syntax highlighting on iOS and Android devices.

Structured Data Viewer

The Details screen is a versatile, intelligent viewer that automatically adapts to display various types of structured data in the most readable format. From JSON responses to error details, this screen ensures information is always presented clearly.

Overview

The Details screen serves as systemprompt's universal data viewer, intelligently parsing and presenting information based on content type and structure. It's designed to make complex data accessible and actionable.

Key Features

  • Automatic Formatting: Detects data type and formats accordingly
  • Syntax Highlighting: Color-coded for easy reading
  • Interactive Elements: Expandable sections and copyable text
  • Smart Navigation: Jump to specific sections
  • Export Options: Save or share displayed data

Data Types

JSON Data

The most common format in MCP responses:

Display Features

  • Syntax highlighting
  • Collapsible objects/arrays
  • Key-value pair formatting
  • Type indicators
  • Copy individual values

Navigation

  • Search within JSON
  • Expand/collapse all
  • Jump to path
  • Breadcrumb navigation

Error Details

When viewing error information:

Error Components

  • Error type/code
  • Human-readable message
  • Stack trace (if available)
  • Timestamp
  • Affected component
  • Suggested fixes

Interactive Elements

  • Copy error ID
  • Search similar errors
  • Create issue from error
  • View related logs

Lists and Arrays

For collection data:

List Features

  • Numbered items
  • Sortable columns
  • Filterable content
  • Pagination for large sets
  • Bulk actions

Display Options

  • Compact view
  • Detailed cards
  • Table format
  • Grid layout

Text Content

For long-form text:

Text Features

  • Word wrap control
  • Font size adjustment
  • Search highlighting
  • Line numbers (code)
  • Syntax detection

Markdown Content

Rich text formatting:

Markdown Support

  • Headers and sections
  • Code blocks with highlighting
  • Lists and tables
  • Links (clickable)
  • Images (when applicable)

Content Structure

The Details screen provides:

Sidebar Navigation

  • Table of contents
  • Section jumping
  • Search box
  • Recent sections

Breadcrumbs

  • Current location
  • Parent navigation
  • Quick back button
  • Path copying

Smart Scrolling

  • Smooth scrolling to sections
  • Position memory when returning
  • Floating headers for context
  • Progress indicator for long content

Interactive Elements

Copy Functions

Multiple copy options:

Selective Copy

  • Individual values
  • Entire sections
  • Formatted or raw
  • With or without keys

Copy Formats

  • JSON formatted
  • Plain text
  • Markdown
  • CSV (for tables)

Expand/Collapse

Control information density:

  • Toggle individual sections
  • Expand all for full view
  • Collapse all for overview
  • Remember preferences per type

Search Within

Find specific information:

Search Features

  • Real-time results
  • Case sensitivity toggle
  • Regex support
  • Result highlighting
  • Navigation between matches

Common Use Cases

API Response Viewing

When viewing MCP tool responses:

{
  "status": "success",
  "data": {
    "items": [
      {
        "id": 123,
        "name": "Example",
        "status": "active"
      }
    ],
    "total": 42,
    "page": 1
  }
}

Features:

  • Expand data sections
  • Copy specific IDs
  • Navigate pagination
  • Filter by status

Error Investigation

Viewing detailed error information:

Error Type: NetworkTimeout
Message: Request to server timed out after 30s
Code: ERR_TIMEOUT_001
Timestamp: 2024-01-15T10:30:00Z

Stack Trace:
  at makeRequest (network.js:142)
  at MCPClient.execute (client.js:89)
  at ConversationHandler.process (handler.js:234)

Context:
- Server: github-mcp
- Tool: getPullRequests
- Parameters: {"repo": "main", "state": "open"}

Suggested Actions:
1. Check network connectivity
2. Verify server status
3. Increase timeout setting
4. Retry operation

Configuration Display

Viewing server configurations:

Server: GitHub MCP
URL: https://api.githubcopilot.com/mcp/
Transport: SSE
Authentication: OAuth 2.0
 
Configured Tools: (23)
- createIssue
- getPullRequests
- mergePullRequest
[Show all...]
 
Server Hints:
  repository: "myorg/repo"
  default_branch: "main"
  
Status: Connected
Uptime: 4h 32m

Export and Sharing

Export Options

Save data in various formats:

File Formats

  • JSON (.json)
  • Text (.txt)
  • Markdown (.md)
  • CSV (.csv) for tables
  • PDF (.pdf) formatted

Export Settings

  • Include metadata
  • Preserve formatting
  • Add timestamp
  • Custom filename

Sharing Features

Quick Share

  • Copy to clipboard
  • Share sheet integration
  • Email with formatting
  • Message apps
  • AirDrop/Nearby Share

Share Options

  • Full content
  • Selected sections
  • Summary only
  • With context

Customization

Display Preferences

Adjust viewing experience:

Visual Settings

  • Theme (light/dark/auto)
  • Font size
  • Line spacing
  • Color scheme
  • Indent size

Layout Options

  • Sidebar position
  • Compact/spacious
  • Show line numbers
  • Word wrap
  • Tab size

Saved Views

Create custom views:

  1. Configure display settings
  2. Save as preset
  3. Name the view
  4. Quick switch between views
  5. Share view settings

Performance

Large Data Handling

For big datasets:

Optimization

  • Lazy loading
  • Virtual scrolling
  • Progressive rendering
  • Chunked processing

User Experience

  • Loading indicators
  • Partial display
  • Search optimization
  • Memory management

Responsive Design

Adapts to screen size:

  • Phone: Single column, collapsible
  • Tablet: Sidebar navigation
  • Desktop: Full features
  • Landscape: Optimized layout

Integration Examples

From Tool Execution

After running an MCP tool:

  1. Tool returns complex data
  2. "View Details" button appears
  3. Tap to open Details screen
  4. Data formatted automatically
  5. Interact as needed

From Error Handling

When errors occur:

  1. Error captured by system
  2. "View Error Details" option
  3. Full error context shown
  4. Troubleshooting aids included
  5. Quick actions available

From History

Viewing past results:

  1. Select conversation from history
  2. Find tool execution result
  3. Tap to view in Details
  4. Same interactive features
  5. Compare with current

Tips and Tricks

Power User Features

  1. Triple-tap to select entire value
  2. Pinch to zoom on mobile
  3. Cmd/Ctrl+F for search
  4. Cmd/Ctrl+A to expand all
  5. Swipe between sections

Efficiency Tips

  • Use search for large documents
  • Collapse irrelevant sections
  • Copy paths for reference
  • Export frequently used data
  • Create view presets
  • Tap status bar: Scroll to top
  • Long press back: Go to root
  • Swipe from edge: Quick back
  • Double tap section: Toggle expand

Master the Details screen to efficiently work with any data systemprompt provides!

On this page