Create a simple and responsive web interface that allows users to upload an Excel file (.xlsx), read a specific worksheet named "EBPs DATA SOURCE", and extract data from it.
Functional Requirements:
After uploading the Excel file:
Read only rows 2 to 37 from the worksheet "EBPs DATA SOURCE"
Focus on the column titled "EBP", which contains searchable keywords
Create a dropdown menu that shows all unique values from the "EBP" column within rows 2–37.
When the user selects a keyword from the dropdown:
Display the entire row of data corresponding to that EBP value
Show the values of all other columns in a clean, readable layout (e.g. in a card or table format)
If no matching value is found, show a “No data found” message.
Use SheetJS (xlsx.js) or similar for client-side Excel parsing.
Ensure the UI is clean, responsive, and mobile-friendly.
I'll create a responsive web interface for uploading and reading Excel files, specifically designed to work with the EBPs DATA SOURCE worksheet. The interface will allow users to select EBP values from a dropdown and view the complete row data.
I've created a comprehensive Excel file reader specifically designed for your EBPs DATA SOURCE worksheet. Here are the key features:
The interface handles errors gracefully, shows loading states, and provides clear feedback to users throughout the process. It's built with modern React patterns and uses shadcn/ui components for a professional appearance.