How to trigger a modalWindow from a double click event in a reactable table

Question

I'm trying to trigger a modalwindow with a doubleclick event on a cell in a reactable table. I also need the row index to display an image for the clicked row in the modal.

The following code works. It shows a window.alert in response to a double click in the last column. Yet, a modalwindow has more options and it is easier for me to code ( R not js).

library(shiny)
library(tidyverse)
library(reactable)

ui <- fluidPage(
  fluidRow(
    column(12, align = 'center',reactableOutput("tbl"))
  )
)
server <- function(input, output, session) {
  
  data = reactive({mtcars %>% tibble::rownames_to_column('car')})
  
  output$tbl = renderReactable(
    reactable(
      data(),
      columns = list(
        carb = colDef(
          sticky = "right",
          sortable = FALSE,
          cell = function(value, index, name){
            icon("globe",
                 ondblclick = sprintf("window.alert('double clicked cell %s in column %s')", index, name)
            )
          })
      ),
      compact = T,
      highlight = T,
      onClick = JS("      function(rowInfo, colInfo, column) {
        if (colInfo.id !== 'carb') {
          Shiny.setInputValue('qwert', {id:rowInfo.id, nonce:Math.random()});
        }
      }"),
      rowStyle = list(cursor = "pointer")
    )
  )
  
  observeEvent(input$qwert, {
    print(input$qwert)
    id <- input$qwert$id
    row_nr <- as.numeric(id)+1
    showModal(
      modalDialog(
        size = 'l',
        easyClose = T,
        title = data()$car[row_nr],
        "some text"
      )
    )
  })
  
   observeEvent(input$poiu, {
     print(input$poiu)
     id2 <- input$poiu$id
     row_nr2 <- as.numeric(id2)+1
     showModal(
       modalDialog(
         title = data()$car[row_nr2],
         "double click"
       )
     )
   })

}
shinyApp(ui = ui, server = server)

I tried: sprintf(Shiny.setInputValue('poiu', {nonce:Math.random()})) just to get the modal,

ondblclick = sprintf(Shiny.setInputValue('poiu', {id:%s.id, nonce:Math.random()}), index)

cell = function(value, index){ icon("globe", ondblclick = shinyjs::runjs(paste0("shiny.setInputValue('poiu',", index)) )}

None worked.

Could someone help. Thank you, Julie Reynolds

Answer 1

This works:

cell = function(value, index, name){
  icon(
    "globe",
    ondblclick = sprintf(
      "Shiny.setInputValue('poiu', {id: %d}, {priority: 'event'});", 
      index
    )
  )
}

The {priority: 'event'} replaces the dummy Math.random().