Правильно ли реализован Higher-Order Component?

import React from "react";
import User from "./User";
 
export const HocApp = () => {
    return (
        <>
            <h1>Next Victims</h1>
            <User/>
        </>
    )
}

import React from "react";
import withRequest from "./hocs/withRequest";
 
const User = (
    {
        name = "no name",
        username = "no username",
        email = "no email",
        phone = "no phone number"
    }
) => (
    <div style={{border: "2px solid blue", padding: "15px", marginBottom: "10px"}}>
        <p><b>Name:</b>{name}</p>
        <p><b>username:</b>{username}</p>
        <p><b>email:</b>{email}</p>
        <p><b>phone:</b>{phone}</p>
    </div>
)
export default withRequest(User, 'https://jsonplaceholder.typicode.com/users');

import React, {useState} from "react";
 
const withRequest = (Component, url) => {
    return () => {
        const [data, setData] = useState([]);
 
        fetch(url)
            .then(response => response.json())
            .then(json => setData(json))
            .catch(e => console.error(e));
 
        return (
            <>
                {data.map((item) => {
                    return <Component key={item.id} {...item}/>
                })}
            </>
        )
    }
}
export default withRequest;