Lazycolumn with lazyrow that are loaded with api call

Question

i'am new to jetpack compose and i would like to achieve a view but i'am really struggling with it. it a catalogue movie where you can chose film in different categories, so you get the all the categories listed in column and for each category you get multiples films in the row.

Here is what i want to do : i have a viewmodele to make call to my api. So i make a first call giving me the list of categories. then for each category have to make an other call of my view modele to get films of this category. Here is how i started :

class CatalogViewModel() : ViewModel() {
var loadCategories by mutableStateOf(false)

var categories: ArrayList<Category> = arrayListOf()

init {
    fetchCategories()
}

fun fetchCategories() {

    this.viewModelScope.launch {
    Api.Call(
        completionHandler = object : completionHandler<ArrayList<Category>, Error> {
            override fun succeed(result: ArrayList<Category>?) {
                loadCategories  = true
                if (result != null) {
                    categories = result
                    loadCategories = true
                }   
            }

            override fun failed(error: PKError?) {
                println("failed")
                loadCatalog = false
            }
        })
    }
}

completionHandler is just and interface that we use to make our api call :

interface completionHandler<in T, in U> {
fun succeed(result: T?)
fun failed(error: U?)}

So first of all i don't really know how states work in jetpack compose so i'am not sure if i'am doing it good or not but it's work, now in my composable i just have to check

if (CatalogViewModel.loadCategories)

Then i can display my list of categories. But here is where i don't know how to do further : now for each category i have to make an other call to get the film that i need to display is the row, but i can't use the same technique because i'am not sur how much call i'll need to do, so i can't have a mutable state of boolean to observe in order to compose my row. So how can i do a call for each row and compose when the call is done ? also this has to be asynchrone because i can't wait all row to be loaded to display them.

And in a second time, i'll maybe get a lot of categories so i would like to only load those displayed on the screen.

I feel like i'am doing something wrong or maybe i didn't really get how to work with jetpack compose. So i would really like some help, thanks