Appsilon / shiny.react

Use React in Shiny applications.
https://appsilon.github.io/shiny.react
GNU Lesser General Public License v3.0
96 stars 12 forks source link

Support progress indicators #22

Open kamilzyla opened 3 years ago

kamilzyla commented 3 years ago

With Shiny it is possible to report progress of a long running computation (using either the functional or object-oriented API). Many React libraries provide components which could be used instead (e.g. Spinner and ProgressIndicator from Fluent UI), however it is difficult to use them as Shiny is super vigilant about delaying any rendering until all computations are finished. It is possible to hack around this problem to some extent, e.g.:

library(shiny)
library(shiny.fluent)

shinyApp(
  ui = Stack(tokens = list(childrenGap = 10), style = list(width = 200),
    PrimaryButton.shinyInput("start", text = "Start Computation"),
    reactOutput("spinner")
  ),
  server = function(input, output) {
    computing <- reactiveVal(FALSE)
    trigger <- debounce(computing, 5) # Enough delay for Shiny to render the Spinner first
    observeEvent(input$start, computing(TRUE))
    observeEvent(trigger(), {
      if (trigger()) {
        Sys.sleep(3) # Long computation
        computing(FALSE)
      }
    })
    output$spinner <- renderReact({
      if (computing()) Spinner(size = 3)
    })
  }
)

Still, this is far from being a drop-in replacement for the progress reporting functionality in base Shiny.

kamilzyla commented 2 years ago

It would be great to be able to use progress indicators in a similar fashion to this (Slack discussion):

plotly::plotlyOutput("plot") |> shinycssloaders::withSpinner()
OrangeIcecubes commented 1 month ago

Thanks for sharing, very helpful