feat: improve text/JSON column display with preview modal

[EVWorth]

Problem

Text and JSON columns currently overflow and make the grid unreadable. Large content crashes the layout and makes adjacent columns inaccessible.

Solution

Implement cell preview + detail modal similar to SQLyog:

1. Cell Preview (inline)

   • Truncate text to 50-100 chars with ellipsis
   • Show type indicator (JSON, TEXT, BLOB, etc.)
   • Visual affordance: cursor change on hover

2. Detail Modal (on click)

   • Full content display in dedicated modal/drawer
   • Syntax highlighting for JSON, SQL, Markdown
   • Copy/Download buttons
   • Searchable for large text
   • Read-only OR editable toggle

3. Column Width

   • Auto-fit content OR fixed preview width
   • Resizable per column

Implementation Notes

• React component: CellDetailModal
• Integrate with ResultsGrid
• State management via Zustand (resultStore)
• Consider lazy loading for very large values (>1MB)

[EVWorth]

Work in progress on enhanced cell display modal.

✅ Completed:

• ✅ Truncated text preview (50 chars) with ellipsis - issue Truncate large text fields in results grid with expand modal #73 implemented
• ✅ Double-click to view full content in modal
• ✅ Copy to clipboard button
• ✅ JSON automatic formatting with proper indentation
• ✅ Content type detection (JSON, SQL, Markdown, text)
• ✅ Type indicator badge showing detected content type
• ✅ Search functionality for large content
• ✅ Download button to export cell content

Partially Implemented Features:

• Type detection (JSON, SQL, Markdown - without syntax highlighting)
• Search for large text
• Download button for export
• Visual type indicators

Still Needed for #66:

• Syntax highlighting for JSON, SQL, Markdown (requires external library like Prism or Highlight.js)
• Read-only/editable toggle (would require significant state management changes)
• Resizable columns (requires react-table enhancements)
• Auto-fit content optimization

Recent commits:

• feat: enhance cell viewer modal with JSON formatting and search (15b0ee3)

This provides a solid foundation for the enhanced preview modal. Syntax highlighting could be added by integrating a library like Prism or Highlight.js.

[EVWorth]

Progress update on #66:

✅ Now implemented:

• Read-only Monaco viewer with real syntax highlighting
• Automatic content detection for JSON, SQL, Markdown, text
• JSON pretty-printing and SQL formatting before display
• Search box with highlighted matches inside Monaco
• Copy and download actions still preserved
• NULL handling fixed so literal "NULL" strings aren't mistaken for SQL NULL

What remains from the original scope:

• Editable toggle / inline edit mode
• Resizable columns / auto-fit width tuning

This is a much better preview modal than the original plain-text viewer and covers the main overflow/readability problem.

[EVWorth]

Completed the preview modal and grid sizing work for #66.

✅ Implemented:

• Read-only Monaco preview with syntax highlighting for JSON, SQL, and Markdown
• Automatic content detection and formatting
• Search box with highlighted matches
• Copy and download actions
• Local editable toggle inside the viewer
• Column resize handles in ResultsGrid
• Fixed NULL handling so literal "NULL" strings stay as text

Notes:

• Edit mode is local to the modal viewer, matching the requested read-only/editable toggle.
• Column resizing is enabled directly in the results grid headers.

This closes the main UX gap where large text/JSON cells overwhelmed the grid.