Navbar Changes:
-Introduced a navLinks state in the Navbar component that stores navigation items with dropdown menus.
-Refactored the existing Navbar links to dynamically render navLinks, including Genres, Movies, and TV Shows.
-Retained the existing dropdown functionality for navLinks using the LinkDropdown component.
-Used useEffect to fetch genres dynamically for the Genres dropdown.
Sidebar Changes:
-Modified the Sidebar component to receive and render the navLinks from the Navbar.
-Implemented the SidebarItem component to handle the rendering of dropdowns for navigation items.
-Updated the Sidebar layout and design, ensuring it retains its distinct look while utilizing the same navLinks.
-Added a responsive dropdown menu for items with submenus in the Sidebar, similar to the Navbar's dropdown system.
Enhanced DropdownList Hide Delay:
-The handleMouseEnter function immediately shows the dropdown when the user hovers over it.
-The handleMouseLeave function adds a 200ms delay before hiding the dropdown, giving the user enough time to move their mouse back if they didn't intend to leave the menu.
-The useEffect hook cleans up the setTimeout to prevent unwanted behavior when the component unmounts.
Shared State for Navigation Items:
-Both the Navbar and Sidebar now share the same navLinks state to reduce redundancy.
-Future updates to navigation items only need to be done in one place (inside the navLinks state).
Ahmed-Sitl
commented
1 month ago
Navbar Changes: -Introduced a navLinks state in the Navbar component that stores navigation items with dropdown menus. -Refactored the existing Navbar links to dynamically render navLinks, including Genres, Movies, and TV Shows. -Retained the existing dropdown functionality for navLinks using the LinkDropdown component. -Used useEffect to fetch genres dynamically for the Genres dropdown.
Sidebar Changes: -Modified the Sidebar component to receive and render the navLinks from the Navbar. -Implemented the SidebarItem component to handle the rendering of dropdowns for navigation items. -Updated the Sidebar layout and design, ensuring it retains its distinct look while utilizing the same navLinks. -Added a responsive dropdown menu for items with submenus in the Sidebar, similar to the Navbar's dropdown system.
Enhanced DropdownList Hide Delay:
Shared State for Navigation Items: -Both the Navbar and Sidebar now share the same navLinks state to reduce redundancy. -Future updates to navigation items only need to be done in one place (inside the navLinks state).