update : Modular Navbar

[yashpandey06]

Overview

This pull request refactors the Navbar component to enhance modularity, scalability, and maintainability. The changes align with industry standards for component-based architecture, making the codebase easier to manage and extend in the future.

Changes

• Componentization:
  • The Navbar component has been broken down into smaller, reusable components:
  • MenuItem: Handles individual menu items.
  • MenuGroup: Manages groups of menu items.
  • NavbarItem: Manages main navigation items.
  • These components are located in the src/components/Navbar/components directory.
• Data Separation:
  • Menu items data has been moved to a separate JSON file (menuItems.json) located in src/components/Navbar/data.
• Improved Import Structure:
  • Updated import paths to reflect the new folder structure.
• Node.js and NPM Updates:
  • Updated Node.js to version 20.5.0 and NPM to version 9.8.0.
  • Addressed deprecation warnings by updating relevant packages.
• Testing:
  • Ensured all existing tests pass with the new structure.
  • Identified obsolete snapshots for review and potential update.

Related Issues

• Issue #107

Future Development Pattern

To maintain a scalable and maintainable codebase, we recommend adopting the following practices:

• Component-Based Architecture: Continue breaking down complex components into smaller, reusable pieces.
• Data-Driven Design: Separate configuration data from component logic.
• Consistent Environment: Ensure consistent versions of Node.js and NPM across environments.
• Regular Updates: Keep dependencies up to date.
• Testing and Documentation: Maintain comprehensive tests and documentation.

Author Checklist

• [ ] Ensure you provide a DCO sign-off for your commits using the --signoff option of git commit.
• [ ] Vital features and changes captured in unit and/or integration tests
• [ ] Commits messages follow AP format
• [ ] Extend the documentation, if necessary
• [ ] Merging to main from fork:branchname

[netlify[bot]]

❌ Deploy Preview for ap-template-playground failed.

Name	Link
🔨 Latest commit	c35ccf7f8e7020a36be5f3401fbfa4efa35390ba
🔍 Latest deploy log	https://app.netlify.com/sites/ap-template-playground/deploys/66f7a8dfeda0b300088b7405

[Vinyl-Davyl]

Hey @yashpandey06, it seems like the Netlify deploy is failing on multiple checks. Could you please ensure the build runs successfully before finalizing the PR? Try running npm run build locally to catch any errors, and make sure to address them before pushing the changes. This will help avoid deployment issues and ensure everything is working smoothly. Thanks