Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: resolve the issue with active menu items when two or more pages start with the same URL (GCOM-1482) #2369

Merged
merged 4 commits into from
Nov 20, 2024

Conversation

carlocarels90
Copy link
Member

@carlocarels90 carlocarels90 commented Sep 12, 2024

Copy link

vercel bot commented Sep 12, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
graphcommerce ✅ Ready (Inspect) Visit Preview Nov 14, 2024 3:08pm
graphcommerce-adobe-commerce ❌ Failed (Inspect) Nov 14, 2024 3:08pm
graphcommerce-hygraph-dynamic-rows-ui ✅ Ready (Inspect) Visit Preview Nov 14, 2024 3:08pm
magento-2.4.7 ✅ Ready (Inspect) Visit Preview Nov 14, 2024 3:08pm

Copy link

changeset-bot bot commented Sep 12, 2024

🦋 Changeset detected

Latest commit: 706629e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 81 packages
Name Type
@graphcommerce/next-ui Patch
@graphcommerce/magento-graphcms Patch
@graphcommerce/docs Patch
@graphcommerce/browserslist-config-pwa Patch
@graphcommerce/changeset-changelog Patch
@graphcommerce/eslint-config-pwa Patch
@graphcommerce/graphql-codegen-markdown-docs Patch
@graphcommerce/graphql-codegen-near-operation-file Patch
@graphcommerce/graphql-codegen-relay-optimizer-plugin Patch
@graphcommerce/next-config Patch
@graphcommerce/prettier-config-pwa Patch
@graphcommerce/typescript-config-pwa Patch
@graphcommerce/address-fields-nl Patch
@graphcommerce/algolia-categories Patch
@graphcommerce/algolia-insights Patch
@graphcommerce/algolia-personalization Patch
@graphcommerce/algolia-products Patch
@graphcommerce/algolia-recommend Patch
@graphcommerce/algolia-search Patch
@graphcommerce/cli Patch
@graphcommerce/demo-magento-graphcommerce Patch
@graphcommerce/ecommerce-ui Patch
@graphcommerce/framer-next-pages Patch
@graphcommerce/framer-scroller Patch
@graphcommerce/framer-utils Patch
@graphcommerce/google-datalayer Patch
@graphcommerce/googleanalytics Patch
@graphcommerce/googlerecaptcha Patch
@graphcommerce/googletagmanager Patch
@graphcommerce/graphql-mesh Patch
@graphcommerce/graphql Patch
@graphcommerce/hygraph-cli Patch
@graphcommerce/hygraph-dynamic-rows-ui Patch
@graphcommerce/hygraph-dynamic-rows Patch
@graphcommerce/graphcms-ui Patch
@graphcommerce/image Patch
@graphcommerce/lighthouse Patch
@graphcommerce/lingui-next Patch
@graphcommerce/magento-cart-billing-address Patch
@graphcommerce/magento-cart-checkout Patch
@graphcommerce/magento-cart-coupon Patch
@graphcommerce/magento-cart-email Patch
@graphcommerce/magento-cart-items Patch
@graphcommerce/magento-cart-payment-method Patch
@graphcommerce/magento-cart-pickup Patch
@graphcommerce/magento-cart-shipping-address Patch
@graphcommerce/magento-cart-shipping-method Patch
@graphcommerce/magento-cart Patch
@graphcommerce/magento-category Patch
@graphcommerce/magento-cms Patch
@graphcommerce/magento-compare Patch
@graphcommerce/magento-customer-account Patch
@graphcommerce/magento-customer-order Patch
@graphcommerce/magento-customer Patch
@graphcommerce/magento-graphql-rest Patch
@graphcommerce/magento-graphql Patch
@graphcommerce/magento-newsletter Patch
@graphcommerce/magento-pagebuilder Patch
@graphcommerce/magento-payment-adyen Patch
@graphcommerce/magento-payment-braintree Patch
@graphcommerce/magento-payment-included Patch
@graphcommerce/magento-payment-klarna Patch
@graphcommerce/magento-payment-multisafepay Patch
@graphcommerce/magento-payment-paypal Patch
@graphcommerce/magento-product-bundle Patch
@graphcommerce/magento-product-configurable Patch
@graphcommerce/magento-product-downloadable Patch
@graphcommerce/magento-product-grouped Patch
@graphcommerce/magento-product-simple Patch
@graphcommerce/magento-product-virtual Patch
@graphcommerce/magento-product Patch
@graphcommerce/magento-recently-viewed-products Patch
@graphcommerce/magento-review Patch
@graphcommerce/magento-search Patch
@graphcommerce/magento-store Patch
@graphcommerce/magento-wishlist Patch
@graphcommerce/mollie-magento-payment Patch
@graphcommerce/react-hook-form Patch
@graphcommerce/framer-next-pages-example Patch
@graphcommerce/framer-scroller-example Patch
@graphcommerce/image-example Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@@ -42,7 +42,7 @@ export function DesktopNavItem(props: DesktopNavItemLinkProps | DesktopNavItemBu

const { href, children, sx = [], ...linkProps } = props

const active = router.asPath.startsWith((href ?? '').toString())
const active = router.asPath === (href ?? '').toString()
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The idea was that if a child is selected that the parent would be selected as well, so that breaks with this, any suggestions?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@paales see my latest changes 🙂

Now it activates the parent and only the menu item that exactly matches the router.asPath.

https://github.com/graphcommerce-org/graphcommerce/pull/2369/files

@carlocarels90 carlocarels90 changed the title chore: resolve the issue with active menu items when two or more pages start with the same URL chore: resolve the issue with active menu items when two or more pages start with the same URL (GCOM-1482) Oct 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants