UI crashes when I try to make object instead of passing functional references

[ch8n]

Inspire from

https://github.com/theapache64/stackzy/blob/master/src/main/kotlin/com/theapache64/stackzy/ui/navigation/NavHostComponent.kt

My branch

Branch :
https://github.com/ch8n/Jetpack-ViewBinding-Migrator-Plugin/tree/error-navigator

Changes

Instead of creating functional reference to invoke for navigation, I have created a router that can route to any screen

//  in class NavHostNavigationComponent

 private val router = router<Screens, NavigationComponent>(
        initialConfiguration = Screens.Splash,
        childFactory = ::createNavigationScreenComponent
 )

 private val appNavigator = object : AppNavigationController {

        override fun toSplashScreen() {
            router.replaceCurrent(Screens.Splash)
        }

        override fun toWelcomeScreen() {
            router.push(Screens.Welcome)
        }

        override fun toProjectPathScreen() {
            router.push(Screens.ProjectPath)
        }

        override fun toSelectModulesScreen() {
            router.push(Screens.SelectModules)
        }

        override fun toMigrationScreen() {
            router.push(Screens.Migration)
        }

        override fun toUpdateScreen() {
            router.push(Screens.Update)
        }

        override fun onBackClicked() {
            router.pop()
        }

    }


 private fun createNavigationScreenComponent(
        screens: Screens,
        componentContext: ComponentContext
    ): NavigationComponent {
        return when (screens) {
            is Screens.Splash -> SplashScreenNavigationComponent(
                componentContext = componentContext,
                navigator = appNavigator
            )
            is Screens.Welcome -> WelcomeScreenNavigationComponent(
                componentContext = componentContext,
                navigator = appNavigator
            )
            is Screens.ProjectPath -> TODO()
            is Screens.SelectModules -> TODO()
            is Screens.Migration -> TODO()
            is Screens.Update -> TODO()
        }
    }

How I'm consuming in UI

class SplashScreenNavigationComponent(
    componentContext: ComponentContext,
    private val navigator: AppNavigationController
) : NavigationComponent, ComponentContext by componentContext {

    private val splashViewModel by lazy { SplashViewModel() }

    @Composable
    override fun render() {
        val scope = rememberCoroutineScope()
        LaunchedEffect(splashViewModel) {
            splashViewModel.init(scope)
            splashViewModel.syncData {
                navigator.toWelcomeScreen()
            }
        }

        SplashScreenUI(
            splashViewModel = splashViewModel,
        )
    }
}

@Composable
fun SplashScreenUI(
    splashViewModel: SplashViewModel
) {
.....
}

class SplashViewModel() : ViewModel() {
    override fun syncData(function: () -> Unit) {
        viewModelScope.launch {
            delay(1000)
            function.invoke()
        }
    }
}

App doesn't crash but shows white screen with stack trace

Error StackTrace

Exception in thread "AWT-EventQueue-0" java.lang.NullPointerException: Parameter specified as non-null is null: method ui.screens.splash.SplashScreenNavigationComponent.<init>, parameter navigator
	at ui.screens.splash.SplashScreenNavigationComponent.<init>(SplashScreen.kt)
	at ui.navigation.NavHostNavigationComponent.createNavigationScreenComponent(Navigation.kt:69)
	at ui.navigation.NavHostNavigationComponent.access$createNavigationScreenComponent(Navigation.kt:12)
	at ui.navigation.NavHostNavigationComponent$router$1.invoke(Navigation.kt:28)
	at ui.navigation.NavHostNavigationComponent$router$1.invoke(Navigation.kt:28)
	at com.arkivanov.decompose.router.RouterEntryFactoryImpl.invoke(RouterEntryFactoryImpl.kt:32)
	at com.arkivanov.decompose.router.RouterEntryFactory$DefaultImpls.invoke$default(RouterEntryFactory.kt:11)
	at com.arkivanov.decompose.router.StackHolderImpl.initialStack(StackHolderImpl.kt:47)
	at com.arkivanov.decompose.router.StackHolderImpl.<init>(StackHolderImpl.kt:25)
	at com.arkivanov.decompose.DefaultRouterFactory.router(DefaultRouterFactory.kt:37)
	at com.arkivanov.decompose.DefaultComponentContext.router(DefaultComponentContext.kt)
	at ui.navigation.NavHostNavigationComponent.router(Navigation.kt)
	at ui.navigation.NavHostNavigationComponent.<init>(Navigation.kt:111)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-1$1$1.invoke(MainActivity.kt:37)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-1$1$1.invoke(MainActivity.kt:36)
	at com.arkivanov.decompose.extensions.compose.jetbrains.RootComponentBuilderKt.rememberRootComponent(RootComponentBuilder.kt:35)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-1$1.invoke(MainActivity.kt:36)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-1$1.invoke(MainActivity.kt:35)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:193)
	at androidx.compose.material.TextKt.ProvideTextStyle(Text.kt:246)
	at androidx.compose.material.MaterialThemeKt$MaterialTheme$1.invoke(MaterialTheme.kt:78)
	at androidx.compose.material.MaterialThemeKt$MaterialTheme$1.invoke(MaterialTheme.kt:77)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:193)
	at androidx.compose.material.MaterialThemeKt.MaterialTheme(MaterialTheme.kt:69)
	at Themes.ThemesKt.ViewBinderTheme(Themes.kt:20)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-2$1.invoke(MainActivity.kt:35)
	at ui.main.ComposableSingletons$MainActivityKt$lambda-2$1.invoke(MainActivity.kt:34)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.desktop.AppWindow_desktopKt$Window$1$1.invoke(AppWindow.desktop.kt:95)
	at androidx.compose.desktop.AppWindow_desktopKt$Window$1$1.invoke(AppWindow.desktop.kt:94)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.desktop.AppWindow$show$1.invoke(AppWindow.desktop.kt:445)
	at androidx.compose.desktop.AppWindow$show$1.invoke(AppWindow.desktop.kt:443)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:193)
	at androidx.compose.desktop.AppWindow$onCreate$1.invoke(AppWindow.desktop.kt:418)
	at androidx.compose.desktop.AppWindow$onCreate$1.invoke(AppWindow.desktop.kt:417)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:193)
	at androidx.compose.ui.platform.CompositionLocalsKt.ProvideCommonCompositionLocals(CompositionLocals.kt:148)
	at androidx.compose.ui.platform.Wrapper_desktopKt$ProvideDesktopAmbients$1.invoke(Wrapper.desktop.kt:51)
	at androidx.compose.ui.platform.Wrapper_desktopKt$ProvideDesktopAmbients$1.invoke(Wrapper.desktop.kt:50)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:193)
	at androidx.compose.ui.platform.Wrapper_desktopKt.ProvideDesktopAmbients(Wrapper.desktop.kt:48)
	at androidx.compose.ui.platform.Wrapper_desktopKt.access$ProvideDesktopAmbients(Wrapper.desktop.kt:1)
	at androidx.compose.ui.platform.Wrapper_desktopKt$setContent$1.invoke(Wrapper.desktop.kt:40)
	at androidx.compose.ui.platform.Wrapper_desktopKt$setContent$1.invoke(Wrapper.desktop.kt:39)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:121)
	at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.kt:46)
	at androidx.compose.runtime.ComposerKt.invokeComposable(Composer.kt:3433)
	at androidx.compose.runtime.ComposerImpl.composeContent$runtime(Composer.kt:2615)
	at androidx.compose.runtime.CompositionImpl.composeContent(Composition.kt:348)
	at androidx.compose.runtime.Recomposer.composeInitial$runtime(Recomposer.kt:702)
	at androidx.compose.runtime.CompositionImpl.setContent(Composition.kt:304)
	at androidx.compose.ui.platform.Wrapper_desktopKt.setContent(Wrapper.desktop.kt:39)
	at androidx.compose.desktop.ComposeLayer.initOwner(ComposeLayer.desktop.kt:267)
	at androidx.compose.desktop.ComposeLayer.access$initOwner(ComposeLayer.desktop.kt:49)
	at androidx.compose.desktop.ComposeLayer$Wrapped.init(ComposeLayer.desktop.kt:82)
	at org.jetbrains.skiko.SkiaLayer.checkIsShowing(SkiaLayer.kt:54)
	at org.jetbrains.skiko.SkiaLayer.access$checkIsShowing(SkiaLayer.kt:18)
	at org.jetbrains.skiko.SkiaLayer$2.hierarchyChanged(SkiaLayer.kt:43)
	at java.desktop/java.awt.Component.processHierarchyEvent(Component.java:6821)
	at java.desktop/java.awt.Component.processEvent(Component.java:6440)
	at java.desktop/java.awt.Component.dispatchEventImpl(Component.java:5029)
	at java.desktop/java.awt.Component.dispatchEvent(Component.java:4861)
	at java.desktop/java.awt.Component.createHierarchyEvents(Component.java:5668)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Container.createHierarchyEvents(Container.java:1466)
	at java.desktop/java.awt.Component.show(Component.java:1697)
	at java.desktop/java.awt.Window.show(Window.java:1059)
	at java.desktop/java.awt.Component.show(Component.java:1734)
	at java.desktop/java.awt.Component.setVisible(Component.java:1681)
	at java.desktop/java.awt.Window.setVisible(Window.java:1031)
	at androidx.compose.desktop.ComposeWindow.setVisible(ComposeWindow.desktop.kt:90)
	at androidx.compose.desktop.AppWindow.show(AppWindow.desktop.kt:448)
	at androidx.compose.desktop.AppWindow.show$default(AppWindow.desktop.kt:434)
	at androidx.compose.desktop.AppWindow_desktopKt$Window$1.run(AppWindow.desktop.kt:94)
	at java.desktop/java.awt.event.InvocationEvent.dispatch(InvocationEvent.java:313)
	at java.desktop/java.awt.EventQueue.dispatchEventImpl(EventQueue.java:776)
	at java.desktop/java.awt.EventQueue$4.run(EventQueue.java:727)
	at java.desktop/java.awt.EventQueue$4.run(EventQueue.java:721)
	at java.base/java.security.AccessController.doPrivileged(Native Method)
	at java.base/java.security.ProtectionDomain$JavaSecurityAccessImpl.doIntersectionPrivilege(ProtectionDomain.java:85)
	at java.desktop/java.awt.EventQueue.dispatchEvent(EventQueue.java:746)
	at java.desktop/java.awt.EventDispatchThread.pumpOneEventForFilters(EventDispatchThread.java:203)
	at java.desktop/java.awt.EventDispatchThread.pumpEventsForFilter(EventDispatchThread.java:124)
	at java.desktop/java.awt.EventDispatchThread.pumpEventsForHierarchy(EventDispatchThread.java:113)
	at java.desktop/java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:109)
	at java.desktop/java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:101)
	at java.desktop/java.awt.EventDispatchThread.run(EventDispatchThread.java:90)

[arkivanov]

Hi! This is by design. The childFactory callback (createNavigationScreenComponent function) is called synchronously by the router function. At this point the appNavigator is not initialised yet.

You can make your NavHostNavigationComponent to implement AppNavigationController, or make appNavigator Lazy.

But I recommend to use callbacks instead. Because:

• all your child components are now coupled by the same object.
• children should not be responsible of navigation, their responsibility should be to signal events (e.g. onFinished) and it's parent`s responsibility to decide what to do.

[ch8n]

@arkivanov I was planning to make one central navigator for all of the screens, but it makes sense not to have children compose components now have the responsibility of navigation, can you suggest me some snippet on how I can design a good child-to-parent event?

[arkivanov]

I recommend checking the sample apps:

• TodoApp's Root component - in this sample all children define their Output sealed classes and accept a callback to emit outputs, the Root component listens for outputs and do the navigation.
• decompose-desktop-example's NavHostComponent component - in this example all children accept separate callbacks for each event, the NavHostComponent is responsible for the navaigation.

[ch8n]

Thanks @arkivanov I will have a look 🙌🏻