Refactor ShopMenu: Dynamic, Responsive & Accessible Mega Menu

[NirajDN]

Pull Request

Thanks for contributing to Hacktoberfest 2025!

Description

This PR refactors the ShopMenu component to make it cleaner, more maintainable, and visually appealing. Key improvements include:

• Converted hardcoded menu items into a dynamic data structure for easier management.
• Enhanced responsiveness across all screen sizes using grid layouts and flexible spacing.
• Added smooth hover and focus animations for an improved user experience.
• Improved accessibility with proper keyboard navigation, focus management, and ARIA attributes.
• Simplified and cleaned up JSX to reduce code duplication and improve readability.
• Maintains compatibility with existing styling and dark/light themes.

These changes make the ShopMenu component easier to extend, maintain, and contribute to in future updates.

Checklist

• My code builds and runs locally
• I’ve added/updated documentation if needed
• I’ve tested my changes
• I’ve linked related issues (if any)
• (Optional) I’ve credited myself with the All Contributors bot if this is my first contribution or a new contribution type

[Alexandrbig1]

@NirajDN, thanks for your updates. Please check the design; you didn't add all the menu items. Fetch latest updates, verify with Figma design, run locally, if everything works well, run npm run lint before creating PR to make sure there are no errors.