import React, { useState } from 'react'
import { Head, router } from '@inertiajs/react'
import CustomerLayout from '@/Layouts/CustomerLayout'
import VoucherCard from './VoucherCard'
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 },
_location_id,
} = props
const [locId, setLocId] = useState(_location_id)
const [v, setV] = useState(data)
const handleSelectLoc = (loc) => {
if (loc.id === locId) {
setLocId('')
fetch('')
return
}
setLocId(loc.id)
fetch(loc.id)
}
const handleNextPage = () => {
router.get(
next_page_url,
{
location_id: locId,
},
{
replace: true,
preserveState: true,
only: ['vouchers'],
onSuccess: (res) => {
setV(v.concat(res.props.vouchers.data))
},
}
)
}
const fetch = (locId) => {
router.get(
route(route().current()),
{ location_id: locId },
{
replace: true,
preserveState: true,
onSuccess: (res) => {
setV(res.props.vouchers.data)
},
}
)
}
return (
Tukar poin
tukarkan poin anda dengan voucher manarik
{v.length <= 0 ? (
) : (
{/* chips */}
{locations.map((location) => (
handleSelectLoc(location)}
key={location.id}
className={`px-2 py-1 rounded-2xl ${
location.id === locId
? 'text-white bg-blue-600 border border-blue-800'
: 'bg-blue-100 border border-blue-200'
}`}
>
{location.name}
))}
{/* voucher */}
{v.map((voucher) => (
))}
{next_page_url !== null && (
Load more
)}
)}
)
}