[Bug]: verbatim_popup has duplicated buttons

[m7pr]

Show R Code and Session Info link also have those duplicated buttons, but I think the root cause is that they use verbatim_popup

What happened?

When running the example from ?verbatim_popup I run at the issue of duplicated set of buttons: Copy to Clipboard and Dismiss.

library(shiny)
ui <- fluidPage(verbatim_popup_ui("my_id", button_label = "Open popup"))
srv <- function(input, output) {
  verbatim_popup_srv(
    "my_id",
    "if (TRUE) { print('Popups are the best') }",
    title = "My custom title",
    style = TRUE
  )
}
if (interactive()) shinyApp(ui, srv)

Relevant log output

 sessionInfo()
R version 4.3.0 (2023-04-21 ucrt)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 11 x64 (build 22621)

Matrix products: default


locale:
[1] LC_COLLATE=English_Europe.utf8 
[2] LC_CTYPE=English_Europe.utf8   
[3] LC_MONETARY=English_Europe.utf8
[4] LC_NUMERIC=C                   
[5] LC_TIME=English_Europe.utf8    

time zone: Europe/Berlin
tzcode source: internal

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods  
[7] base     

other attached packages:
[1] teal.widgets_0.4.2.9005 teal_0.15.2.9003       
[3] shinytest2_0.3.1        testthat_3.2.1         
[5] teal.slice_0.5.0.9004   teal.data_0.5.0        
[7] teal.code_0.5.0.9001    shiny_1.8.0            
[9] rvest_1.0.3            

loaded via a namespace (and not attached):
 [1] pingr_2.0.2              bslib_0.6.1             
 [3] xfun_0.42                shinyjs_2.1.0           
 [5] htmlwidgets_1.6.4        devtools_2.4.5          
 [7] remotes_2.4.2.1          websocket_1.4.1         
 [9] processx_3.8.2           callr_3.7.5             
[11] vctrs_0.6.5              tools_4.3.0             
[13] ps_1.7.5                 curl_5.0.0              
[15] tibble_3.2.1             fansi_1.0.6             
[17] R.oo_1.25.0              pkgconfig_2.0.3         
[19] checkmate_2.3.1          desc_1.4.3              
[21] R.cache_0.16.0           lifecycle_1.0.4         
[23] compiler_4.3.0           stringr_1.5.1           
[25] brio_1.1.4               fontawesome_0.5.2       
[27] chromote_0.2.0           codetools_0.2-19        
[29] httpuv_1.6.11            sass_0.4.8              
[31] htmltools_0.5.7          usethis_2.2.2           
[33] yaml_2.3.8               jquerylib_0.1.4         
[35] later_1.3.1              pillar_1.9.0            
[37] crayon_1.5.2             urlchecker_1.0.1        
[39] R.utils_2.12.2           ellipsis_0.3.2          
[41] cachem_1.0.8             sessioninfo_1.2.2       
[43] mime_0.12                styler_1.10.1           
[45] digest_0.6.33            stringi_1.7.12          
[47] rematch2_2.1.2           diffobj_0.3.5           
[49] purrr_1.0.1              rprojroot_2.0.4         
[51] fastmap_1.1.1            grid_4.3.0              
[53] cli_3.6.1                logger_0.2.2            
[55] magrittr_2.0.3           pkgbuild_1.4.3          
[57] utf8_1.2.4               withr_3.0.0             
[59] teal.reporter_0.2.1.9014 waldo_0.5.2             
[61] promises_1.2.0.1         backports_1.4.1         
[63] rmarkdown_2.25           httr_1.4.7              
[65] globals_0.16.2           R.methodsS3_1.8.2       
[67] memoise_2.0.1            evaluate_0.23           
[69] knitr_1.45               miniUI_0.1.1.1          
[71] profvis_0.3.8            rlang_1.1.1             
[73] Rcpp_1.0.10              xtable_1.8-4            
[75] glue_1.6.2               selectr_0.4-2           
[77] formatR_1.14             xml2_1.3.6              
[79] pkgload_1.3.4            rstudioapi_0.15.0       
[81] jsonlite_1.8.8           teal.logger_0.1.3.9007  
[83] R6_2.5.1                 fs_1.6.3 

Code of Conduct

• I agree to follow this project's Code of Conduct.

Contribution Guidelines

• I agree to follow this project's Contribution Guidelines.

Security Policy

• I agree to follow this project's Security Policy.

[m7pr]

Hey @donyunardi @lcd2yyz tagging you in here. Just curious if duplicated buttons in verbatim_popup modal are something we intentionally wanted, or is it an unwanted duplication? If the duplication is not desired, then the PR fixing the issue is here #234

[pawelru]

That's actually a feature :) We started with buttons on the bottom but we got a feedback that users need to scroll a lot in order to see them so they requested to put them at the top. That's the story but I think I understand your point and this might be confusing a little. Happy to enhance it!

[m7pr]

I was afraid it's a feature :)

[lcd2yyz]

I was not involved in the decision for this feature, but even before reading the back story from @pawelru , my thought was exactly the same. It may not be as obvious from your example, but applied on actual studies with some complex analysis modules, code can get very long. As a user, I wouldn't want to scroll all the way to the bottom (or back to the top) in order to copy/close the codes.

But some prelim thoughts for feature enhancement are

1. Remove the "Dismiss" button, because user could simply click outside of the pop-up to close it.
2. Fixing the size of the pop-up window, and allow scrolling inside code display area, so user would always have access to the "Copy to Clipboard", no matter which part of the code they are reading. At the moment, window width seems to be fixed (able to scroll horizontally), is it possible to extend this to height as well?

[m7pr]

@donyunardi what are your thoughts, do you think we can examine this during the next iteration?

[donyunardi]

Sure, let's enhance this.

I like the second point that @lcd2yyz pointed out.
If there's no scrolling (or scrolling inside the code display area), then there really is no need to repeat the button.

As for dismissal, another alternative is to add an "X" icon to the top-right of the window.

Before we proceed with this, @lcd2yyz, is it worth checking with some of our super users to see if this is worth the effort?

[chlebowa]

2. At the moment, window width seems to be fixed (able to scroll horizontally), is it possible to extend this to height as well?

It's a simple CSS modification.

[lcd2yyz]

Before we proceed with this, @lcd2yyz, is it worth checking with some of our super users to see if this is worth the effort?

If it's a simple fix as @chlebowa suggested, let's go ahead.
Once vertical scrolling inside the code display area is enabled, let's remove the duplicated buttons as well.