java.lang.IllegalStateException: Duplicate route found X_destination'. Routes must be unique!. In Muli-module project.

[Velord]

I have

@Destination<ExternalModuleGraph>
@Composable
fun SettingsDestination() {
...
}

private const val BOTTOM_NAVIGATION_GRAPH = "bottom_navigation_graph"
@NavHostGraph(route = BOTTOM_NAVIGATION_GRAPH)
annotation class BottomNavigationGraph {
    @ExternalDestination<SettingsDestinationDestination>()
    companion object Includes
}

Also I have graph that belongs to BottomNavigationGraph and has SettingsDestination

private const val X_GRAPH = "x_graph"
@NavGraph<BottomNavigationGraph>(route = X_GRAPH, start = true)
annotation class XGraph {
    @ExternalDestination<SettingsDestinationDestination>()
    companion object Includes
}

Simple workaround can be like that:

@Destination<ExternalModuleGraph>
@Composable
fun SettingsBottomGraphDestination() {
...
}

@Destination<ExternalModuleGraph>
@Composable
fun SettingsXGraphDestination() {
...
}

In that case I don't receive any benefit of splitting destinations to different modules. Am I missing some API ? May you suggest something ?

[raamcosta]

Hi @Velord 👋

Annotated Composables with @Destination create and correspond to a single route in your graph. If you find yourself wanting to include it in multiple graphs that all have the same "root" graph (the one you pass to DestinationsNavHost), you'll have multiple destinations with the same route.

This is described here also:
https://composedestinations.rafaelcosta.xyz/v2/multi-module-setup

IMPORTANT
Generated Destinations contain navigation stuff like the route. Routes should be unique. So you cannot import another module's Destination to more than one graph.
So, if you find yourself wanting to do this, you should instead expose the actual Composable, untied from any navigation stuff, then preparing multiple @destination Composables that just call that one.

What I would do:

• The module that is exposing this SettingsDestination, instead exposes a simple Composable function. Not tied to navigation in any way.
• Next to the graphs where you want to include this screen, create an annotated Composable with @destination that calls your Composable from the other module.
• Include that in your graph by simply adding the correct graph @Destination<GRAPH>. If these are both in the same module, you can actually make use of multiple @Destination annotations in one single Composable, example:

@Destination<BottomNavigationGraph>
@Destination<XGraph>
@Composable
fun SettingsDestination() {
    SettingsScreen() // from that other module that's exposing it.
}

Because you're in the module that knows both XGraph and BottomNavigationGraph, this works. It will create two Destinations, one for each graph, with different routes for each in this case.

[Velord]

Thank you for unambiguous answer !