Hi! Is there a small navigation library available for Compose Web yet? I don't need anything big, ju...

# compose-web

[CLOVIS]

Hi! Is there a small navigation library available for Compose Web yet? I don't need anything big, just something basic that works well with Compose. Hopefully multiplatform.
I've been trying to roll my own thing out but I'm not convinced by the results.

[Casey Brooks]

I’m currently working on one that’s based on my #ballast MVI library. It’s fully multiplatform, works outside Compose so it’s easy to set up and test without being coupled to Compose or your UI, and includes hash-based and history-based URL routing for web targets. It’s not fully published yet, but I’m getting pretty close to finishing it, it mostly just needs documentation and examples. You can check out a preview of it on the features/navigation branch of the Ballast repo

[Casey Brooks]

Here’s an example of what it would look like to define the routes, and this file shows how the routes are connected to Compose Desktop

[Casey Brooks]

And even though it’s not officially published yet, there are snapshot builds available on Maven Central Snapshots

repositories {
    mavenCentral()
    maven(url = "<https://s01.oss.sonatype.org/content/repositories/snapshots>")
}
dependencies {
    implementation("io.github.copper-leaf:ballast-core:2.3.0-SNAPSHOT")
    implementation("io.github.copper-leaf:ballast-navigation:2.3.0-SNAPSHOT")
}

[CLOVIS]

I actually want something tied to Compose. I tried Decompose but it's really clunky, I'd prefer something more lightweight that doesn't feel like adding an entire new ecosystem to a simple webpage.

[CLOVIS]

I'll take a look at your lib, thanks.

[hfhbd]

You could also use https://github.com/hfhbd/routing-compose which is very lightweight :D

[Big Chungus]

I'm using routing-compose and found it super nice. But I'm coming from react land so mught be a bit biased.

[rocketraman]

Also using routing-compose with compose-web, and agree, it is quite nice.

[CLOVIS]

Thanks, I'll look into this. It doesn't look typesafe, however.

[Big Chungus]

Yes and no. It's not typesafe out of the box, but you can make it typesafe yourself with sealed value classes for paths.

[David Herman]

In case you're curious, I'm working on Kobweb which takes ownership of routing for you. You define @Page composables and then routes are created automatically for your project based on the file path. I'm not saying it's what you're looking for (you probably wouldn't call Kobweb lightweight 🙂 ), but I'd be curious if you'd consider an approach like that as a possible solution.

[CLOVIS]

Ahah, indeed that doesn't look lightweight. Am I right to assume this approach cannot be adapted in the future to multiplatform projects?

Also, how are you using Column & co in the web target, are you using the canvas?

[hfhbd]

It is typesafe at parameter matching, but if you want to represent your routes with a class, there is an open ticket to adopt the resource implementation from ktor: https://github.com/hfhbd/routing-compose/issues/235
https://ktor.io/docs/type-safe-request.html#resource_query_param

[CLOVIS]

Do you have a (vague) idea when that will be implemented?

[hfhbd]

Any PR is welcome!
Otherwise, it really depends on my schedule, but not later than Februar.

[CLOVIS]

Thanks. I'll probably roll out something temporary on my side until then.

[David Herman]

@CLOVIS correct, Kobweb isn't really about supproting the same app on multiple platforms. I think that will be covered by IJ's canvas approach. My approach is more for those who want to build a website but want to use Kotlin and like Compose. My Column, Box, and Row implementations all built on top of standard HTML elements and CSS rules.