cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

Fix navigation between cart and menu on mobile (#709)

Browse Source 
* Fix navigation between cart and menu on mobile

On mobile when the Sidebar menu is open and you want to switch to cart, it would toggle the sidebar and close it instead of switching view.

* Adds missing openSidebar to useUI hook

* Sets correct Sidebar view when adding a product

If the last selected view on mobile was the menu, it was shown instead of the cart when adding a product.

Co-authored-by: Bel <curciobelen@gmail.com>
This commit is contained in:
Lukas Schüth 2022-06-13 21:11:01 +02:00 committed by GitHub
parent 0c5597fb93
commit 2c8d46ce90
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
site/components/common/UserNav/UserNav.tsx
View File

@ -46,7 +46,7 @@ const UserNav: React.FC<{
variant="naked"
onClick={() => {
setSidebarView('CART_VIEW')
toggleSidebar()
openSidebar()
}}
aria-label={`Cart items: ${itemsCount}`}
>
@ -88,8 +88,8 @@ const UserNav: React.FC<{
aria-label="Menu"
variant="naked"
onClick={() => {
setSidebarView('MOBILEMENU_VIEW')
openSidebar()
setSidebarView('MOBILE_MENU_VIEW')
}}
>
<Menu />

3
site/components/product/ProductSidebar/ProductSidebar.tsx
View File

@ -17,7 +17,7 @@ interface ProductSidebarProps {
const ProductSidebar: FC<ProductSidebarProps> = ({ product, className }) => {
const addItem = useAddItem()
const { openSidebar } = useUI()
const { openSidebar, setSidebarView } = useUI()
const [loading, setLoading] = useState(false)
const [selectedOptions, setSelectedOptions] = useState<SelectedOptions>({})
@ -33,6 +33,7 @@ const ProductSidebar: FC<ProductSidebarProps> = ({ product, className }) => {
productId: String(product.id),
variantId: String(variant ? variant.id : product.variants[0]?.id),
})
setSidebarView('CART_VIEW')
openSidebar()
setLoading(false)
} catch (err) {