summaryrefslogtreecommitdiff
path: root/src/core
diff options
context:
space:
mode:
Diffstat (limited to 'src/core')
-rw-r--r--src/core/api/odooApi.js2
-rw-r--r--src/core/components/elements/Appbar/Appbar.jsx65
-rw-r--r--src/core/components/elements/Footer/BasicFooter.jsx11
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx117
-rw-r--r--src/core/components/elements/Navbar/NavbarMobile.jsx4
-rw-r--r--src/core/components/elements/Navbar/NavbarUserDropdown.jsx31
-rw-r--r--src/core/components/elements/Navbar/TopBanner.jsx35
-rw-r--r--src/core/components/elements/Sidebar/Sidebar.jsx193
-rw-r--r--src/core/components/layouts/AppLayout.jsx16
9 files changed, 272 insertions, 202 deletions
diff --git a/src/core/api/odooApi.js b/src/core/api/odooApi.js
index 3349ff4b..504d097a 100644
--- a/src/core/api/odooApi.js
+++ b/src/core/api/odooApi.js
@@ -64,7 +64,7 @@ const odooApi = async (method, url, data = {}, headers = {}) => {
}
return camelcaseObjectDeep(res.data.result) || [];
} catch (error) {
- console.log(error);
+ // console.log(error);
}
};
diff --git a/src/core/components/elements/Appbar/Appbar.jsx b/src/core/components/elements/Appbar/Appbar.jsx
index 16bccbd5..e9abe657 100644
--- a/src/core/components/elements/Appbar/Appbar.jsx
+++ b/src/core/components/elements/Appbar/Appbar.jsx
@@ -1,8 +1,16 @@
-import { useRouter } from 'next/router'
-import Link from '../Link/Link'
-import { HomeIcon, Bars3Icon, ShoppingCartIcon, ChevronLeftIcon } from '@heroicons/react/24/outline'
-import { useEffect, useState } from 'react'
-import { getCart, getCountCart } from '@/core/utils/cart'
+import { useRouter } from 'next/router';
+import Link from '../Link/Link';
+import {
+ HomeIcon,
+ Bars3Icon,
+ ShoppingCartIcon,
+ ChevronLeftIcon,
+} from '@heroicons/react/24/outline';
+import { useEffect, useState } from 'react';
+import { getCart, getCountCart } from '@/core/utils/cart';
+import useTransactions from '@/lib/transaction/hooks/useTransactions';
+import { useCartStore } from '~/modules/cart/stores/useCartStore';
+import useAuth from '@/core/hooks/useAuth';
/**
* The AppBar component is a navigation component used to display a header or toolbar
@@ -13,26 +21,31 @@ import { getCart, getCountCart } from '@/core/utils/cart'
* @returns {JSX.Element} - Rendered AppBar component.
*/
const AppBar = ({ title }) => {
- const router = useRouter()
-
- const [cartCount, setCartCount] = useState(0)
-
+ const router = useRouter();
+ const auth = useAuth();
+ const { cart } = useCartStore();
+ const query = {
+ context: 'quotation',
+ site: auth?.webRole === null && auth?.site ? auth.site : null,
+ };
+ const [cartCount, setCartCount] = useState(0);
+ const { transactions } = useTransactions({ query });
useEffect(() => {
const handleCartChange = () => {
const cart = async () => {
- const listCart = await getCountCart()
- setCartCount(listCart)
- }
- cart()
- }
- handleCartChange()
+ const listCart = await getCountCart();
+ setCartCount(listCart);
+ };
+ cart();
+ };
+ handleCartChange();
- window.addEventListener('localStorageChange', handleCartChange)
+ window.addEventListener('localStorageChange', handleCartChange);
return () => {
- window.removeEventListener('localStorageChange', handleCartChange)
- }
- }, [])
+ window.removeEventListener('localStorageChange', handleCartChange);
+ };
+ }, [transactions.data, cart]);
return (
<nav className='sticky top-0 z-50 bg-white border-b border-gray_r-6 flex justify-between'>
@@ -46,9 +59,11 @@ const AppBar = ({ title }) => {
<Link href='/shop/cart' className='py-4 px-2'>
<div className='relative'>
<ShoppingCartIcon className='w-6 text-gray_r-12' />
- <span className='absolute -top-2 -right-2 badge-solid-red rounded-full w-5 h-5 flex items-center justify-center'>
- {cartCount}
- </span>
+ {cartCount > 0 && (
+ <span className='absolute -top-2 -right-2 badge-solid-red rounded-full w-5 h-5 flex items-center justify-center'>
+ {cartCount}
+ </span>
+ )}
</div>
</Link>
<Link href='/' className='py-4 px-2'>
@@ -59,7 +74,7 @@ const AppBar = ({ title }) => {
</Link>
</div>
</nav>
- )
-}
+ );
+};
-export default AppBar
+export default AppBar;
diff --git a/src/core/components/elements/Footer/BasicFooter.jsx b/src/core/components/elements/Footer/BasicFooter.jsx
index 4beea604..4688b15b 100644
--- a/src/core/components/elements/Footer/BasicFooter.jsx
+++ b/src/core/components/elements/Footer/BasicFooter.jsx
@@ -210,6 +210,11 @@ const CustomerGuide = () => (
Panduan Pick Up Service
</InternalItemLink>
</li>
+ <li>
+ <InternalItemLink href='/tracking-order'>
+ Tracking Order
+ </InternalItemLink>
+ </li>
</ul>
</div>
);
@@ -390,7 +395,7 @@ const Payments = () => (
alt='Metode Pembayaran - Indoteknik'
width={512}
height={512}
- quality={100}
+ quality={85}
className='w-full'
/>
</div>
@@ -404,7 +409,7 @@ const Shippings = () => (
alt='Jasa Pengiriman - Indoteknik'
width={512}
height={512}
- quality={100}
+ quality={85}
className='w-full'
/>
</div>
@@ -418,7 +423,7 @@ const Secures = () => (
alt='Keamanan Belanja - Indoteknik'
width={512}
height={512}
- quality={100}
+ quality={85}
className='w-full'
/>
</div>
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 2ddf5efe..eebfbcd5 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -5,7 +5,9 @@ import { createSlug } from '@/core/utils/slug';
import whatsappUrl from '@/core/utils/whatsappUrl';
import IndoteknikLogo from '@/images/logo.png';
import Cardheader from '@/lib/cart/components/Cartheader';
+import Quotationheader from '../../../../../src/lib/quotation/components/Quotationheader.jsx';
import Category from '@/lib/category/components/Category';
+import { useProductCartContext } from '@/contexts/ProductCartContext';
import {
ChevronDownIcon,
DocumentCheckIcon,
@@ -28,7 +30,9 @@ import {
MenuList,
useDisclosure,
} from '@chakra-ui/react';
-import style from "./style/NavbarDesktop.module.css";
+import style from './style/NavbarDesktop.module.css';
+import useTransactions from '@/lib/transaction/hooks/useTransactions';
+import { useCartStore } from '~/modules/cart/stores/useCartStore';
const Search = dynamic(() => import('./Search'), { ssr: false });
const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false });
@@ -38,16 +42,27 @@ const NavbarDesktop = () => {
const auth = useAuth();
const [cartCount, setCartCount] = useState(0);
-
+ const [quotationCount, setQuotationCount] = useState(0);
+ const [pendingTransactions, setPendingTransactions] = useState([]);
const [templateWA, setTemplateWA] = useState(null);
const [payloadWA, setPayloadWa] = useState(null);
const [urlPath, setUrlPath] = useState(null);
-
+ const { loadCart, cart, summary, updateCartItem } = useCartStore();
const router = useRouter();
const { product } = useProductContext();
const { isOpen, onOpen, onClose } = useDisclosure();
+ const query = {
+ context: 'quotation',
+ site: auth?.webRole === null && auth?.site ? auth.site : null,
+ };
+
+ const { transactions } = useTransactions({ query });
+ const data = transactions?.data?.saleOrders.filter(
+ (transaction) => transaction.status === 'draft'
+ );
+
const [showPopup, setShowPopup] = useState(false);
const [isTop, setIsTop] = useState(true);
@@ -89,6 +104,10 @@ const NavbarDesktop = () => {
}, []);
useEffect(() => {
+ setPendingTransactions(data);
+ }, [transactions.data]);
+
+ useEffect(() => {
if (router.pathname === '/shop/product/[slug]') {
setPayloadWa({
name: product?.name,
@@ -116,7 +135,23 @@ const NavbarDesktop = () => {
return () => {
window.removeEventListener('localStorageChange', handleCartChange);
};
- }, []);
+ }, [transactions.data, cart]);
+
+ useEffect(() => {
+ const handleQuotationChange = () => {
+ const quotation = async () => {
+ setQuotationCount(pendingTransactions?.length);
+ };
+ quotation();
+ };
+ handleQuotationChange();
+
+ window.addEventListener('localStorageChange', handleQuotationChange);
+
+ return () => {
+ window.removeEventListener('localStorageChange', handleQuotationChange);
+ };
+ }, [pendingTransactions]);
return (
<DesktopView>
@@ -137,7 +172,7 @@ const NavbarDesktop = () => {
>
<div className='flex gap-x-1'>
<div>Fitur Layanan </div>
- <ChevronDownIcon className='w-5'/>
+ <ChevronDownIcon className='w-5' />
</div>
</MenuButton>
<MenuList
@@ -180,17 +215,10 @@ const NavbarDesktop = () => {
<Search />
</div>
<div className='flex gap-x-4 items-center'>
- <Link
- href='/my/transactions'
- target='_blank'
- rel='noreferrer'
- className='flex items-center gap-x-2 !text-gray_r-12/80'
- >
- <DocumentCheckIcon className='w-7' />
- Daftar
- <br />
- Quotation
- </Link>
+ <Quotationheader
+ quotationCount={quotationCount}
+ data={pendingTransactions}
+ />
<Cardheader cartCount={cartCount} />
@@ -225,8 +253,7 @@ const NavbarDesktop = () => {
<div className='container mx-auto mt-6'>
<div className='flex'>
- <button
- type='button'
+ <div
onClick={() => setIsOpenCategory((isOpen) => !isOpen)}
onBlur={() => setIsOpenCategory(false)}
className='w-3/12 p-4 font-semibold border border-gray_r-6 rounded-t-xl flex items-center relative'
@@ -243,31 +270,32 @@ const NavbarDesktop = () => {
>
<Category />
</div>
- </button>
+ </div>
<div className='w-6/12 flex px-1 divide-x divide-gray_r-6'>
-
- <Link
- href="/shop/promo"
+ <Link
+ href='/shop/promo'
className={`${
router.asPath === '/shop/promo' && 'bg-gray_r-3'
} flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition group relative`} // Added relative position
- target="_blank"
- rel="noreferrer"
+ target='_blank'
+ rel='noreferrer'
>
- {showPopup && (
- <div className='w-full h-full relative justify-end items-start'>
+ {showPopup && (
+ <div className='w-full h-full relative justify-end items-start'>
<Image
- src='/images/penawaran-terbatas.jpg'
- alt='penawaran terbatas'
- width={1440}
- height={160}
- quality={100}
- // className={`fixed ${isTop ? 'md:top-[145px] lg:top-[160px] ' : 'lg:top-[85px] top-[80px]'} rounded-3xl md:left-1/4 lg:left-1/4 xl:left-1/4 left-2/3 w-40 h-12 p-2 z-50 transition-all duration-300 animate-pulse`}
- className={`inline-block relative -top-8 transition-all duration-300 z-20 animate-pulse`}
- />
+ src='/images/penawaran-terbatas.jpg'
+ alt='penawaran terbatas'
+ width={1440}
+ height={160}
+ quality={100}
+ // className={`fixed ${isTop ? 'md:top-[145px] lg:top-[160px] ' : 'lg:top-[85px] top-[80px]'} rounded-3xl md:left-1/4 lg:left-1/4 xl:left-1/4 left-2/3 w-40 h-12 p-2 z-50 transition-all duration-300 animate-pulse`}
+ className={`inline-block relative -top-8 transition-all duration-300 z-20 animate-pulse`}
+ />
</div>
- )}
- <p className="absolute inset-0 flex justify-center items-center group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200 z-10">Semua Promo</p>
+ )}
+ <span className='absolute inset-0 flex justify-center items-center group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200 z-10'>
+ Semua Promo
+ </span>
</Link>
{/* {showPopup && router.pathname === '/' && (
<div className={`fixed ${isTop ? 'top-[170px]' : 'top-[90px]'} rounded-3xl left-[700px] w-fit object-center bg-green-50 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20 text-center p-2 z-50 transition-all duration-300`}>
@@ -276,28 +304,31 @@ const NavbarDesktop = () => {
</p>
</div>
)} */}
-
<Link
href='/shop/brands'
- className={`${
+ className={`${
router.asPath === '/shop/brands' && 'bg-gray_r-3'
} p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition group`}
target='_blank'
rel='noreferrer'
>
- <p className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Semua Brand</p>
+ <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+ Semua Brand
+ </span>
</Link>
<Link
href='/shop/search?orderBy=stock'
className={`${
- router.asPath === '/shop/search?orderBy=stock' &&
+ router.asPath.includes('/shop/search?orderBy=stock') &&
'bg-gray_r-3'
} p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition group`}
target='_blank'
rel='noreferrer'
>
- <p className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Ready Stock</p>
+ <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+ Ready Stock
+ </span>
</Link>
<Link
href='https://blog.indoteknik.com/'
@@ -305,7 +336,9 @@ const NavbarDesktop = () => {
target='_blank'
rel='noreferrer noopener'
>
- <p className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Blog Indoteknik</p>
+ <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+ Blog Indoteknik
+ </span>
</Link>
{/* <Link
href='/video'
diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx
index bcf45e0a..90314671 100644
--- a/src/core/components/elements/Navbar/NavbarMobile.jsx
+++ b/src/core/components/elements/Navbar/NavbarMobile.jsx
@@ -11,7 +11,7 @@ import Image from 'next/image';
import { useEffect, useState } from 'react';
import MobileView from '../../views/MobileView';
import Link from '../Link/Link';
-// import TopBanner from './TopBanner';
+import TopBanner from './TopBanner';
const Search = dynamic(() => import('./Search'));
@@ -39,7 +39,7 @@ const NavbarMobile = () => {
return (
<MobileView>
- {/* <TopBanner /> */}
+ <TopBanner />
<nav className='px-4 py-2 pb-3 sticky top-0 z-50 bg-white shadow'>
<div className='flex justify-between items-center mb-2'>
<Link href='/'>
diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
index 42bdc12a..c0698b6e 100644
--- a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
+++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
@@ -1,37 +1,38 @@
-import { deleteAuth } from '@/core/utils/auth'
-import Link from '../Link/Link'
-import { useRouter } from 'next/router'
-import { signOut, useSession } from 'next-auth/react'
-import useAuth from '@/core/hooks/useAuth'
+import { deleteAuth } from '@/core/utils/auth';
+import Link from '../Link/Link';
+import { useRouter } from 'next/router';
+import { signOut, useSession } from 'next-auth/react';
+import useAuth from '@/core/hooks/useAuth';
const NavbarUserDropdown = () => {
- const router = useRouter()
- const atuh = useAuth()
+ const router = useRouter();
+ const atuh = useAuth();
const logout = async () => {
deleteAuth().then(() => {
- router.push('/login')
- })
- }
+ router.push('/login');
+ });
+ };
return (
<div className='navbar-user-dropdown-wrapper'>
<div className='navbar-user-dropdown'>
+ <Link href='/my/profile'>Profil Saya</Link>
<Link href='/my/quotations'>Daftar Quotation</Link>
<Link href='/my/transactions'>Daftar Transaksi</Link>
<Link href='/my/shipments'>Daftar Pengiriman</Link>
<Link href='/my/invoices'>Invoice & Faktur Pajak</Link>
<Link href='/my/wishlist'>Wishlist</Link>
<Link href='/my/address'>Daftar Alamat</Link>
- {!atuh?.external &&
+ {!atuh?.external && (
<Link href='/my/recomendation'>Dashboard Recomendation</Link>
- }
+ )}
<button type='button' onClick={logout}>
Keluar Akun
</button>
</div>
</div>
- )
-}
+ );
+};
-export default NavbarUserDropdown
+export default NavbarUserDropdown;
diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx
index 7bc8fb6a..f438ae67 100644
--- a/src/core/components/elements/Navbar/TopBanner.jsx
+++ b/src/core/components/elements/Navbar/TopBanner.jsx
@@ -1,19 +1,20 @@
import Image from 'next/image';
-import { useQuery } from 'react-query';
-
+import { useQuery } from 'react-query';import useDevice from '@/core/hooks/useDevice'
import odooApi from '@/core/api/odooApi';
import SmoothRender from '~/components/ui/smooth-render';
import Link from '../Link/Link';
+import { background } from '@chakra-ui/react';
import { useEffect } from 'react';
-const TopBanner = ({ onLoad }) => {
+const TopBanner = ({ onLoad = () => {} }) => {
+ const { isDesktop, isMobile } = useDevice()
const topBanner = useQuery({
queryKey: 'topBanner',
queryFn: async () => await odooApi('GET', '/api/v1/banner?type=top-banner'),
refetchOnWindowFocus: false,
});
- const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent';
+ // const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent';
const hasData = topBanner.data?.length > 0;
const data = topBanner.data?.[0] || null;
@@ -26,21 +27,21 @@ const TopBanner = ({ onLoad }) => {
return (
<SmoothRender
isLoaded={hasData}
- height='36px'
+ // height='36px'
duration='700ms'
delay='300ms'
- style={{ backgroundColor }}
- >
- <Link href={data?.url}>
- <Image
- src={data?.image}
- alt={data?.name}
- width={1440}
- height={40}
- className='object-cover object-center h-full mx-auto'
- />
- </Link>
- </SmoothRender>
+ className='h-auto'
+ >
+ <Link
+ href={data?.url}
+ className="block bg-cover bg-center h-3 md:h-6 lg:h-[36px]"
+ style={{
+ backgroundImage: `url('${data?.image}')`,
+ }}
+ >
+ </Link>
+
+ </SmoothRender>
);
};
diff --git a/src/core/components/elements/Sidebar/Sidebar.jsx b/src/core/components/elements/Sidebar/Sidebar.jsx
index 55838890..ddae3e20 100644
--- a/src/core/components/elements/Sidebar/Sidebar.jsx
+++ b/src/core/components/elements/Sidebar/Sidebar.jsx
@@ -5,6 +5,8 @@ import { AnimatePresence, motion } from 'framer-motion'
import { ChevronDownIcon, ChevronUpIcon, CogIcon, UserIcon } from '@heroicons/react/24/outline'
import { Fragment, useEffect, useState } from 'react'
import odooApi from '@/core/api/odooApi'
+import { createSlug } from '@/core/utils/slug'
+import Image from 'next/image'
const Sidebar = ({ active, close }) => {
const auth = useAuth()
@@ -79,7 +81,7 @@ const Sidebar = ({ active, close }) => {
exit={{ left: '-80%' }}
transition={transition}
>
- <div className='divide-y divide-gray_r-6'>
+ <div className='divide-y divide-gray_r-6 h-full flex flex-col'>
<div className='p-4 flex gap-x-3'>
{!auth && (
<>
@@ -112,104 +114,115 @@ const Sidebar = ({ active, close }) => {
href='/my/menu'
className='!text-gray_r-11 ml-auto my-auto'
>
- <UserIcon class='h-6 w-6 text-gray-500' />
+ <UserIcon className='h-6 w-6 text-gray-500' />
</Link>
</>
)}
</div>
- <SidebarLink className={itemClassName} href='/shop/promo'>
- Semua Promo
- </SidebarLink>
- <SidebarLink className={itemClassName} href='/shop/brands'>
- Semua Brand
- </SidebarLink>
- <SidebarLink
- className={itemClassName}
- href='https://blog.indoteknik.com/'
- target='_blank'
- rel='noreferrer noopener'
- >
- Blog Indoteknik
- </SidebarLink>
- {/* <SidebarLink className={itemClassName} href='/video'>
- Indoteknik TV
- </SidebarLink> */}
- <SidebarLink className={itemClassName} href='/tentang-kami'>
- Tentang Indoteknik
- </SidebarLink>
- <SidebarLink className={itemClassName} href='/contact-us'>
- Hubungi Kami
- </SidebarLink>
- <button
- className={`${itemClassName} w-full text-left flex`}
- onClick={() => setOpenCategory(!isOpenCategory)}
- >
- Kategori
- <div className='ml-auto'>
- {!isOpenCategory && <ChevronDownIcon className='text-gray_r-12 w-5' />}
- {isOpenCategory && <ChevronUpIcon className='text-gray_r-12 w-5' />}
- </div>
- </button>
- {isOpenCategory &&
- categories.map((category) => (
- <Fragment key={category.id}>
- <div className='flex w-full text-gray_r-11 border-b border-gray_r-6 px-4 pl-8 items-center'>
- <Link
- href={`/shop/search?category=${category.name}`}
- className='flex-1 font-normal !text-gray_r-11 py-4'
- >
- {category.name}
- </Link>
- <div
- className='ml-4 h-full py-4'
- onClick={() => toggleCategories(category.id)}
- >
- {!category.isOpen && <ChevronDownIcon className='text-gray_r-11 w-5' />}
- {category.isOpen && <ChevronUpIcon className='text-gray_r-11 w-5' />}
+ <div className='overflow-y-auto flex-1'>
+ <SidebarLink className={itemClassName} href='/shop/promo'>
+ Semua Promo
+ </SidebarLink>
+ <SidebarLink className={itemClassName} href='/shop/brands'>
+ Semua Brand
+ </SidebarLink>
+ <SidebarLink
+ className={itemClassName}
+ href='https://blog.indoteknik.com/'
+ target='_blank'
+ rel='noreferrer noopener'
+ >
+ Blog Indoteknik
+ </SidebarLink>
+ {/* <SidebarLink className={itemClassName} href='/video'>
+ Indoteknik TV
+ </SidebarLink> */}
+ <SidebarLink className={itemClassName} href='/tentang-kami'>
+ Tentang Indoteknik
+ </SidebarLink>
+ <SidebarLink className={itemClassName} href='/contact-us'>
+ Hubungi Kami
+ </SidebarLink>
+ <button
+ className={`${itemClassName} w-full text-left flex`}
+ onClick={() => setOpenCategory(!isOpenCategory)}
+ >
+ Kategori
+ <div className='ml-auto'>
+ {!isOpenCategory && <ChevronDownIcon className='text-gray_r-12 w-5' />}
+ {isOpenCategory && <ChevronUpIcon className='text-gray_r-12 w-5' />}
+ </div>
+ </button>
+ {isOpenCategory &&
+ categories.map((category) => (
+ <Fragment key={category.id}>
+ <div className='flex w-full text-gray_r-11 border-b border-gray_r-6 px-4 pl-8 items-center'>
+ <Link
+ href={createSlug('/shop/category/', category.name, category.id)}
+ className='flex-1 font-normal !text-gray_r-11 py-4 flex items-center flex-row'
+ >
+ <div className='mr-2 flex justify-center items-center'>
+ <Image src={category.image} alt='' width={25} height={25} />
+ </div>
+ {category.name}
+ </Link>
+ <div
+ className='ml-4 h-full py-4'
+ onClick={() => toggleCategories(category.id)}
+ >
+ {!category.isOpen && <ChevronDownIcon className='text-gray_r-11 w-5' />}
+ {category.isOpen && <ChevronUpIcon className='text-gray_r-11 w-5' />}
+ </div>
</div>
- </div>
- {category.isOpen &&
- category.childs.map((child1Category) => (
- <Fragment key={child1Category.id}>
- <div
- className={`flex w-full !text-gray_r-11 border-b border-gray_r-6 p-4 pl-12 ${
- category.isOpen ? 'bg-gray_r-2' : ''
- }`}
- >
- <Link
- href={`/shop/search?category=${child1Category.name}`}
- className='flex-1 font-normal !text-gray_r-11'
+ {category.isOpen &&
+ category.childs.map((child1Category) => (
+ <Fragment key={child1Category.id}>
+ <div
+ className={`flex w-full !text-gray_r-11 border-b border-gray_r-6 p-4 pl-12 ${
+ category.isOpen ? 'bg-gray_r-2' : ''
+ }`}
>
- {child1Category.name}
- </Link>
- {child1Category.childs.length > 0 && (
- <div
- className='ml-4 h-full'
- onClick={() => toggleCategories(child1Category.id)}
- >
- {!child1Category.isOpen && (
- <ChevronDownIcon className='text-gray_r-11 w-5' />
- )}
- {child1Category.isOpen && (
- <ChevronUpIcon className='text-gray_r-11 w-5' />
- )}
- </div>
- )}
- </div>
- {child1Category.isOpen &&
- child1Category.childs.map((child2Category) => (
<Link
- key={child2Category.id}
- href={`/shop/search?category=${child2Category.name}`}
- className='flex w-full font-normal !text-gray_r-11 border-b border-gray_r-6 p-4 pl-16'
+ href={createSlug('/shop/category/', child1Category.name, child1Category.id)}
+ className='flex-1 font-normal !text-gray_r-11 flex flex-row items-center'
>
- {child2Category.name}
+ <div className='mr-2 flex justify-center items-center'>
+ <Image src={`https://erp.indoteknik.com/api/image/product.public.category/image_1920/${child1Category.id}`} alt='' width={25} height={25} />
+ </div>
+ {child1Category.name}
</Link>
- ))}
- </Fragment>
- ))}
- </Fragment>
- ))}
+ {child1Category.childs.length > 0 && (
+ <div
+ className='ml-4 h-full'
+ onClick={() => toggleCategories(child1Category.id)}
+ >
+ {!child1Category.isOpen && (
+ <ChevronDownIcon className='text-gray_r-11 w-5' />
+ )}
+ {child1Category.isOpen && (
+ <ChevronUpIcon className='text-gray_r-11 w-5' />
+ )}
+ </div>
+ )}
+ </div>
+ {child1Category.isOpen &&
+ child1Category.childs.map((child2Category) => (
+ <Link
+ key={child2Category.id}
+ href={createSlug('/shop/category/', child2Category.name, child2Category.id)}
+ className='flex w-full font-normal !text-gray_r-11 border-b border-gray_r-6 p-4 pl-16 flex-row'
+ >
+ <div className='mr-2 flex justify-center items-center'>
+ <Image src={`https://erp.indoteknik.com/api/image/product.public.category/image_1920/${child2Category.id}`} alt='' width={25} height={25} />
+ </div>
+ {child2Category.name}
+ </Link>
+ ))}
+ </Fragment>
+ ))}
+ </Fragment>
+ ))}
+ </div>
</div>
</motion.div>
</>
diff --git a/src/core/components/layouts/AppLayout.jsx b/src/core/components/layouts/AppLayout.jsx
index ebbc1ad5..ec61ca06 100644
--- a/src/core/components/layouts/AppLayout.jsx
+++ b/src/core/components/layouts/AppLayout.jsx
@@ -10,13 +10,15 @@ const BasicFooter = dynamic(() => import('../elements/Footer/BasicFooter'), {
const AppLayout = ({ children, title, withFooter = true }) => {
return (
- <>
- <AnimationLayout>
- <AppBar title={title} />
- {children}
- </AnimationLayout>
- {withFooter && <BasicFooter />}
- </>
+ <div className='flex flex-col min-h-screen max-h-screen overflow-y-auto'>
+ <AppBar title={title} />
+ <div className='flex-grow p-4'>{children}</div>
+ {withFooter && (
+ <div className='mt-auto'>
+ <BasicFooter />
+ </div>
+ )}
+ </div>
);
};
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 02:18:45 +0000