из `./content.json` приходят данные) Я пытаюсь вывести их на страницу но получаю такую ошибку Uncaught TypeError: phones.map is not a function

import axios from 'axios';
import React, { useEffect, useState } from 'react'
import PhoneItem from '../components/PhoneItem';
import styled from 'styled-components';

const HomePageContainer = styled.div`
    display: flex;
    flex-wrap: wrap;
`

const Home = ({}) => {

    const [phones, setPhones] = useState([])

    const getPhones = () => {
        axios.get(`./content.json`)
            .then((res) => setPhones({phones: res.data}))
            .catch(e => console.log(e))
    }

    useEffect(() => {
        getPhones()
    }, [])

    return (
        <HomePageContainer>

                {phones.map((phone) => (
                    <PhoneItem 
                        phone={phone} 
                        key={phone.id}
                    />
                ))}
                        
        </HomePageContainer>
    )
}

export default Home;