Skip to content
Snippets Groups Projects
Commit bdf3f9c3 authored by LAFORÊT Nicolas's avatar LAFORÊT Nicolas :rabbit2:
Browse files

:bug: only display cart icon on sell page

parent 7527708a
1 merge request!7🔀 V1
Hide whitespace changes
Inline Side-by-side
src/components/layout/main.tsx
+ 72
− 69
View file @ bdf3f9c3
......@@ -28,6 +28,7 @@ const Main = ({ title, subTitle, children }: LayoutProps) => {
const { dispatch } = useContext(cartContext);
let navigate = useNavigate();
let path = window.location.pathname;
console.log(path)
const userNavigation = [
{ name: 'Se déconnecter', action: () => {return auth.signout(() => navigate("/"))} },
......@@ -41,80 +42,82 @@ const Main = ({ title, subTitle, children }: LayoutProps) => {
return (
<RequireAuth>
<div className="h-screen flex overflow-hidden bg-gray-100">
<Navbar sidebarOpen={sidebarOpen} setSidebarOpen={setSidebarOpen} path={path} />
<div className="h-screen flex overflow-hidden bg-gray-100">
<Navbar sidebarOpen={sidebarOpen} setSidebarOpen={setSidebarOpen} path={path} />
<div className="flex flex-col w-0 flex-1 overflow-hidden">
<div className="relative z-10 flex-shrink-0 flex h-16 bg-white shadow">
<button
type="button"
className="px-4 border-r border-gray-200 text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 md:hidden"
onClick={() => setSidebarOpen(true)}
>
<span className="sr-only">Open sidebar</span>
<MenuAlt2Icon className="h-6 w-6" aria-hidden="true" />
</button>
<div className="flex-1 px-4 flex justify-between">
<div className="flex-1 flex w-full md:ml-0 items-center"><span className="text-xl font-semibold">Dashboard</span></div>
<div className="ml-4 flex items-center md:ml-6">
<button onClick={() => {toggleCart()}} className="max-w-xs mx-2 bg-white flex items-center text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<span className="sr-only">Open cart</span>
<ShoppingCartIcon className="h-8 w-8 rounded-full" />
</button>
<Menu as="div" className="mx-2 flex flex-row relative">
<div>
<Menu.Button className="max-w-xs bg-white flex items-center text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<span className="sr-only">Open user menu</span>
<UserIcon className="h-8 w-8 rounded-full" />
</Menu.Button>
</div>
<Transition
as={Fragment}
enter="transition ease-out duration-100"
enterFrom="transform opacity-0 scale-95"
enterTo="transform opacity-100 scale-100"
leave="transition ease-in duration-75"
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items className="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
<Menu.Item key="username"><span className="block px-4 py-2 text-sm text-gray-700 font-semibold">Bienvenue {auth.user} !</span></Menu.Item>
{userNavigation.map((item) => (
<Menu.Item key={item.name}>
{({ active }) => (
<button
onClick={() => {item.action()}}
className={classNames(active ? 'bg-gray-100' : '', 'block px-4 py-2 text-sm text-gray-700 w-full')}
>
{item.name}
</button>
)}
</Menu.Item>
))}
</Menu.Items>
</Transition>
</Menu>
<div className="flex flex-col w-0 flex-1 overflow-hidden">
<div className="relative z-10 flex-shrink-0 flex h-16 bg-white shadow">
<button
type="button"
className="px-4 border-r border-gray-200 text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 md:hidden"
onClick={() => setSidebarOpen(true)}
>
<span className="sr-only">Open sidebar</span>
<MenuAlt2Icon className="h-6 w-6" aria-hidden="true" />
</button>
<div className="flex-1 px-4 flex justify-between">
<div className="flex-1 flex w-full md:ml-0 items-center"><span className="text-xl font-semibold">Dashboard</span></div>
<div className="ml-4 flex items-center md:ml-6">
{path === '/dashboard' &&
<button onClick={() => { toggleCart() }} className="max-w-xs mx-2 bg-white flex items-center text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<span className="sr-only">Open cart</span>
<ShoppingCartIcon className="h-8 w-8 rounded-full" />
</button>
}
<Menu as="div" className="mx-2 flex flex-row relative">
<div>
<Menu.Button className="max-w-xs bg-white flex items-center text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<span className="sr-only">Open user menu</span>
<UserIcon className="h-8 w-8 rounded-full" />
</Menu.Button>
</div>
<Transition
as={Fragment}
enter="transition ease-out duration-100"
enterFrom="transform opacity-0 scale-95"
enterTo="transform opacity-100 scale-100"
leave="transition ease-in duration-75"
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items className="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
<Menu.Item key="username"><span className="block px-4 py-2 text-sm text-gray-700 font-semibold">Bienvenue {auth.user} !</span></Menu.Item>
{userNavigation.map((item) => (
<Menu.Item key={item.name}>
{({ active }) => (
<button
onClick={() => { item.action() }}
className={classNames(active ? 'bg-gray-100' : '', 'block px-4 py-2 text-sm text-gray-700 w-full')}
>
{item.name}
</button>
)}
</Menu.Item>
))}
</Menu.Items>
</Transition>
</Menu>
</div>
</div>
</div>
</div>
<main className="flex-1 relative overflow-y-auto focus:outline-none">
<div className="py-6">
{title && (
<div className="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mb-4">
<h1 className="text-2xl font-semibold text-gray-900">{title}</h1>
</div>
)}
{subTitle && (
<div className="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 -mt-4 mb-4">
<h1 className="text-xl font-normal text-gray-600">{subTitle}</h1>
</div>
)}
<Outlet />
</div>
</main>
<main className="flex-1 relative overflow-y-auto focus:outline-none">
<div className="py-6">
{title && (
<div className="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mb-4">
<h1 className="text-2xl font-semibold text-gray-900">{title}</h1>
</div>
)}
{subTitle && (
<div className="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 -mt-4 mb-4">
<h1 className="text-xl font-normal text-gray-600">{subTitle}</h1>
</div>
)}
<Outlet />
</div>
</main>
</div>
</div>
</div>
</RequireAuth>
);
};
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment