Django REST Framework Render a result from an hyperlink in API response

Question

I am building an application with a DRF/React stack, and I have a bit of an issue.

I am using a HyperlinkedModelSerializer to be able to easily make a GET request with the link given. On a less optimistic note, I am not able to query my result that easily.

Here is an example of my json object I get from my API

[
    {
        "url": "http://localhost:8000/session/3/",
        "session_start": "01:00:17.234060",
        "nb_person": 1,
        [...]
        "client": "http://localhost:8000/client/1/"
    }
]

There is an array I want to render in my template. Althought, I wanted to show the client firstname and lastname I get from my client link.

    function GetContactFromAPI(url)
    {
        var name = ""
        axios.get(url).then(response => {
            const data = response.data
            name = `${data.firstname} ${data.lastnom}`
            return name
        })
        return name
    }

    return (
        <div>
            <table>
                <thead>
                    <tr>
                        <th>Client</th>
                        <th>Nb Pers.</th>
                        <th>Starting time</th>
                    </tr>
                </thead>
                <tbody>
                    {sessions.map((session, index) => {
                        return (
                            <tr key={index}>
                                <td>{GetContactFromAPI(session.client)}</td>
                                <td>{session.nb_person}</td>
                                <td>{session.session_start}</td>
                            </tr>
                        )
                    })}
                </tbody>
            </table>
        </div>
    );

I think I have some misunderstanding on sync/async in order to render the result I need. Do you have an idea to resolve this need?

I was thinking to get an client list and to get client I need. But I wanted to avoid this request that may bigger than needed (I have more than 40K clients).

Thanks in advance

Answer 1

I may need to see your serializer where the client field is located, but what you need to do is create a Nested Relationship for the client field. Try to do this:

client = ClientSerializer()

Refer to the documentation here