Tengo una API con SWR que devuelve datos como este:

 const {data: data, error: error} = useSWR('fetchData', fetcher, { refreshInterval: 5000 })

Quiero mostrar el estado de mis datos data.status , que es fácil:

 <p>{data.status}</P> <button onClick={changeStatus}>change status</button>

pero a veces necesito cambiar manualmente lo que se debe mostrar, para eso intenté almacenar data.status en una variable primero y luego cambiarlo usando dos cosas:

 if (data){ status = data.status } const changeStatus = () => { status = 'bad' }

que simplemente no cambia de estado Y

 const [status, setStatus] = useState(''); if (data){ setStatus(data.status) } const changeStatus = () => { setStatus('bad') }

¡lo que me da el error "demasiadas iteraciones"!

Entonces, ¿cómo puedo cambiar manualmente los datos que obtengo de SWR de manera que todavía llame a la API cada 5 segundos y actualice los datos en consecuencia?