@gmana/hook v0.1.11

gmana-hook

Install

pnpm add @gmana/hook

Usage

  'use client'

  import { useEffect, useState } from 'react'
  import { useRouter } from 'next/navigation'
  import qs from 'query-string'

  import { useDebounce } from '@gmana/tw'
  import { Input } from '@gmana/react/input'

  const InputSearch = () => {
    const router = useRouter()
    const [value, setValue] = useState<string>('')
    const debouncedValue = useDebounce<string>(value, 500)

    useEffect(() => {
      const query = {
        title: debouncedValue,
      }

      const url = qs.stringifyUrl({
        url: '/docs/hooks/use-debounce',
        query,
      })

      router.push(url)
    }, [debouncedValue, router])

    return <Input placeholder="What do you want to listen to?" value={value} onChange={(e) => setValue(e.target.value)} />
  }

  export default InputSearch