I'm stuck on Navigo again. Now the matcher isn't p...

# kvision

[Adam S]

I'm stuck on Navigo again. Now the matcher isn't picking up /servers/test-id at all...

routing
      .on("/", {
        log("routing.on HOME")
        homepageView()
      })
      .on(("/servers/(.*)"), { match ->
        println("routing.on SERVER $match")
        val serverId = match.data[0] as? String ?: error("invalid server id")
        println("routing.on SERVER serverId:$serverId")
        serverView(FactorioServerId(serverId))
      }
      )

I can see routing.on HOME logged, but routing.on SERVER isn't logged. It was earlier! I've no idea what's wrong...

[Adam S]

I always get 404 Cannot GET /servers/test-server when I click on the link in the homepage. The URL has the navigo attribute. I'm doing Routing.init(useHash = false), and the routing.updatePageLinks() trick

[Adam S]

is there an alternative to using Navigo? Because I'm really stuck on trying to figure it out.

[Robert Jaros]

If you want to use regular expression you should use RegExp()

[Robert Jaros]

https://kvision.gitbook.io/kvision-guide/3.-optional-ui-functionality-via-modules/js-routing#adding-a-route

[Adam S]

I figured out the problem this time around, if I try and put the window.setTimeout({routing.updatePageLinks()}, 0) trick in a function, then it doesn't work

[Adam S]

override fun start(state: Map<String, Any>) {
    Routing.init(
//      root = "/",
//      root = window.location.origin,
      useHash = false,
      strategy = Strategy.ALL,
    )
    SiteRouting.init()

    this.appState = state.toMutableMap()

    root("kvapp") {
      header().bind(siteStateStore) { state ->
        headerNav(state)
      }

      main().bind(siteStateStore) { state ->
        div(className = "container-fluid") {
          when (state.view) {
            SiteView.HOME   -> homePage(state)
            SiteView.SERVER -> serverPage(state)
          }
        }
//        window.setTimeout({routing.updatePageLinks()}, 0) // works
        SiteRouting.updatePageLinks() // doesn't work...
      }
    }

object SiteRouting {
...


  fun updatePageLinks() {
    window.setTimeout({
      if (::routing.isInitialized) {
        log("updating page links")
        routing.updatePageLinks()
      }
    }, 0)
  }

[Robert Jaros]

You are probably mixing Routing instances (your own from SiteRouting and the one provided by KVision). If you run Routing.init() (which initializes KVision provided instance) make sure you use it everywhere (and don't create the second instance yourself). Otherwise use something like I've shown earlier (https://kotlinlang.slack.com/archives/CL4C1SLKC/p1662325322349289?thread_ts=1662321374.232579&cid=CL4C1SLKC) and don't use Routing.init() at all.

[Adam S]

Ahhh yes I forgot to do that part!

[Adam S]

I've updated it now and it's working as expected 🎉

[Adam S]

Can I suggest removing default lateinit var routing: Routing from KVision and instructing users to create their own instance? I that would make it more clear, and more typical of other usages.

[Robert Jaros]

This built-in instance is needed for StackPanel and TabPanel components, which allow easy routing definitions.

[Adam S]

ahh okay, that makes sense

[Adam S]

does defining a separate Routing instance interfere with that? Do I need to override the built-in instance with my custom one?

[Robert Jaros]

I have no idea 🙂

[Adam S]

haha okay

[Robert Jaros]

Generally I've built a few apps only using the built-in routing instance without problems.

[Robert Jaros]

But with my last application I had to initialize routing asynchronously, from a coroutine, after fetching some data from the backend.

[Robert Jaros]

And somehow defining my own instance was working more stable

[Adam S]

mm okay

[Adam S]

well, I only have a very small site, so I'm not expecting anything complicated

[Adam S]

I'm happy with it right now - thanks for your help!!