rstudio / sortable

R htmlwidget for Sortable.js
https://rstudio.github.io/sortable/
Other
131 stars 29 forks source link

Example Shiny app with bucket list triggers errors #96

Closed mfahlberg824 closed 1 month ago

mfahlberg824 commented 1 year ago

When I copy and paste the example bucket list app exactly, it throws up a couple of errors & not sure how to fix the problem to make the app work.

Warning: Error in $: Can't access reactive value 'btnUpdateBucket' outside of reactive consumer. ℹ Do you need to wrap inside reactive() or observe()? 47: 46: signalCondition 45: signal_abort 44: rlang::abort 43: $.reactivevalues 40: server [#25] 3: runApp 2: print.shiny.appobj 1: Error in input$btnUpdateBucket : Can't access reactive value 'btnUpdateBucket' outside of reactive consumer. ℹ Do you need to wrap inside reactive() or observe()? Warning: Error in update_bucket_list: unused argument (text = paste("You pressed the button", counter_bucket(), "times")) 47: observe [#18] 46: 3: runApp 2: print.shiny.appobj 1:

andrie commented 1 year ago

Which version of sortable are you using?

SubieG commented 1 year ago

@andrie @mfahlberg824 fwiw, I also had issues with the bucket list example when running sortable v 0.5.0 and R 4.0.2 because

  1. update_rank_list wasn't exported (looks like there is a PR to do that now)
  2. update_bucket_list has the arg header = (not text =) <<< this was your error

Warning: Error in update_bucket_list: unused argument (text =

  1. %>% from magrittr needed to be loaded

So, this worked for me:

## Example shiny app with bucket list

library(shiny)
library(sortable)
library(magrittr)

ui <- fluidPage(
  tags$head(
    tags$style(HTML(".bucket-list-container {min-height: 350px;}"))
  ),
  fluidRow(
    column(
      tags$b("Exercise"),
      actionButton("btnUpdateBucket", label = "Update bucket list title"),
      actionButton("btnUpdateRank", label = "Update rank list title"),
      width = 12,
      bucket_list(
        header = "Drag the items in any desired bucket",
        group_name = "bucket_list_group",
        orientation = "horizontal",
        add_rank_list(
          text = "Drag from here",
          labels = list(
            "one",
            "two",
            "three",
            htmltools::tags$div(
              htmltools::em("Complex"), " html tag without a name"
            ),
            "five" = htmltools::tags$div(
              htmltools::em("Complex"), " html tag with name: 'five'"
            )
          ),
          input_id = "rank_list_1"
        ),
        add_rank_list(
          text = "to here",
          labels = NULL,
          input_id = "rank_list_2"
        )
      )
    )
  ),
  fluidRow(
    column(
      width = 12,
      tags$b("Result"),
      column(
        width = 12,

        tags$p("input$rank_list_1"),
        verbatimTextOutput("results_1"),

        tags$p("input$rank_list_2"),
        verbatimTextOutput("results_2"),

        tags$p("input$bucket_list_group"),
        verbatimTextOutput("results_3")
      )
    )
  )
)

server <- function(input, output, session) {
  output$results_1 <-
    renderPrint(
      input$rank_list_1 # This matches the input_id of the first rank list
    )
  output$results_2 <-
    renderPrint(
      input$rank_list_2 # This matches the input_id of the second rank list
    )
  output$results_3 <-
    renderPrint(
      input$bucket_list_group # Matches the group_name of the bucket list
    )

  # test updating the bucket list label
  counter_bucket <- reactiveVal(1)
  observe({
    update_bucket_list(
      "bucket_list_group",
      header = paste("You pressed the button", counter_bucket(), "times"),
      session = session
    )
    counter_bucket(counter_bucket() + 1)
  }) %>%
    bindEvent(input$btnUpdateBucket)

  # test updating the rank list label
  counter_rank <- reactiveVal(1)
  observe({
    sortable:::update_rank_list(
      "rank_list_1",
      text = paste("You pressed the button", counter_rank(), "times"),
      session = session
    )
    counter_rank(counter_rank() + 1)
  }) %>%
    bindEvent(input$btnUpdateRank)
}

shinyApp(ui, server)
andrie commented 1 month ago

Thank you for this hint.

I believe this has now been fixed in the current development version on github.