import React, { useState } from 'react' import { Head, router } from '@inertiajs/react' import { HiXMark, HiOutlineStar } from 'react-icons/hi2' import CustomerLayout from '@/Layouts/CustomerLayout' import VoucherCard from './VoucherCard' import LocationModal from '../Index/Partials/LocationModal' import FormLocation from '@/Customer/Components/FormLocation' import { ALL, FAVORITE } from '../Index/utils' import { useModalState } from '@/hooks' const EmptyHere = () => { return (

Voucher segera tersedia

Yuk, share referral kamu untuk tingkatkan poinnya

) } export default function Exhange(props) { const { locations, vouchers: { data, next_page_url }, _favorite, _slocations, _flocations, } = props const [favorite, setFavorite] = useState(_favorite) const [vouchers, setVouchers] = useState(data) const [fLocations] = useState(_flocations) const [sLocations, setSLocations] = useState(_slocations) const locationModal = useModalState() const handleNextPage = () => { let location_ids = sLocations.map((l) => l.id) router.get( next_page_url, { location_ids }, { replace: true, preserveState: true, only: ['vouchers'], onSuccess: (res) => { setVouchers(vouchers.concat(res.props.vouchers.data)) }, } ) } const fetch = (locations) => { let location_ids = locations.map((l) => l.id) router.get( route(route().current()), { location_ids }, { replace: true, preserveState: true, onSuccess: (res) => { setVouchers(res.props.vouchers.data) }, } ) } const handleAddLocation = (location) => { const isExists = sLocations.find((l) => l.id === location.id) if (!isExists) { const locations = [location].concat(...sLocations) setSLocations(locations) fetch(locations) } } const handleRemoveLocation = (index) => { const locations = sLocations.filter((_, i) => i !== index) setSLocations(locations) fetch(locations) } const isStatus = (s) => { if (s === favorite) { return 'px-2 py-1 rounded-2xl hover:bg-blue-800 text-white bg-blue-600 border border-blue-800' } return 'px-2 py-1 rounded-2xl hover:bg-blue-800 hover:text-white bg-blue-100 border border-blue-200' } const handleFavorite = () => { setFavorite(FAVORITE) fetch(fLocations) } const handleAll = () => { setFavorite(ALL) fetch(sLocations) } return (

Tukar Poin

tukarkan poin anda dengan voucher manarik

Semua

Favorit

{favorite === ALL ? (

{sLocations.map((location, index) => (

handleRemoveLocation(index)} >

{location.name}

))}

) : (

{fLocations.map((location, index) => (

handleRemoveLocation(index)} >

{location.name}

))}

)}

{vouchers.length <= 0 ? ( ) : (

{/* voucher */}

{vouchers.map((voucher) => ( ))} {next_page_url !== null && (

)}

) }