Notifications - Copy this React, Tailwind Component to your project

Generate a React component for a notification system where the main button is a notification bell icon. When clicked, it should open a dropdown list below and aligned to the left of the button. The dropdown contains a list of notifications showing the time, the username who triggered the notification, and whether the action was a like or a comment. Each notification should have a simple layout with an icon indicating if it’s a like or a comment, followed by the user's name and the time the notification was received. Use Tailwind CSS for styling, and ensure the dropdown closes when clicking outside the component. Add a smooth animation for the dropdown appearing and disappearing." Extra details for prompt: Component structure: A bell icon button as the main trigger. Dropdown: Positioned below and aligned to the left of the bell icon. Notification layout: Each notification should include: User's name in bold. Time of notification in smaller text. An icon showing whether it's a like or a comment. Animation: Smoothly animate the opening and closing of the dropdown. Click outside: Implement logic so the dropdown closes when clicking outside the component. Accessibility: Ensure the component is accessible, including keyboard navigation for opening/closing the dropdown.