R Shiny load hidden sidebar in the background (using bs4Dash package)

Question

I've built a R Shiny dashboard using bs4Dash. This package allows me to create a bar on the right side for input selectors, so I can use the left menu for navigation. The right side bs4DashControlbar is hidden when the app launches. Problem is that if I create a selector on the server side and use uiOutput() in the ui, it doesn't render - i.e. two of my selectors aren't loading up. I discovered this is the case because the control bar starts out hidden (which I want). I'm trying to get the selectors in the controlbar to always render as if it were visible.

See my attempt below. Note that when "controlbar_collapsed" line is uncommented, my selectors load just fine. But again, I don't want the control bar to be visible on load and I further want it to always be updating even if someone hides the control bar. My attempt to fix is commented out near the bottom. I tried to use outputOptions w/ suspendWhenHidden. I think this is the right path but I can't get it to work. Or is there a better way?

library(shiny)
library(bs4Dash)

shiny::shinyApp(
  ui = bs4DashPage(
    old_school = FALSE,
    sidebar_min = TRUE,
    sidebar_collapsed = FALSE,
    #controlbar_collapsed = FALSE,  ###Uncomment this line and it loads just fine
    controlbar_overlay = TRUE,
    title = "Basic Dashboard",
    navbar = bs4DashNavbar(),
    sidebar = bs4DashSidebar(),
    controlbar = bs4DashControlbar(inputId = "Controller",
      sliderInput("slider", "Number of observations:", 1, 100, 50),
      uiOutput("TimeFrame"),
      uiOutput("Metrics")
    ),
    footer = bs4DashFooter(),
    body = bs4DashBody()
  ),
  server = function(input, output) {
    output$TimeFrame <- renderUI({selectInput("TimeFrame", "Select Time Frame:", 
                                              c("Last 01 Wks", "Last 04 Wks", "Last 13 Wks", "Last 52 Wks", "Year to Date"), 
                                              multiple=FALSE)})
    output$Metrics <- renderUI({selectInput("Metrics", "Select a Metric:", 
                                            c("Metric A", "Metric B"), 
                                            multiple=FALSE)})
    
    #outputOptions(output, "Controller", suspendWhenHidden = FALSE)  #This is what I tried
  }
)

Answer 1

library(shiny)
library(shinyjs)
library(bs4Dash)

shiny::shinyApp(
  ui = fluidPage(
    useShinyjs(),
    bs4DashPage(
      old_school = FALSE,
      sidebar_min = TRUE,
      sidebar_collapsed = FALSE,
      # controlbar_collapsed = FALSE,  ###Uncomment this line and it loads just fine
      controlbar_overlay = TRUE,
      title = "Basic Dashboard",
      navbar = bs4DashNavbar(),
      sidebar = bs4DashSidebar(),
      controlbar = bs4DashControlbar(inputId = "Controller",
                                     sliderInput("slider", "Number of observations:", 1, 100, 50),
                                     shinyjs::hidden(div(id = "MyPanel",
                                                         uiOutput("TimeFrame"),
                                                         uiOutput("Metrics")))
      ),
      footer = bs4DashFooter(),
      body = bs4DashBody()
    )),
  server = function(input, output) {
    output$TimeFrame <- renderUI({selectInput("TimeFrame", "Select Time Frame:", 
                                              c("Last 01 Wks", "Last 04 Wks", "Last 13 Wks", "Last 52 Wks", "Year to Date"), 
                                              multiple=FALSE)})
    output$Metrics <- renderUI({selectInput("Metrics", "Select a Metric:", 
                                            c("Metric A", "Metric B"), 
                                            multiple=FALSE)})
    
    observe({
      if (input$Controller) {
        shinyjs::show("MyPanel")
      } else {
        shinyjs::hide("MyPanel")
      }
    })
    # outputOptions(output, "Controller", suspendWhenHidden = FALSE)  #This is what I tried
  }
)