From bfeb27c25e416db41e211de54e7f7d0cac4ad792 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Mon, 24 Jun 2024 09:13:24 +0700 Subject: update all promotion add zustand --- src-migrate/modules/promo/components/PromoList.jsx | 35 ++++++++++++---------- src-migrate/modules/promo/components/promoStore.js | 16 ++++++++++ src-migrate/pages/shop/promo/index.tsx | 2 +- 3 files changed, 36 insertions(+), 17 deletions(-) create mode 100644 src-migrate/modules/promo/components/promoStore.js diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx index 9b1a30a4..a21ba188 100644 --- a/src-migrate/modules/promo/components/PromoList.jsx +++ b/src-migrate/modules/promo/components/PromoList.jsx @@ -1,16 +1,25 @@ -import React, { useState, useEffect } from 'react'; +import React, { useEffect } from 'react'; import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card'; import { fetchPromoItemsSolr } from '../../../../src/api/promoApi'; import { Swiper, SwiperSlide } from 'swiper/react'; import useDevice from '@/core/hooks/useDevice'; -import LogoSpinner from '../../../../src/core/components/elements/Spinner/LogoSpinner' +import LogoSpinner from '../../../../src/core/components/elements/Spinner/LogoSpinner'; +import usePromoStore from './promoStore'; // Adjust the path accordingly const PromoList = ({ selectedPromo }) => { - const [title, setTitle] = useState(''); - const [slug, setSlug] = useState(''); - const [promoItems, setPromoItems] = useState([]); - const [promoData, setPromoData] = useState([]); - const [isLoading, setIsLoading] = useState(true); + const { + title, + slug, + promoItems, + promoData, + isLoading, + setTitle, + setSlug, + setPromoItems, + setPromoData, + setIsLoading, + } = usePromoStore(); + const { isMobile } = useDevice(); useEffect(() => { @@ -24,7 +33,7 @@ const PromoList = ({ selectedPromo }) => { setTitle('Gratis Merchandise Spesial Indoteknik'); setSlug('merchandise'); } - }, [selectedPromo]); + }, [selectedPromo, setTitle, setSlug]); useEffect(() => { const fetchPromotions = async () => { @@ -33,11 +42,6 @@ const PromoList = ({ selectedPromo }) => { const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 50); setPromoItems(items); - console.log("selectedPromo",selectedPromo) - console.log("slug",slug) - console.log("items",items) - console.log("promoItems",promoItems) - const promoDataPromises = items.map(async (item) => { try { const response = await fetchPromoItemsSolr(`id:${item.id}`, 0, 10); @@ -64,17 +68,16 @@ const PromoList = ({ selectedPromo }) => { setPromoData([]); fetchPromotions(); } - }, [slug]); + }, [slug, setPromoItems, setPromoData, setIsLoading]); return (
-

{title}

+

{title}

{isLoading ? (
) : ( - {promoData?.map((promotion) => ( diff --git a/src-migrate/modules/promo/components/promoStore.js b/src-migrate/modules/promo/components/promoStore.js new file mode 100644 index 00000000..c232de00 --- /dev/null +++ b/src-migrate/modules/promo/components/promoStore.js @@ -0,0 +1,16 @@ +import create from 'zustand'; + +const usePromoStore = create((set) => ({ + title: '', + slug: '', + promoItems: [], + promoData: [], + isLoading: true, + setTitle: (title) => set({ title }), + setSlug: (slug) => set({ slug }), + setPromoItems: (promoItems) => set({ promoItems }), + setPromoData: (promoData) => set({ promoData }), + setIsLoading: (isLoading) => set({ isLoading }), +})); + +export default usePromoStore; diff --git a/src-migrate/pages/shop/promo/index.tsx b/src-migrate/pages/shop/promo/index.tsx index d1d6d70a..7c4df2c1 100644 --- a/src-migrate/pages/shop/promo/index.tsx +++ b/src-migrate/pages/shop/promo/index.tsx @@ -29,7 +29,7 @@ const PromoPage = () => { - +

-- cgit v1.2.3