Hi! I have a question regarding stack navigation. ...

# decompose

[Fyodor Danilov]

Hi! I have a question regarding stack navigation. I have the following component structure:
root
|-onboarding
|-main
|-tab1
|-component1
|-tab2
|-tab3

I need to override back button to exit app after 2 back presses. In component1 I have implemented the following:

fun DoubleBackCallback(
    backHandler: BackHandler,
    scope: CoroutineScope,
    onBackClicked: () -> Unit,
    onDoubleBackClicked: () -> Unit,
) {
    var job: Job? = null
    var doubleBackPressed = false
    var backCallback: BackCallback? = null
    backCallback = BackCallback {
        if (doubleBackPressed) {
            onDoubleBackClicked()
        } else {
            onBackClicked()
            doubleBackPressed = true

            job?.cancel()
            job = scope.launch(Dispatchers.Default) {
                delay(DELAY)
                doubleBackPressed = false
            }
        }
    }

    backHandler.register(backCallback)
}

DoubleBackCallback(
    backHandler = backHandler,
    scope = scope,
    onBackClicked = {
        /* Show snackbar "Click again to exit" */
    },
    onDoubleBackClicked = {
        output(Output.Exit)
    }
)

Output.Exit goes to tab1 where it is processed. However I can't close app when I call navigation.pop(), even though component1 is the only component inside tab1. How can I close my app correctly on Output.Exit? When I don't use BackCallback app closes correctly in component1 on back button press.

[Arkadii Ivanov]

You can bubble the event further up to the integration point and call something like Activity#finish. Or you can inject an interface which will do this, and then call that interface in your component.

[Fyodor Danilov]

Thanks!