A non-serializable value was detected in an action, in the path: `payload`. On react request to api

Question

I'm getting this error

A non-serializable value was detected in an action, in the path: `payload`. Value: 
Response { type: "cors", url: "http://localhost:9000/api/titles/?terms=m&format=json", redirected: false, status: 200, ok: true, statusText: "OK", headers: Headers, body: ReadableStream, bodyUsed: false }
 
Take a look at the logic that dispatched this action:  
Object { type: "titles/addTitles", payload: Response }
 
(See https://redux.js.org/faq/actions#why-should-type-be-a-string…t-least-serializable-why-should-my-action-types-be-constants) 
(To allow non-serializable values see: https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data) react_devtools_backend.js:4026:25

But when I check de browsers dev tools I check the request and the response is correct, I get the expected json.

this is the component that makes the request

import React from 'react'
import { useState } from 'react'
import { useSelector } from 'react-redux'
import { useDispatch } from 'react-redux'
import { addTitles } from '../features/titlesSlice/titleSlice'

export default function SearchComponent() {

  
  const [term, setTerm] = useState({
    term:''
  })

  const dispatch = useDispatch()

  const getFieldText = e => {
    setTerm({term: e.target.value });
    const url = `http://localhost:9000/api/titles/?terms=${e.target.value}&format=json`
    
    fetch(url,{
      headers:{
        'Authorization': 'uIl36EsOmCy2CFcpuDQC'
      }
    })
      .then(response => dispatch(addTitles(response)))
      .then(data => console.log(data));
  }

  return (
    <div>
      <input type="text" onChange={ getFieldText}></input>
    </div>
  )
}