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
• SEO component: Added comprehensive SEO content targeting both developers (log analysis, debugging) and regular users (CSV viewer, data exploration)

Review & Testing Checklist for Human

• Verify SEO content displays correctly - scroll down on the page to see the SEO section with FAQs and usage instructions
• Verify page title - browser tab should show "Log File Viewer (.csv, .tsv, .log) | Free Online Tool"
• 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 links in SEO section - check that links to CSV to JSON, JSON to CSV, HAR File Viewer, and JSON Formatter work

Recommended test plan:

1. Visit the page and verify the title in the browser tab
2. Scroll down to see the SEO content section with FAQs
3. Upload a regular CSV (e.g., customers-1000.csv) - verify Dev Mode is OFF and no log colors appear
4. Toggle Dev Mode ON - verify colors and Status facet appear
5. Upload a log file (with Date, Host, Service, Content columns) - verify Dev Mode is ON by default
6. Test marker functionality: mark rows, remove markers, verify renumbering

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 CsvLogsViewerSEO component with content targeting both developers and regular users
• Updated page title to "Log File Viewer (.csv, .tsv, .log) | Free Online Tool" for broader SEO appeal
• Updated meta description to mention CSV, TSV, and log file support
• SEO content includes usage instructions, Dev Mode explanation, FAQs, and links to related utilities

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:	96fd905
Status:	✅  Deploy successful!
Preview URL:	https://421a198b.jam-dev-utilities.pages.dev
Branch Preview URL:	https://devin-1769275420-csv-logs-vi.jam-dev-utilities.pages.dev

View logs