I’m trying to use `collectAsState` but it is resulting in an infinite composition loop. When I call ...

# compose

[grandstaish]

I’m trying to use collectAsState but it is resulting in an infinite composition loop. When I call collectAsState it seems to just get the latest state and then trigger a recomposition, and then repeats that loop forever. Does anyone know what I am missing? I’m new to both technologies so it’s probably something really obvious!

[grandstaish]

If it helps:

@Composable
fun App(component: AppComponent) {
  val authRepository = component.authRepository()
  when (val authState = authRepository.state().collectAsState().value) {
    is AuthState.Authorized -> {
      // show login flow
    }
    is AuthState.Authenticated -> {
      // show user flow
    }
  }
}

[Luca]

does component.authRepository() make a new instance everytime?

[grandstaish]

hmm maybe actually. my repo might not be a singleton, let me check!

[Luca]

I'm guessing it does. I've ran into that problem

[grandstaish]

yeah, that was it! I forgot to scope my repo 🤦‍♂️

[Luca]

you could just try passing the authRepo instead of the component too

[Luca]

if you don't want a singleton

[grandstaish]

Is there a way to detect composition loops early? I didn’t even know this was happening until i threw some logs in

[Tash]

This happened to me by accident. My UI kept refreshing in a loop, that's when I realized there was a composition loop

[grandstaish]

yeah i suppose it’d be more noticeable once my pages are little more fleshed out

[Zach Klippenstein (he/him) [MOD]]

I wonder how you’d distinguish a composition loop from a composable that’s being animated, which i think would look the same (new composition on every frame)

[Tash]

hmm..if there’s some state management in the animation’s progress, a composition loop might cause the animation to restart/glitch 🤔

[Tash]

for example, in the case of a determinate progress bar 🤔

[Adam Powell]

as long as the actual instance returned by authRepository.state() does not change across calls, it won't resubscribe, it'll keep the existing subscription across recompositions

[Adam Powell]

and if it does change across calls (new instance per call, for example,) then you can use remember with your original inputs:

val state = remember(authRepository) { authRepository.state() }

[Adam Powell]

then you will only get a new .state() call if authRepository changes