import React, { useEffect, useState } from 'react'
import { router, Link } from '@inertiajs/react'
import { usePrevious } from 'react-use'
import { Head } from '@inertiajs/react'
import { Button } from 'flowbite-react'
import { formatIDR, hasPermission } from '@/utils'
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout'
import Pagination from '@/Components/Pagination'
import SearchInput from '@/Components/SearchInput'
export default function Index(props) {
const {
query: { links, data },
location,
stats,
auth,
} = props
const [search, setSearch] = useState('')
const preValue = usePrevious(`${search}`)
const params = { q: search }
useEffect(() => {
if (preValue) {
router.get(
route(route().current(), location),
{ q: search },
{
replace: true,
preserveState: true,
}
)
}
}, [search])
const canCreate = hasPermission(auth, 'create-voucher')
return (