two "remove" icons in filtered filter = 'top'?

alanfarahani commented 7 months ago

Hi all,

I'm persistently encountering something in my DT tables with filter = 'top' that I'm not sure is a bug or a feature.

I have tried this in bslib, bs4Dash, and shinydashboardplus. See the MREs below.

Namely, no matter the combination of bootstrap versions, themes, or presets, in conjunction with any of the DT styles (default, bootstrap 4, 5, etc.), there are always two "remove filter" icons -- one in the search field itself (what I would take to be the default behavior), and one appearing in the bottom left hand corner. The sole exception is shinydashboardplus.

Is this in fact supposed to be default behavior?

I can close this issue if I should escalate this to bslib / bs4Dash instead.

Thanks.

Examples:

bslib: theme_shiny

shinydashboardplus: shinydbplus_dt_filter

bslib MRE:

library(shiny)
library(bslib)
library(DT)

# bslib UI
ui <- page_fluid(
  theme = bs_theme(
    #version = 5,
    preset = "shiny",
    #bootswatch = "cerulean",
  ),
  title = "Test",
  card(
    card_header("Data table"),
    height = 600,
    card_body(
      min_height = 500,
      DT::dataTableOutput("table")
    )
  )
)

# Server
server <- function(input, output, session) {
  output$table <-  DT::renderDataTable({
    DT::datatable(
      mtcars,
      style = "bootstrap5",
      filter = "top"
    )
  })
}

shinyApp(ui, server)

shinydashboardplus MRE:

library(shiny)
library(shinydashboard)
library(shinydashboardPlus)

shinyApp(
  ui = dashboardPage(
    title = "Basic Dashboard",
    header = dashboardHeader(),
    sidebar = dashboardSidebar(),
    controlbar = dashboardControlbar(),
    footer = dashboardFooter(),
    body = dashboardBody(
      fluidRow(
        column(width = 12,
               box(
                 width = NULL,
                 title = "Data table",
                 DT::dataTableOutput("table")
               ))
      )
    )
  ),
  server = function(input, output) {

    output$table <-  DT::renderDataTable({
      DT::datatable(
        mtcars,
        style = "bootstrap4",
        filter = "top"
      )
    })

  }
)

Session Info


  ─ Session info ──────────────────────────────────────────────────────────────────────
setting  value
version  R version 4.3.0 (2023-04-21 ucrt)
os       Windows 10 x64 (build 19045)
system   x86_64, mingw32
ui       RStudio
language (EN)
collate  English_United States.utf8
ctype    English_United States.utf8
tz       America/Los_Angeles
date     2023-11-18
rstudio  2023.06.1+524 Mountain Hydrangea (desktop)
pandoc   NA

─ Packages ──────────────────────────────────────────────────────────────────────────
package     * version    date (UTC) lib source
bslib       * 0.5.1.9000 2023-11-18 [1] Github (rstudio/bslib@02d5c0c)
cachem        1.0.8      2023-05-01 [1] CRAN (R 4.2.3)
callr         3.7.3      2022-11-02 [1] CRAN (R 4.3.0)
cli           3.6.1      2023-03-23 [1] CRAN (R 4.2.3)
crayon        1.5.2      2022-09-29 [1] CRAN (R 4.3.0)
crosstalk     1.2.0      2021-11-04 [1] CRAN (R 4.3.0)
devtools      2.4.5      2022-10-11 [1] CRAN (R 4.3.0)
digest        0.6.33     2023-07-07 [1] CRAN (R 4.3.2)
DT          * 0.30       2023-10-05 [1] CRAN (R 4.3.2)
ellipsis      0.3.2      2021-04-29 [1] CRAN (R 4.2.1)
fansi         1.0.4      2023-01-22 [1] CRAN (R 4.2.3)
fastmap       1.1.1      2023-02-24 [1] CRAN (R 4.2.3)
fs            1.6.3      2023-07-20 [1] CRAN (R 4.3.1)
glue          1.6.2      2022-02-24 [1] CRAN (R 4.2.1)
htmltools     0.5.7      2023-11-03 [1] CRAN (R 4.3.2)
htmlwidgets   1.6.2      2023-03-17 [1] CRAN (R 4.3.0)
httpuv        1.6.11     2023-05-11 [1] CRAN (R 4.2.3)
jquerylib     0.1.4      2021-04-26 [1] CRAN (R 4.3.0)
jsonlite      1.8.7      2023-06-29 [1] CRAN (R 4.3.2)
later         1.3.1      2023-05-02 [1] CRAN (R 4.2.3)
lifecycle     1.0.4      2023-11-07 [1] CRAN (R 4.3.2)
magrittr      2.0.3      2022-03-30 [1] CRAN (R 4.2.1)
memoise       2.0.1      2021-11-26 [1] CRAN (R 4.3.0)
mime          0.12       2021-09-28 [1] CRAN (R 4.2.0)
miniUI        0.1.1.1    2018-05-18 [1] CRAN (R 4.3.0)
pillar        1.9.0      2023-03-22 [1] CRAN (R 4.3.0)
pkgbuild      1.4.2      2023-06-26 [1] CRAN (R 4.3.1)
pkgconfig     2.0.3      2019-09-22 [1] CRAN (R 4.3.0)
pkgload       1.3.2.1    2023-07-08 [1] CRAN (R 4.3.1)
prettyunits   1.1.1      2020-01-24 [1] CRAN (R 4.3.0)
processx      3.8.2      2023-06-30 [1] CRAN (R 4.3.1)
profvis       0.3.8      2023-05-02 [1] CRAN (R 4.3.0)
promises      1.2.0.1    2021-02-11 [1] CRAN (R 4.2.1)
ps            1.7.5      2023-04-18 [1] CRAN (R 4.3.0)
purrr         1.0.1      2023-01-10 [1] CRAN (R 4.2.3)
R6            2.5.1      2021-08-19 [1] CRAN (R 4.3.0)
Rcpp          1.0.10     2023-01-22 [1] CRAN (R 4.2.3)
remotes       2.4.2.1    2023-07-18 [1] CRAN (R 4.3.1)
rlang         1.1.2      2023-11-04 [1] CRAN (R 4.3.2)
rsconnect     1.0.2      2023-08-17 [1] CRAN (R 4.3.1)
rstudioapi    0.15.0     2023-07-07 [1] CRAN (R 4.3.1)
sass          0.4.7      2023-07-15 [1] CRAN (R 4.3.2)
sessioninfo   1.2.2      2021-12-06 [1] CRAN (R 4.3.0)
shiny       * 1.8.0      2023-11-17 [1] CRAN (R 4.3.0)
stringi       1.7.12     2023-01-11 [1] CRAN (R 4.2.2)
stringr       1.5.0      2022-12-02 [1] CRAN (R 4.2.2)
tibble        3.2.1      2023-03-20 [1] CRAN (R 4.2.3)
urlchecker    1.0.1      2021-11-30 [1] CRAN (R 4.3.0)
usethis       2.2.2      2023-07-06 [1] CRAN (R 4.3.1)
utf8          1.2.3      2023-01-31 [1] CRAN (R 4.2.3)
vctrs         0.6.2      2023-04-19 [1] CRAN (R 4.2.3)
withr         2.5.0      2022-03-03 [1] CRAN (R 4.3.0)
xtable        1.8-4      2019-04-21 [1] CRAN (R 4.3.0)
yaml          2.3.7      2023-01-23 [1] CRAN (R 4.2.3)

By filing an issue to this repo, I promise that

[x] I have fully read the issue guide at https://yihui.org/issue/.
[x] I have provided the necessary information about my issue.
- If I'm asking a question, I have already asked it on Stack Overflow or RStudio Community, waited for at least 24 hours, and included a link to my question there.
- If I'm filing a bug report, I have included a minimal, self-contained, and reproducible example, and have also included xfun::session_info('DT'). I have upgraded all my packages to their latest versions (e.g., R, RStudio, and R packages), and also tried the development version: remotes::install_github('rstudio/DT').
- If I have posted the same issue elsewhere, I have also mentioned it in this issue.
[x] I have learned the Github Markdown syntax, and formatted my issue correctly.

I understand that my issue may be closed if I don't fulfill my promises.

philibe commented 7 months ago

Look at development mode (F12) if you have conflicts.

For example after I have installed some plugins by hand, I had conflicts for, and commented out some :

selectize.bootstrapX.css
awesome-bootstrap-checkbox.css

Try also to put normal in some css, after found the call at two CSS in conflict.

Example found after I had seen it by F12 :

.query-builder.bt-checkbox-glyphicons .checkbox input[type=checkbox]:checked+label::after {
             content: normal;

alanfarahani commented 7 months ago

Hi @philibe, thanks for your response.

I was aware that I could fix this issue using CSS. For those interested, in the bslib MRE I provided above, just add the following:

 tags$style(
    HTML(".glyphicon-remove-circle:before {content: normal;}")
  )

Still, I wanted to raise the issue in the event that it was worth addressing in DT itself, maybe through identifying bootstrap version conflicts and adjusting the css / jscript accordingly.

rstudio / DT

two "remove" icons in filtered filter = 'top'? #1098

Session Info