React. Objects are not valid as a React child (found: object with keys {slide})

Добрый день. Получаю ошибку рендера в следующей ситуации. Я не очень понимаю что в этой ситуации должно быть массивом. Я итак беру список данных и в App.js рендерю весь список.

Самое интересное, что если я уберу this.state.isOpen && из const slide = this.state.isOpen && <div className="item"> <h3 className="item__hero">{hero}</h3> <p className="item__text">{text}</p> <img className="item__picture" src={image}/> </div> ; то все заработает корректно..

привожу полный код моих компонентов:

Slide.js

import React, {Component} from 'react';
class Slide extends Component {
    constructor(props) {
        super(props);
        this.state = {
            isOpen: props.defaultOpen
        }
    }
    render() {
        const {hero, text, image} = this.props;
        const slide = this.state.isOpen && <div className="item">
            <h3 className="item__hero">{hero}</h3>
            <p className="item__text">{text}</p>
            <img className="item__picture" src={image}/>
        </div> ;
        return (
            {slide}
        )
    }
}
export default Slide;

SliderItemList.js

export default function SliderItemList({sliderItems}) {
    const sliderElements = sliderItems.map((item, i) =>
        <Slide key={i} {...item} defaultOpen={i === 0}/>
    )
    return (
        <div className="container">
            <div className="slider__items">
                {sliderElements}
            </div>
        </div>
    )
}

App.js

import React, {Component} from 'react';
import SliderItemList from './components/SliderItemList';
import Slider from './components/Slider';
import feed from './feed';
class App extends Component {

    count = feed.slider.length;
    render() {
        return (
            <div className="container">
                <button>Left</button>
                <button>Right</button>
                <p>{this.count}</p>
                <SliderItemList sliderItems={feed.slider}/>
            </div>
        );
    }
}

И собственно массив объектов с данными:

const feed = {
    "slider": [
        {
            "hero": "https://placeimg.com/640/480/animals",
            "text": "Animals are here.",
            "image": "https://placeimg.com/150/150/animals/sepia"
        },
        {
            "hero": "https://placeimg.com/640/480/people",
            "text": "People are here.",
            "image": "https://placeimg.com/150/150/people/sepia"
        },
        {
            "hero": "https://placeimg.com/640/480/tech",
            "text": "Tech is here.",
            "image": "https://placeimg.com/150/150/tech/sepia"
        }
    ]
};
export default feed;

Objects are not valid as a React child (found: object with keys {slide}). If you meant to render a collection of children, use an array instead.

Заранее благодарен за помощь