jest throw symbol is not a function

Question

I trying test a componet with name ContentPage (and managment store reac-redux). Bassically behaivour componente is redering in the first page only 8 cards with information about Breeds from globalState. When i use the method render(<Provider store={store}><contentPage /></Provider) jest throw error 'symbol is not a function' and underline the code line 35 and 41 in my test file and console.error says: 'The above error occurred in the component: at CardDog (client/src/components/cardDog/CardDog.jsx:4:21)'

//CardDog.jsx
import { Link } from 'react-router-dom'
import '../../assets/css/style.css'

function CardDog ({ id, weight, height, name, breedPhoto, bredFor, temperament }) {
  return (
    <div className='cardDog' data-testid='card-dog'>
      <header className='cardDog__header'>
        <img
          src={breedPhoto}
          alt={name}
          className='cardDog__Dog'
        />
      </header>
      <main className='cardDog__body'>
        <Link to={`/dog/${id}`} style={{ color: 'black' }}>
          <label id='nameDog'>
            Name: {name}
          </label>
        </Link>
        <label id='bredFor'>
          Bed for: {bredFor}
        </label>
      </main>
      <footer className='cardDog__footer'>
        <label id='weight'>
          WEIGHT: {weight}
        </label>
        <label id='height'>
          HEIGHT: {height}
        </label>
        <ul className='cardDog__footerTemperaments'>
          <li>Temperament: {temperament}</li>
        </ul>
      </footer>
    </div>
  )
}

export default CardDog


//ContentPage.jsx
import React from 'react'
import CardDog from '../components/cardDog/CardDog'
import '../assets/css/style.css'
import loupe from '../assets/images/loupe.png'
import { useSelector } from 'react-redux'
import Pagination from '../components/pagination/pagination'

function ContentPage () {
  const { allDogs } = useSelector(state => state)

  return (
    <main className='contentpage'>
      <header className='contentpage__header'>
        <div className='contentpage__headerRight'>
          <div id='ordered'>
            <label>
              Ordered By:
            </label>
            <select name='orderBy' id='orderedBy'>
              <option value='none'>None</option>
              <option value='a-Z'>a-Z</option>
              <option value='Z-a'>Z-a</option>
              <option value='0-9'>0-9</option>
              <option value='9-0'>9-0</option>
            </select>
          </div>
          <div id='filtered'>
            <label>
              Filter By:
            </label>
            <select name='filterBy' id='filterBy'>
              <option value='all'>All</option>
              <option value='apiDogs'>Api Dogs</option>
              <option value='created'>Created</option>
            </select>
          </div>
        </div>
        <div className='contentpage__headerLeft'>
          <input
            type='text'
            placeholder='Search...'
          />
          <div className='icon__search'>
            <img
              src={loupe}
              alt='search'
            />
          </div>
        </div>
      </header>
      <main className='contentpage__body'>
        {
        allDogs.length === 0
          ? <h1>Loading...</h1>
          : allDogs.slice(0, 8).map((d) => { //eslint-disable-line
          const { weight, height, id, name, image, bred_for, temperament } = d //eslint-disable-line
            return (
              <CardDog
                key={id}
                id={id}
                name={name}
                height={height.metric}
                weight={weight.metric}
                bredFor={bred_for} //eslint-disable-line
                breedPhoto={image.url}
                temperament={temperament}
              />
            )
          })
}
      </main>
      <footer className='contentpage__footer'>
        <Pagination />
      </footer>
    </main>
  )
}

export default ContentPage


//ContentPage.test.js
import React from 'react'
import ContentPage from '../src/pages/ContentPage'
import { apiMockeada } from '../varGlobals/apiMockeada'
import { screen, cleanup, render } from '@testing-library/react'
import { Provider } from 'react-redux'
import RouterWrapper from './RouterWrapper'
import userEvent from '@testing-library/user-event'
import configureStore from 'redux-mock-store'
import '@testing-library/jest-dom'
import * as reactRedux from 'react-redux'

const mockStore = configureStore()
const store = mockStore(apiMockeada)
const useSelectorMock = jest.spyOn(reactRedux, 'useSelector')

beforeEach(() => {
  render(
    <Provider store={store}>
      <ContentPage />
    </Provider>, { wrapper: RouterWrapper })
})

afterEach(() => {
  useSelectorMock.mockClear()
  cleanup()
})

describe('Should reder 8 dogs per page', () => {
  it('Shoul render first eight dogs from globalState', () => {
    useSelectorMock.mockReturnValue(apiMockeada)
    const nameAlaskanHusky = screen.queryByText(/Name: Alaskan Husky/i)
    const eightDogs = screen.queryAllByTestId(/card-dog/i)
    expect(nameAlaskanHusky).toBeInTheDocument()
    expect(eightDogs).toHaveLength(8)
  })
  it('Should render dogs from 9 to 16', () => {
    const next = screen.queryByText(/Next/i)
    const nameAmericanPitBullTerrier = screen.queryByText(/Name: American Pit Bull Terrier/i)
    userEvent.click(next)
    expect(nameAmericanPitBullTerrier).toBeInTheDocument()
  })
})