summaryrefslogtreecommitdiff
path: root/src/lib
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib')
-rw-r--r--src/lib/home/api/categoryManagementApi.js8
-rw-r--r--src/lib/home/components/CategoryDynamic.jsx99
-rw-r--r--src/lib/home/components/CategoryDynamicMobile.jsx97
3 files changed, 132 insertions, 72 deletions
diff --git a/src/lib/home/api/categoryManagementApi.js b/src/lib/home/api/categoryManagementApi.js
index 2ff4fdfc..4101f87a 100644
--- a/src/lib/home/api/categoryManagementApi.js
+++ b/src/lib/home/api/categoryManagementApi.js
@@ -42,3 +42,11 @@ const map = async (promotions) => {
return productMapped;
});
};
+
+export const fetchCategoryManagementVersion = async () => {
+ const response = await fetch(
+ '/solr/admin/cores?action=STATUS&core=category_management'
+ );
+ const data = await response.json();
+ return data.status.category_management.index.version;
+};
diff --git a/src/lib/home/components/CategoryDynamic.jsx b/src/lib/home/components/CategoryDynamic.jsx
index 49a9a93f..e62575f7 100644
--- a/src/lib/home/components/CategoryDynamic.jsx
+++ b/src/lib/home/components/CategoryDynamic.jsx
@@ -1,5 +1,8 @@
import React, { useEffect, useState, useCallback } from 'react';
-import { fetchCategoryManagementSolr } from '../api/categoryManagementApi';
+import {
+ fetchCategoryManagementSolr,
+ fetchCategoryManagementVersion,
+} from '../api/categoryManagementApi';
import NextImage from 'next/image';
import Link from 'next/link';
import { createSlug } from '@/core/utils/slug';
@@ -10,48 +13,69 @@ import 'swiper/css/navigation';
import 'swiper/css/pagination';
import { Pagination } from 'swiper';
+const saveToLocalStorage = (key, data, version) => {
+ const now = new Date();
+ const item = {
+ value: data,
+ version: version,
+ lastFetchedTime: now.getTime(),
+ };
+ localStorage.setItem(key, JSON.stringify(item));
+};
+
+const getFromLocalStorage = (key) => {
+ const itemStr = localStorage.getItem(key);
+ if (!itemStr) return null;
+
+ const item = JSON.parse(itemStr);
+ return item;
+};
+
+const getElapsedTime = (lastFetchedTime) => {
+ const now = new Date();
+ return now.getTime() - lastFetchedTime;
+};
+
const CategoryDynamic = () => {
const [categoryManagement, setCategoryManagement] = useState([]);
const [isLoading, setIsLoading] = useState(false);
+
const loadBrand = useCallback(async () => {
- setIsLoading(true);
- const items = await fetchCategoryManagementSolr();
+ const cachedData = getFromLocalStorage('homepage_categoryDynamic');
+
+ if (cachedData) {
+ // Hitung selisih waktu antara saat ini dengan waktu terakhir data di-fetch
+ const elapsedTime = getElapsedTime(cachedData.lastFetchedTime);
- setIsLoading(false);
- setCategoryManagement(items);
+ if (elapsedTime < 24 * 60 * 60 * 1000) {
+ setCategoryManagement(cachedData.value);
+ return;
+ }
+ }
+
+ const latestVersion = await fetchCategoryManagementVersion();
+ if (cachedData && cachedData.version === latestVersion) {
+ // perbarui waktu
+ saveToLocalStorage(
+ 'homepage_categoryDynamic',
+ cachedData.value,
+ latestVersion
+ );
+ setCategoryManagement(cachedData.value);
+ } else {
+ setIsLoading(true);
+ const items = await fetchCategoryManagementSolr();
+ setIsLoading(false);
+
+ saveToLocalStorage('homepage_categoryDynamic', items, latestVersion);
+ setCategoryManagement(items);
+ }
}, []);
useEffect(() => {
loadBrand();
}, [loadBrand]);
- // const [categoryData, setCategoryData] = useState({});
- // const [subCategoryData, setSubCategoryData] = useState({});
-
- // useEffect(() => {
- // const fetchCategoryData = async () => {
- // if (categoryManagement && categoryManagement.data) {
- // const updatedCategoryData = {};
- // const updatedSubCategoryData = {};
-
- // for (const category of categoryManagement.data) {
- // const countLevel1 = await odooApi('GET', `/api/v1/category/numFound?parent_id=${category.categoryIdI}`);
-
- // updatedCategoryData[category.categoryIdI] = countLevel1?.numFound;
-
- // for (const subCategory of countLevel1?.children) {
- // updatedSubCategoryData[subCategory.id] = subCategory?.numFound;
- // }
- // }
-
- // setCategoryData(updatedCategoryData);
- // setSubCategoryData(updatedSubCategoryData);
- // }
- // };
-
- // fetchCategoryData();
- // }, [categoryManagement.isLoading]);
-
const swiperBanner = {
modules: [Pagination],
classNames: 'mySwiper',
@@ -67,7 +91,6 @@ const CategoryDynamic = () => {
<div>
{categoryManagement &&
categoryManagement?.map((category) => {
- // const countLevel1 = categoryData[category.categoryIdI] || 0;
return (
<Skeleton key={category.id} isLoaded={!isLoading}>
<div key={category.id}>
@@ -75,9 +98,6 @@ const CategoryDynamic = () => {
<h1 className='font-semibold text-[14px] sm:text-h-lg mr-2'>
{category.name}
</h1>
- {/* <Skeleton isLoaded={countLevel1 != 0}>
- <p className={`text-gray_r-10 text-sm`}>{countLevel1} Produk tersedia</p>
- </Skeleton> */}
<Link
href={createSlug(
'/shop/category/',
@@ -93,8 +113,6 @@ const CategoryDynamic = () => {
{/* Swiper for SubCategories */}
<Swiper {...swiperBanner}>
{category.categories.map((subCategory) => {
- // const countLevel2 = subCategoryData[subCategory.idLevel2] || 0;
-
return (
<SwiperSlide key={subCategory.id}>
<div className='border rounded justify-start items-start '>
@@ -115,11 +133,6 @@ const CategoryDynamic = () => {
<h2 className='font-semibold text-lg mr-2'>
{subCategory?.name}
</h2>
- {/* <Skeleton isLoaded={countLevel2 != 0}>
- <p className={`text-gray_r-10 text-sm`}>
- {countLevel2} Produk tersedia
- </p>
- </Skeleton> */}
<Link
href={createSlug(
'/shop/category/',
diff --git a/src/lib/home/components/CategoryDynamicMobile.jsx b/src/lib/home/components/CategoryDynamicMobile.jsx
index 4a8f13cf..55654b0e 100644
--- a/src/lib/home/components/CategoryDynamicMobile.jsx
+++ b/src/lib/home/components/CategoryDynamicMobile.jsx
@@ -4,52 +4,91 @@ import Link from 'next/link';
import { createSlug } from '@/core/utils/slug';
import { Swiper, SwiperSlide } from 'swiper/react';
import 'swiper/css';
-import { fetchCategoryManagementSolr } from '../api/categoryManagementApi';
+import {
+ fetchCategoryManagementSolr,
+ fetchCategoryManagementVersion,
+} from '../api/categoryManagementApi';
+
+const saveToLocalStorage = (key, data, version) => {
+ const now = new Date();
+ const item = {
+ value: data,
+ version: version,
+ lastFetchedTime: now.getTime(),
+ };
+ localStorage.setItem(key, JSON.stringify(item));
+};
+
+const getFromLocalStorage = (key) => {
+ const itemStr = localStorage.getItem(key);
+ if (!itemStr) return null;
+
+ const item = JSON.parse(itemStr);
+ return item;
+};
+
+const getElapsedTime = (lastFetchedTime) => {
+ const now = new Date();
+ return now.getTime() - lastFetchedTime;
+};
const CategoryDynamicMobile = () => {
const [selectedCategory, setSelectedCategory] = useState({});
const [categoryManagement, setCategoryManagement] = useState([]);
const [isLoading, setIsLoading] = useState(false);
- const loadBrand = useCallback(async () => {
- setIsLoading(true);
- const items = await fetchCategoryManagementSolr();
+ const loadCategoryManagement = useCallback(async () => {
+ const cachedData = getFromLocalStorage('homepage_categoryDynamic');
+
+ if (cachedData) {
+ // Hitung selisih waktu antara saat ini dengan waktu terakhir data di-fetch
+ const elapsedTime = getElapsedTime(cachedData.lastFetchedTime);
+
+ if (elapsedTime < 24 * 60 * 60 * 1000) {
+ setCategoryManagement(cachedData.value);
+ return;
+ }
+ }
- setIsLoading(false);
- setCategoryManagement(items);
+ const latestVersion = await fetchCategoryManagementVersion();
+ if (cachedData && cachedData.version === latestVersion) {
+ // perbarui waktu
+ saveToLocalStorage(
+ 'homepage_categoryDynamic',
+ cachedData.value,
+ latestVersion
+ );
+ setCategoryManagement(cachedData.value);
+ } else {
+ setIsLoading(true);
+ const items = await fetchCategoryManagementSolr();
+ setIsLoading(false);
+
+ saveToLocalStorage('homepage_categoryDynamic', items, latestVersion);
+ setCategoryManagement(items);
+ }
}, []);
useEffect(() => {
- loadBrand();
- }, [loadBrand]);
+ loadCategoryManagement();
+ }, [loadCategoryManagement]);
useEffect(() => {
- const loadPromo = async () => {
- try {
- if (categoryManagement?.length > 0) {
- const initialSelections = categoryManagement.reduce(
- (acc, category) => {
- if (category.categories.length > 0) {
- acc[category.id] = category.categories[0].id_level_2;
- }
- return acc;
- },
- {}
- );
- setSelectedCategory(initialSelections);
+ if (categoryManagement?.length > 0) {
+ const initialSelections = categoryManagement.reduce((acc, category) => {
+ if (category.categories.length > 0) {
+ acc[category.id] = category.categories[0].id_level_2;
}
- } catch (loadError) {
- // console.error("Error loading promo items:", loadError);
- }
- };
-
- loadPromo();
+ return acc;
+ }, {});
+ setSelectedCategory(initialSelections);
+ }
}, [categoryManagement]);
- const handleCategoryLevel2Click = (categoryIdI, idLevel2) => {
+ const handleCategoryLevel2Click = (categoryId, idLevel2) => {
setSelectedCategory((prev) => ({
...prev,
- [categoryIdI]: idLevel2,
+ [categoryId]: idLevel2,
}));
};