summaryrefslogtreecommitdiff
path: root/src/lib
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib')
-rw-r--r--src/lib/checkout/api/getVoucher.js18
-rw-r--r--src/lib/checkout/components/Checkout.jsx6
-rw-r--r--src/lib/flashSale/components/FlashSale.jsx13
-rw-r--r--src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx36
-rw-r--r--src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx22
-rw-r--r--src/lib/product/components/ProductCard.jsx2
6 files changed, 79 insertions, 18 deletions
diff --git a/src/lib/checkout/api/getVoucher.js b/src/lib/checkout/api/getVoucher.js
index 57d8acf5..07cf376e 100644
--- a/src/lib/checkout/api/getVoucher.js
+++ b/src/lib/checkout/api/getVoucher.js
@@ -1,11 +1,21 @@
import odooApi from '@/core/api/odooApi'
-export const getVoucher = async (id) => {
- const dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher`)
+export const getVoucher = async (id, source) => {
+ let dataVoucher = null
+ if(source){
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?source=${source}`)
+ }else {
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher`)
+ }
return dataVoucher
}
-export const findVoucher = async (code, id) => {
- const dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}`)
+export const findVoucher = async (code, id, source) => {
+ let dataVoucher = null
+ if(source){
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}&source=${source}`)
+ }else{
+ dataVoucher = await odooApi('GET', `/api/v1/user/${id}/voucher?code=${code}`)
+ }
return dataVoucher
}
diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index 53ac63e1..c6ea73f2 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -107,7 +107,7 @@ const Checkout = () => {
const voucher = async () => {
if (!listVouchers) {
try {
- let dataVoucher = await getVoucher(auth?.id)
+ let dataVoucher = await getVoucher(auth?.id, query)
SetListVoucher(dataVoucher)
} finally {
setLoadingVoucher(false)
@@ -115,7 +115,7 @@ const Checkout = () => {
}
}
const VoucherCode = async (code) => {
- let dataVoucher = await findVoucher(code, auth.id)
+ let dataVoucher = await findVoucher(code, auth.id, query)
if (dataVoucher.length <= 0) {
SetFindVoucher(1)
return
@@ -427,7 +427,7 @@ const Checkout = () => {
<hr className='mt-10 my-4 border-gray_r-10' />
<div className=''>
- {!loadingVoucher && listVouchers.length === 0 ? (
+ {!loadingVoucher && listVouchers?.length === 0 ? (
<div className='flex items-center justify-center mt-4 mb-4'>
<div className='text-center'>
<h1 className='font-bold mb-4'>Tidak ada voucher tersedia</h1>
diff --git a/src/lib/flashSale/components/FlashSale.jsx b/src/lib/flashSale/components/FlashSale.jsx
index e4a4a25c..87545d8d 100644
--- a/src/lib/flashSale/components/FlashSale.jsx
+++ b/src/lib/flashSale/components/FlashSale.jsx
@@ -1,21 +1,28 @@
import { useEffect, useState } from 'react'
import flashSaleApi from '../api/flashSaleApi'
-import Image from '@/core/components/elements/Image/Image'
+import Image from 'next/image'
import CountDown from '@/core/components/elements/CountDown/CountDown'
import productSearchApi from '@/lib/product/api/productSearchApi'
import ProductSlider from '@/lib/product/components/ProductSlider'
+import { FlashSaleSkeleton } from '../skeleton/FlashSaleSkeleton'
const FlashSale = () => {
const [flashSales, setFlashSales] = useState(null)
+ const [isLoading, setIsLoading] = useState(true)
useEffect(() => {
const loadFlashSales = async () => {
const dataFlashSales = await flashSaleApi()
setFlashSales(dataFlashSales)
+ setIsLoading(false)
}
loadFlashSales()
}, [])
+ if (isLoading) {
+ return <FlashSaleSkeleton />
+ }
+
return (
flashSales?.length > 0 && (
<div className='px-4 sm:px-0 grid grid-cols-1 gap-y-8'>
@@ -30,11 +37,15 @@ const FlashSale = () => {
<Image
src={flashSale.banner}
alt={flashSale.name}
+ width={1080}
+ height={192}
className='w-full rounded mb-4 hidden sm:block'
/>
<Image
src={flashSale.bannerMobile}
alt={flashSale.name}
+ width={256}
+ height={48}
className='w-full rounded mb-4 block sm:hidden'
/>
<FlashSaleProduct flashSaleId={flashSale.pricelistId} />
diff --git a/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx b/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx
new file mode 100644
index 00000000..e9a200d9
--- /dev/null
+++ b/src/lib/flashSale/skeleton/FlashSaleSkeleton.jsx
@@ -0,0 +1,36 @@
+import useDevice from '@/core/hooks/useDevice'
+import PopularProductSkeleton from '@/lib/home/components/Skeleton/PopularProductSkeleton'
+import Skeleton from 'react-loading-skeleton'
+
+const FlashSaleSkeleton = () => {
+ return (
+ <div className='px-4 md:px-0'>
+ <TitleSkeleton />
+ <div className='my-4'>
+ <BannerSkeleton />
+ </div>
+ <PopularProductSkeleton />
+ </div>
+ )
+}
+
+const TitleSkeleton = () => {
+ return (
+ <div className='w-full md:w-[36%] flex gap-x-4'>
+ <Skeleton containerClassName='block w-1/2' height={24} />
+ <div className='w-1/2 flex gap-x-1'>
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ <Skeleton height={40} containerClassName='w-full' />
+ </div>
+ </div>
+ )
+}
+
+const BannerSkeleton = () => {
+ const { isDesktop } = useDevice()
+ return <Skeleton duration={1.2} height={isDesktop ? 192 : 48} containerClassName='w-full' />
+}
+
+export { FlashSaleSkeleton, TitleSkeleton, BannerSkeleton }
diff --git a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
index 00589342..bd783053 100644
--- a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
+++ b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
@@ -1,12 +1,16 @@
-import BrandSkeleton from '@/core/components/elements/Skeleton/BrandSkeleton'
+import useDevice from '@/core/hooks/useDevice'
+import Skeleton from 'react-loading-skeleton'
-const PreferredBrandSkeleton = () => (
- <div className='grid grid-cols-4 gap-x-3'>
- <BrandSkeleton />
- <BrandSkeleton />
- <BrandSkeleton />
- <BrandSkeleton />
- </div>
-)
+const PreferredBrandSkeleton = () => {
+ const { isDesktop } = useDevice()
+
+ return (
+ <div className='grid grid-cols-4 md:grid-cols-8 gap-x-3'>
+ {Array.from({ length: isDesktop ? 8 : 4 }, (_, index) => (
+ <Skeleton count={1} height={isDesktop ? 84 : 56} key={index} />
+ ))}
+ </div>
+ )
+}
export default PreferredBrandSkeleton
diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx
index d33516dd..5b859905 100644
--- a/src/lib/product/components/ProductCard.jsx
+++ b/src/lib/product/components/ProductCard.jsx
@@ -29,7 +29,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
if (variant == 'vertical') {
return (
- <div className='rounded shadow-sm border border-gray_r-4 bg-white h-[350px] w-[165px]'>
+ <div className='rounded shadow-sm border border-gray_r-4 bg-white h-[300px] md:h-[350px]'>
<Link
href={createSlug('/shop/product/', product?.name, product?.id)}
className='border-b border-gray_r-4 relative'
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 06:27:49 +0000