`session$clientData$url_hash` doesn't update correctly with `NavLink()`

[lgnbhl]

In some use cases, it is very useful to be able to observe the hash url of the current shiny session. However, it seems that the session$clientData$url_hash object doesn't update correctly when NavLink() is used.

A workaround it to use session$reload() while observing NavLink.inputId() as well as using sometimes tags$a() instead of NavLink().

Below a minimal example of the issue with the workaround (commented):

library(shiny)
library(reactRouter)
library(bslib)

ui <- HashRouter(
  bslib::page(
    reactRouter::Link.shinyInput(
      inputId = "home",
      to = "/", 
      h3("reactRouter with dynamic routes", class = "m-3"),
      style = "text-decoration: none; color: black"
    ),
    Routes(
      Route(
        path = "/", 
        element = div(
          # tags$a() necessary instead of NavLink.shinyInput()
          tags$a(
            href = "#/1", # or "#/1/overview"
            "Project 1"
          ),
          tags$a(
            href = "#/2",
            "Project 2"
          )
        )
      ),
      Route(
        path = "/:id/*", 
        element = div(
          NavLink.shinyInput(
            inputId = "overview",
            to = "overview",
            "Overview"
          ),
          NavLink.shinyInput(
            inputId = "analysis",
            to = "analysis",
            "Analysis"
          ),
          Outlet()
        ),
        reactRouter::Route(
          path = "overview",
          element = uiOutput("uiOverview")
        ),
        reactRouter::Route(
          path = "analysis",
          element = uiOutput("uiAnalysis")
        )
      )
    )
  )
)

server <- function(input, output, session) {
  
  # FIX HERE
  # Necessary to update `url_hash` to get "" (homepage), "1/analysis" and "2/analysis"
  # observeEvent(c(input$home, input$overview, input$analysis), {
  #   session$reload()
  # })
  
  url_hash <- shiny::reactiveVal(value = NA)

  # update reactive values based on url hash
  shiny::observe({
    current_url_hash <- session$clientData$url_hash
    print(current_url_hash)
    url_hash(current_url_hash)
  })
  
  output$uiOverview <- renderUI({
    url_hash()
  })
  output$uiAnalysis <- renderUI({
    url_hash()
  })
}

shinyApp(ui, server)

[lgnbhl]

A simple fix is to add reloadDocument = TRUE to all NavLink() and Link() arguments. I think it makes sense to make reloadDocument = TRUE the default argument (by default FALSE in React Router v6) in the NavLink() and Link() R functions given how R shiny works.

library(shiny)
library(reactRouter)
library(bslib)

ui <- HashRouter(
  bslib::page(
    Link(
      inputId = "home",
      to = "/", 
      h3("reactRouter with dynamic routes", class = "m-3"),
      style = "text-decoration: none; color: black",
      reloadDocument = TRUE
    ),
    Routes(
      Route(
        path = "/", 
        element = div(
          NavLink(
            to = "1/overview",
            "Project 1",
            reloadDocument = TRUE
          ),
          NavLink(
            to = "2",
            "Project 2",
            reloadDocument = TRUE
          )
        )
      ),
      Route(
        path = "/:id/*", 
        element = div(
          NavLink(
            to = "overview",
            "Overview",
            reloadDocument = TRUE
          ),
          NavLink(
            to = "analysis",
            "Analysis",
            reloadDocument = TRUE
          ),
          Outlet()
        ),
        reactRouter::Route(
          path = "overview",
          element = uiOutput("uiOverview")
        ),
        reactRouter::Route(
          path = "analysis",
          element = uiOutput("uiAnalysis")
        )
      )
    )
  )
)

server <- function(input, output, session) {
  
  url_hash <- shiny::reactiveVal(value = NA)
  
  # update reactive values based on url hash
  shiny::observe({
    location <- useLocation()$hash
    print(location)
    current_url_hash <- session$clientData$url_hash
    print(current_url_hash)
    url_hash(current_url_hash)
  })
  
  output$uiOverview <- renderUI({
    url_hash()
  })
  output$uiAnalysis <- renderUI({
    url_hash()
  })
}

shinyApp(ui, server)