User Permissions List - Copy this React, Tailwind Component to your project
"Create a responsive user interface component for managing user permissions in a list. Each row should include: An index number. User email. A checkbox to toggle user access. A dropdown menu for permissions. Features to include: The row should have a hover effect and be visually styled with Tailwind CSS. The dropdown menu should only be enabled if the user access checkbox is selected. Inside the dropdown, include a list of permission options where 'read' is always disabled. Clicking any permission should toggle its selection, using checkboxes styled with Tailwind CSS. Ensure event handling prevents clicks from propagating unnecessarily (e.g., when selecting permissions). Apply conditional styles for enabled/disabled states in both the dropdown and buttons. Ensure accessibility and usability with keyboard and mouse interactions. Use the following dependencies: Tailwind CSS for styling. React for the component logic. Include examples of utility classes like bg indigo 600, cursor not allowed, and transition effects."
