crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-22 20:26:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixes & Updates (#704)

Browse Source 
* Adding Dropdown Component

* Styling Issues

* Wishlist Fix

* Fixes for Wishlist View

* Hearts now work again

* Rollback ts

* Removing extra config to disable BigCommerce

* Fixes for Wishlist View

* Remove transition/animation for mobile

* New Updates.

* New Updates.

* Dropdown fix

* Polish

* export

* export

* revert tsconfig

Co-authored-by: Luis Alvarez D. <luis@vercel.com>

Co-authored-by: Dom Sip <dom@vercel.com>
Co-authored-by: Luis Alvarez D. <luis@vercel.com>
This commit is contained in:
Bel
2022-03-16 12:05:58 +01:00
committed by GitHub
parent 6e6db0773b
commit 172deeee86
35 changed files with 780 additions and 404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
site/components/common/Layout/Layout.tsx
View File

@@ -1,12 +1,11 @@
import cn from 'clsx'
import React, { FC } from 'react'
import s from './Layout.module.css'
import dynamic from 'next/dynamic'
import { useRouter } from 'next/router'
import { CommerceProvider } from '@framework'
import LoginView from '@components/auth/LoginView'
import { useUI } from '@components/ui/context'
import type { Page } from '@commerce/types/page'
import { Navbar, Footer } from '@components/common'
import type { Category } from '@commerce/types/site'
import ShippingView from '@components/checkout/ShippingView'
import CartSidebarView from '@components/cart/CartSidebarView'
import { useAcceptCookies } from '@lib/hooks/useAcceptCookies'
@@ -14,10 +13,10 @@ import { Sidebar, Button, LoadingDots } from '@components/ui'
import PaymentMethodView from '@components/checkout/PaymentMethodView'
import CheckoutSidebarView from '@components/checkout/CheckoutSidebarView'
import { CheckoutProvider } from '@components/checkout/context'
import MenuSidebarView, { Link } from '../UserNav/MenuSidebarView'
import LoginView from '@components/auth/LoginView'
import s from './Layout.module.css'
import { MenuSidebarView } from '@components/common/UserNav'
import type { Page } from '@commerce/types/page'
import type { Category } from '@commerce/types/site'
import type { Link as LinkProps } from '../UserNav/MenuSidebarView'
const Loading = () => (
<div className="w-80 h-80 flex items-center text-center justify-center p-3">
@@ -29,35 +28,26 @@ const dynamicProps = {
loading: Loading,
}
const SignUpView = dynamic(
() => import('@components/auth/SignUpView'),
{
...dynamicProps
}
)
const SignUpView = dynamic(() => import('@components/auth/SignUpView'), {
...dynamicProps,
})
const ForgotPassword = dynamic(
() => import('@components/auth/ForgotPassword'),
{
...dynamicProps
}
)
const FeatureBar = dynamic(
() => import('@components/common/FeatureBar'),
{
...dynamicProps
}
)
const Modal = dynamic(
() => import('@components/ui/Modal'),
{
...dynamicProps,
ssr: false
}
)
const FeatureBar = dynamic(() => import('@components/common/FeatureBar'), {
...dynamicProps,
})
const Modal = dynamic(() => import('@components/ui/Modal'), {
...dynamicProps,
ssr: false,
})
interface Props {
pageProps: {
pages?: Page[]
@@ -65,7 +55,7 @@ interface Props {
}
}
const ModalView: FC<{ modalView: string; closeModal(): any }> = ({
const ModalView: React.FC<{ modalView: string; closeModal(): any }> = ({
modalView,
closeModal,
}) => {
@@ -78,41 +68,41 @@ const ModalView: FC<{ modalView: string; closeModal(): any }> = ({
)
}
const ModalUI: FC = () => {
const ModalUI: React.FC = () => {
const { displayModal, closeModal, modalView } = useUI()
return displayModal ? (
<ModalView modalView={modalView} closeModal={closeModal} />
) : null
}
const SidebarView: FC<{
const SidebarView: React.FC<{
sidebarView: string
closeSidebar(): any
links: Link[]
links: LinkProps[]
}> = ({ sidebarView, closeSidebar, links }) => {
return (
<Sidebar onClose={closeSidebar}>
{sidebarView === 'MOBILEMENU_VIEW' && <MenuSidebarView links={links} />}
{sidebarView === 'CART_VIEW' && <CartSidebarView />}
{sidebarView === 'CHECKOUT_VIEW' && <CheckoutSidebarView />}
{sidebarView === 'PAYMENT_VIEW' && <PaymentMethodView />}
{sidebarView === 'SHIPPING_VIEW' && <ShippingView />}
{sidebarView === 'PAYMENT_VIEW' && <PaymentMethodView />}
{sidebarView === 'CHECKOUT_VIEW' && <CheckoutSidebarView />}
{sidebarView === 'MOBILE_MENU_VIEW' && <MenuSidebarView links={links} />}
</Sidebar>
)
}
const SidebarUI: FC<{ links: any }> = ({ links }) => {
const SidebarUI: React.FC<{ links: LinkProps[] }> = ({ links }) => {
const { displaySidebar, closeSidebar, sidebarView } = useUI()
return displaySidebar ? (
<SidebarView
links={links}
sidebarView={sidebarView}
closeSidebar={closeSidebar}
links={links}
/>
) : null
}
const Layout: FC<Props> = ({
const Layout: React.FC<Props> = ({
children,
pageProps: { categories = [], ...pageProps },
}) => {