Can't use waiter_preloader with hostess in a module

[Camil88]

Hi, I would like to add loading bar to the preloader. Loading bar would reflect the progress made in the back end. When everything's ready then they would all disappear. I added for loop to reflect server computations. Unfortunately, I can't see any loading bar under "Loading data..." title. I modularized my app but even without modules it doesn't work. How can I add hostess to waiter in below case and make loading bar reflecting real loading time on server side (because here in example I mimicked server computations using for loop, I don't want that)?

library(shiny)
library(waiter)

moduleServer <- function(id, module) {
   callModule(module, id)
}

mod_ui <- function(id) {
   ns <- NS(id)

   tagList(  
   url <- "https://www.freecodecamp.org/news/content/images/size/w2000/2020/04/w-qjCHPZbeXCQ-unsplash.jpg",

   use_waiter(),
   use_hostess(),

   waiter_preloader(html = h1("Loading data..."), image = url,
   hostess_loader(
      id = "loader",
      preset = "circle",
      text_color = "white",
      class = "label-center",
      center_page = TRUE)
      )
   )
}

# Server #
mod_server <- function(id){
   moduleServer(id, function(input, output, session) {
      ns <- session$ns
      hostess <- Hostess$new(ns("loader"))

     # I don't want this loop, bar should load to 100% and disappear when server is ready
      for(i in 1:10){
         Sys.sleep(runif(1) / 2)
         hostess$set(i * 10)
      }
      waiter_hide()
   })

}

# App #
ui <- fluidPage(
      mod_ui("test_ui")
)

server <- function(input, output, session) {
   mod_server("test_ui")
}

shinyApp(ui = ui, server = server)

EDIT: removing html from waiter_preloader makes loading circle visible but I need html conent here as well, why it doesn't work?

[JohnCoene]

Apologies, you opened this issue right at the start of a week off. It's definitely a bug, I'll look into it.

[Camil88]

Ok, no problem:) Please let us know once it's fixed, thanks in advance!

[JohnCoene]

There was both a bug with the hostess and issues with your markup: the mod_ui is not right.

Reinstall to get the bug fix and use the corrected markup below.

library(shiny)
devtools::load_all()

mod_ui <- function(id) {
  ns <- NS(id)

  url <- "https://www.freecodecamp.org/news/content/images/size/w2000/2020/04/w-qjCHPZbeXCQ-unsplash.jpg"

  tagList(  
    useWaiter(),
    useHostess(),
    waiter_preloader(
      html = div(
        h2("Loading data..."),
        hostess_loader(
          id = "loader",
          preset = "circle",
          text_color = "white",
          class = "label-center",
          center_page = TRUE
        )
      ),
      image = url
    )
  )
}

# Server #
mod_server <- function(id){
  moduleServer(id, function(input, output, session) {
    ns <- session$ns
    hostess <- Hostess$new("loader")

    # I don't want this loop, bar should load to 100% and disappear when server is ready
    for(i in 1:10){
        Sys.sleep(runif(1) / 2)
        hostess$set(i * 10)
    }
    waiter_hide()
  })

}

# App #
ui <- fluidPage(
  mod_ui("test_ui")
)

server <- function(input, output, session) {
  mod_server("test_ui")
}

shinyApp(ui = ui, server = server)

Feel free to reopen if this does not fix the issue!

[Camil88]

Thank you, it works fine ;)