I'm trying to implement debounce when a user types in an input field in React.

 <TextField
    onChange={handleUsername}
 />

Input handler:

const handleTwitterUsername = (value: any) => {
    console.log({ value })
    debounce(() => {
      // setUserData({ ...userData, username: value })
      console.log('debounce value', value)
    })
  }

Debounce function:

const debounce = (cb: any, delay = 1000) => {
    let timeout: any
    return (...args: any[]) => {
      clearTimeout(timeout)
      timeout = setTimeout(() => {
        cb(...args)
      }, delay)
    }
  }

When I start typing, I get logs of value but there are no logs of debounce value. Debounce doesn't seem to work.

What am I doing wrong?