diff options
Diffstat (limited to 'src/lib/review/components')
| -rw-r--r-- | src/lib/review/components/CustomerReviews.jsx | 14 |
1 files changed, 12 insertions, 2 deletions
diff --git a/src/lib/review/components/CustomerReviews.jsx b/src/lib/review/components/CustomerReviews.jsx index 935d4a3d..5cc179e9 100644 --- a/src/lib/review/components/CustomerReviews.jsx +++ b/src/lib/review/components/CustomerReviews.jsx @@ -2,6 +2,7 @@ import DesktopView from '@/core/components/views/DesktopView' import MobileView from '@/core/components/views/MobileView' import Image from 'next/image' import { Swiper, SwiperSlide } from 'swiper/react' +import { Autoplay } from 'swiper' const { useQuery } = require('react-query') const { getCustomerReviews } = require('../api/customerReviewsApi') @@ -14,7 +15,7 @@ const CustomerReviews = () => { <div className='font-medium sm:text-h-lg mb-4'>Ulasan Konsumen Kami</div> <DesktopView> - <Swiper slidesPerView={3.2} spaceBetween={16}> + <Swiper slidesPerView={3.2} spaceBetween={16} {...swiperProps}> {customerReviews && customerReviews?.map((customerReview) => ( <SwiperSlide className='pb-4' key={customerReview.id}> @@ -25,7 +26,7 @@ const CustomerReviews = () => { </DesktopView> <MobileView> - <Swiper slidesPerView={1.1} spaceBetween={8}> + <Swiper slidesPerView={1.1} spaceBetween={8} {...swiperProps}> {customerReviews && customerReviews?.map((customerReview) => ( <SwiperSlide className='pb-4' key={customerReview.id}> @@ -38,6 +39,15 @@ const CustomerReviews = () => { ) } +const swiperProps = { + autoplay: { + delay: 6000, + disableOnInteraction: false + }, + loop: true, + modules: [Autoplay] +} + const Card = ({ customerReview }) => ( <div className='bg-gray-200 rounded-md px-5 py-6 shadow-md shadow-gray-500/20 h-full'> <div className='flex items-center space-x-3 mb-4'> |
