feat: add CSV Logs Viewer utility with Datadog-inspired filtering

[devin-ai-integration]

CSV Logs Viewer Utility

Summary

Adds a new CSV Logs Viewer utility that allows users to quickly scan, filter, and search through CSV log files. The design is inspired by Datadog's logs dashboard UX.

Key features:

• File upload: Supports .csv, .tsv, .txt, and .log files with auto-detection of delimiters (tab, comma, semicolon)
• Search with highlighting: Yellow highlight on search matches, same as HAR file viewer
• Log level color coding: Subtle background colors for error (red), warning (yellow), info (blue), and debug (gray) rows with left border indicators
• Faceted filtering sidebar: Datadog-style collapsible facets showing unique values per column with counts
• Column header filters: Quick filter dropdowns in each column header
• Expandable rows: Click to expand and see full log entry details
• Full-width layout: Table uses full screen width for better log visibility
• Fixed column widths: Columns maintain consistent widths when filtering to prevent layout jumping
• Instant tooltips: Truncated cell content shows full value on hover with minimal delay (100ms)
• Dual marker columns for tracing: Click the "#" column to mark rows for tracing two separate flows:
  • Flow A (blue): Normal click - sequential numbering (1, 2, 3...)
  • Flow B (green): Cmd/Ctrl+click - independent sequential numbering starting from 1
  • Marked rows stay visible even when filtered out (shown with reduced opacity)
  • Responsive stack numbering: Removing a marker causes subsequent markers to renumber (e.g., removing feat: base64 encoder/decoder #2 shifts feat: CSV to JSON #3, feat: create YAML to JSON page #4 to become feat: base64 encoder/decoder #2, feat: CSV to JSON #3)
• Dev Mode toggle: Checkbox with info tooltip to control log-specific features (colors, Status filter). Auto-detected based on file structure.
• Smart log detection: Automatically detects log files vs regular CSVs based on headers (log, message, service, host, level, severity, etc.), timestamp columns, and column count

Review & Testing Checklist for Human

• Verify Dev Mode toggle works correctly - when OFF, rows should not have log level colors and Status facet should be hidden; when ON, all log features should be visible
• Verify smart log detection accuracy - upload a regular CSV (like customers-1000.csv) and verify Dev Mode is OFF by default; upload a log file and verify Dev Mode is ON by default
• Verify performance with large files - upload the 1000-row customers CSV and verify facets load quickly (should be under 500ms)
• Verify responsive stack renumbering works correctly - mark rows 1, 2, 3, 4 then remove feat: base64 encoder/decoder #2; remaining markers should renumber to 1, 2, 3 (not 1, 3, 4)
• Verify dual marker flows work correctly - normal click should create blue "Flow A" markers; Cmd/Ctrl+click should create green "Flow B" markers with independent numbering

Recommended test plan:

1. Upload a regular CSV (e.g., customers-1000.csv) - verify Dev Mode is OFF and no log colors appear
2. Toggle Dev Mode ON - verify colors and Status facet appear
3. Upload a log file (with Date, Host, Service, Content columns) - verify Dev Mode is ON by default
4. Test marker functionality: mark rows, remove markers, verify renumbering
5. Apply filters and verify marked rows remain visible

Notes

• Smart log detection uses heuristics: checks for log-related headers, timestamp patterns, and column count (≤8 columns suggests logs)
• Performance optimization: buildFacets now uses single-pass algorithm and limits facet values to top 100 by count
• Unit tests added for parseCSV, detectLogLevel, detectIfLogsFile, buildFacets, filterRows, formatDate, isDateColumn, and performance benchmark
• Test file customers-1000.csv added to __tests__/fixtures/ for benchmarking
• Local test environment had a canvas module issue (pre-existing), but tests should pass in CI

Updates since last revision

• Added Dev Mode toggle with info icon and tooltip explaining what it does
• Added smart log detection (detectIfLogsFile) to auto-enable Dev Mode only for log-like files
• Optimized buildFacets with single-pass algorithm and configurable max values per facet (default 100)
• Added comprehensive unit tests with 1000-row CSV benchmark for performance validation

Link to Devin run: https://app.devin.ai/sessions/e9318770b38e48e58e01d1492898295e
Requested by: @peckz

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[cloudflare-workers-and-pages]

Deploying jam-dev-utilities with    Cloudflare Pages

Latest commit:	7365372
Status:	✅  Deploy successful!
Preview URL:	https://e776aafb.jam-dev-utilities.pages.dev
Branch Preview URL:	https://devin-1769275420-csv-logs-vi.jam-dev-utilities.pages.dev

View logs