CODEWITHSUNDEEP
javascriptrshinyrhino
Alyssa Allsop
Alyssa Allsop

Reputation: 53

I can't get my fluent panel to close with the JS function in R using the Rhino package

When the button is clicked, it opens the panel, but when the "x" is clicked in the panel it doesn't close the panel. I am really new to Rhino so I am very stumped. I can get it to work in a plain shiny app but not through Rhino.

Here is my code in a panel.R file within app/view

box::use(
  shiny[h3, moduleServer, NS, div, reactiveVal,
        observeEvent],
  shiny.react[renderReact],
  shiny.fluent[JS, DefaultButton.shinyInput, reactOutput, Panel]
)

#' @export
ui <- function(id){
  ns <- NS(id)
  div(
    DefaultButton.shinyInput(ns("showPanel"), text = "Open panel"),
    reactOutput(ns("reactPanel"))
  )
  
  
}

#' @export
server <- function(id) {
  moduleServer(id, function(input, output, session){
    isPanelOpen <- reactiveVal(FALSE)
    output$reactPanel <- renderReact({
      Panel(
        headerText = "Sample panel",
        isOpen = isPanelOpen(),
        "Content goes here.",
        onDismiss = JS("function() { Shiny.setInputValue(ns('hidePanel'), Math.random()); }")
      )
    })
    observeEvent(input$showPanel, isPanelOpen(TRUE))
    observeEvent(input$hidePanel, isPanelOpen(FALSE))
  })
}

Here is my code in the main.R file from the app folder:

box::use(
  shiny[bootstrapPage, moduleServer, NS],
)
box::use(
  app/view/panel,
)

#' @export
ui <- function(id) {
  ns <- NS(id)
  
  bootstrapPage(
    panel$ui(ns("reactPanel"))
  )
}

#' @export
server <- function(id) {
  moduleServer(id, function(input, output, session) {
    panel$server("reactPanel")
  })
}

Upvotes: 1

Views: 174

Answers (1)

jpdugo17
jpdugo17

Reputation: 7116

We can leverage the fact that the js code is text and glue/paste the output from the ns function into it.

First, create the ns object inside the module's server ns <- session$ns Then, use a function like paste to incorporate the output of ns() function.

      Panel(
        headerText = "Sample panel",
        isOpen = isPanelOpen(),
        "Content goes here.",
        onDismiss = JS(
          paste0("function() { Shiny.setInputValue('", ns("hidePanel"), "', Math.random());}")
        )
      )

Module:

box::use(
  shiny[
    h3, moduleServer, NS, div, reactiveVal,
    observeEvent
  ],
  shiny.react[renderReact],
  shiny.fluent[JS, DefaultButton.shinyInput, reactOutput, Panel],
  glue[glue]
)

#' @export
ui <- function(id) {
  ns <- NS(id)
  div(
    DefaultButton.shinyInput(ns("showPanel"), text = "Open panel"),
    reactOutput(ns("reactPanel"))
  )
}

#' @export
server <- function(id) {
  moduleServer(id, function(input, output, session) {
    ns <- session$ns # grab the namespace from the session
    isPanelOpen <- reactiveVal(FALSE)
    output$reactPanel <- renderReact({
      Panel(
        headerText = "Sample panel",
        isOpen = isPanelOpen(),
        "Content goes here.",
        onDismiss = JS(
          glue(
            "function() { Shiny.setInputValue('<id>', Math.random());}",
            id     = ns("hidePanel"),
            .open  = "<",
            .close = ">"
          )
        )
      )
    })
    observeEvent(input$showPanel, isPanelOpen(TRUE))
    observeEvent(input$hidePanel, isPanelOpen(FALSE))
  })
}

Upvotes: 0

Related Questions