import React, { useState } from 'react' import { Head, router, useForm } 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' import { isEmpty } from 'lodash' const EmptyHere = () => { return (
Belum ada data tersedia
Yuk, share referral kamu untuk tingkatkan poinnya
) } export default function Index(props) { const { locations, profiles: { data, next_page_url }, _favorite, _slocations, _flocations, } = props const { post, processing } = useForm({}) const [favorite, setFavorite] = useState(_favorite) const [items, setItems] = 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: ['profiles'], onSuccess: (res) => { setItems(items.concat(res.props.profiles.data)) }, } ) } const fetch = (locations, favorite) => { let location_ids = [] if (+favorite === +ALL) { location_ids = locations.map((l) => l.id) } router.get( route(route().current()), { location_ids, favorite }, { replace: true, preserveState: true, onSuccess: (res) => { if (isEmpty(res.props.profiles.data)) { setItems([]) return } setItems(res.props.profiles.data) }, } ) } const handleAddLocation = (location) => { const isExists = sLocations.find((l) => l.id === location.id) if (!isExists) { const locations = [location].concat(...sLocations) setSLocations(locations) fetch(locations, ALL) } } const handleRemoveLocation = (index) => { const locations = sLocations.filter((_, i) => i !== index) setSLocations(locations) fetch(locations, favorite) } const handleFavoriteRemoveLocation = (location) => { if (processing) { return } post(route('customer.location.favorite', location), { onSuccess: () => { router.visit(route(route().current())) }, }) } 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, FAVORITE) } const handleAll = () => { setFavorite(ALL) fetch(sLocations, ALL) } 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) => (
handleFavoriteRemoveLocation(location) } >
{location.name}
))}
)}
{items.length <= 0 ? ( ) : (
{/* voucher */}
{items.map((item) => ( ))} {next_page_url !== null && (
Load more
)}
)}
) }