CSV File Visualizer

Here's a CSV file visualizer that allows users to paste CSV data and see it rendered as a table. It includes features like delimiter selection, pagination, and sorting.

Features

• CSV Parsing: Handles CSV data with different delimiters (comma, semicolon, tab, pipe)
• Proper Handling of Quoted Values: Correctly parses quoted fields that may contain delimiters
• Sortable Columns: Click on any column header to sort the data
• Pagination: Displays data in manageable chunks with navigation controls
• Responsive Design: Works well on different screen sizes
• Statistics: Shows the number of rows and columns in the dataset

How to Use

1. Paste your CSV data into the text area
2. Select the appropriate delimiter (comma is the default)
3. The data will automatically be parsed and displayed as a table
4. Click on column headers to sort the data
5. Use the pagination controls to navigate through large datasets

The visualizer handles common CSV formatting issues like quoted fields and different line endings. It also attempts to sort numeric data correctly when possible.

I'll enhance the CSV visualizer with search functionality and improved sorting. Here's the updated version:

New Features Added

Search Functionality

• Global Search: Added a search box that filters rows across all columns
• Highlighted Results: Search matches are highlighted in yellow for better visibility
• Result Count: Shows how many rows match your search criteria
• Auto-pagination Reset: Automatically returns to the first page when searching

Improved Sorting

• Better Visual Indicators: Clearer sorting direction indicators
• Consistent Column Width: Added placeholder for sort icons to prevent column width changes
• Optimized Performance: Used useMemo to improve performance for large datasets

Other Improvements

• Better CSV Parsing: Improved handling of different line endings (CR, LF, CRLF)
• Responsive Layout: Better layout on mobile devices
• Empty State Messages: Different messages for "no data" vs "no search results"

How to Use

1. Paste CSV Data: Enter your CSV data in the text area
2. Select Delimiter: Choose the appropriate delimiter for your data
3. Search: Type in the search box to filter rows across all columns

4. Sort: Click on any column header to sort by that column

   • Click again to toggle between ascending and descending order
5. Navigate: Use pagination controls to move through large datasets

The search functionality works across all columns and highlights matches, making it easy to find specific data in large CSV files.