Polish

site/components/common/Layout/Layout.tsx

@@ -83,9 +83,9 @@ const SidebarView: React.FC<{
   return (
     <Sidebar onClose={closeSidebar}>
       {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>
   )
@@ -95,9 +95,9 @@ const SidebarUI: React.FC<{ links: LinkProps[] }> = ({ links }) => {
   const { displaySidebar, closeSidebar, sidebarView } = useUI()
   return displaySidebar ? (
     <SidebarView
+      links={links}
       sidebarView={sidebarView}
       closeSidebar={closeSidebar}
-      links={links}
     />
   ) : null
 }

site/components/common/SidebarLayout/SidebarLayout.tsx

@@ -12,8 +12,8 @@ type ComponentProps = { className?: string } & (
 const SidebarLayout: FC<ComponentProps> = ({
   children,
   className,
-  handleClose,
   handleBack,
+  handleClose,
 }) => {
   return (
     <div className={cn(s.root, className)}>

site/components/common/UserNav/CustomerMenuContent/CustomerMenuContent.module.css

@@ -1,3 +1,20 @@
+.root {
+  @apply inset-0 fixed;
+  left: 72px;
+  z-index: 10;
+  height: 100vh;
+  min-width: 100vw;
+  transition: none;
+}
+
+@media screen(lg) {
+  .root {
+    @apply static;
+    min-width: inherit;
+    height: inherit;
+  }
+}
+
 .link {
   @apply text-primary flex cursor-pointer px-6 py-3
     transition ease-in-out duration-150 leading-6
@@ -12,24 +29,3 @@
 .link.active {
   @apply font-bold bg-accent-2;
 }
-
-.root {
-  @apply inset-0 fixed;
-  left: 72px;
-  z-index: 10;
-  height: 100vh;
-  min-width: 100vw;
-  transition: none;
-}
-
-.placeholder {
-  height: 68px;
-}
-
-@media screen(lg) {
-  .root {
-    @apply static;
-    min-width: inherit;
-    height: inherit;
-  }
-}

site/components/common/UserNav/CustomerMenuContent/CustomerMenuContent.tsx

@@ -1,15 +1,12 @@
 import cn from 'clsx'
 import { useTheme } from 'next-themes'
 import { useRouter } from 'next/router'
-import { UserNav } from '@components/common'
+import { Moon, Sun } from '@components/icons'
-import { Moon, Sun, Cross } from '@components/icons'
 import s from './CustomerMenuContent.module.css'
 import useLogout from '@framework/auth/use-logout'
 import {
-  Dropdown as DropdownRoot,
-  DropdownMenuItem,
   DropdownContent,
-  DropdownTrigger,
+  DropdownMenuItem,
 } from '@components/ui/Dropdown/Dropdown'
 
 const LINKS = [
@@ -27,8 +24,6 @@ const LINKS = [
   },
 ]
 
-export const Dropdown = <DropdownRoot />
-
 export default function CustomerMenuContent() {
   const router = useRouter()
   const logout = useLogout()
@@ -47,18 +42,6 @@ export default function CustomerMenuContent() {
       className={s.root}
       id="CustomerMenuContent"
     >
-      {/* <div className={s.placeholder}>
-        <button
-          aria-label="Close"
-          className="hover:text-accent-5 transition ease-in-out duration-150 flex items-center focus:outline-none mr-6"
-        >
-          <Cross className="h-6 w-6 hover:text-accent-3" />
-          <span className="ml-2 text-accent-7 text-sm ">Close</span>
-        </button>
-        <div className={s.nav}>
-          <UserNav />
-        </div>
-      </div> */}
       {LINKS.map(({ name, href }) => (
         <DropdownMenuItem key={href}>
           <a