Bookmarking with shiny.fluent

[erikrenz88]

I am trying to implement some bookmarking within my Shiny app which is built on the Rhino framework, using shiny.fluent for the UI. I get the impression that I can't use the vanilla Shiny bookmarking because of the disabling of bootstrap with the package? Or am I missing something?

Anyone done complex bookmarking that could assist?

[kamilzyla]

Hi @erikrenz88 and thanks for you interest in our packages! 🙂 Have you seen our How-to: Enable Shiny bookmarking?

[erikrenz88]

Thanks @kamilzyla - I have seen that on the Rhino page, however after I follow that set up, the modal doesn’t display as a pop up but underneath all of my existing UI (I followed the shiny.fluent application tutorial for my set up and when I copied the link it didn’t pick up my inputs).

I have had success grabbing my inputs using the advanced bookmarking tutorials from Shiny, but I can’t seem to generate a modal anywhere. I can get snippets in a bit if it would be helpful.

[kamilzyla]

A minimal example of main.R which shows your problem would be certainly helpful 👍

[erikrenz88]

It is modularized at the moment with the layout so I have included the minimum of layout below as well. I can also share the minimum for the advanced bookmarking I've tried which in debugging through browser, appears to make the url correctly but the modal is never displayed.

Main.R

# Main module for the app - all other modules access through this module

## Import libraries ----
box::use(
  shiny[...],
  shiny.telemetry[...],
  shiny.fluent[Dialog, TextField, Text, DialogFooter]
)

## Import modules ----
box::use(
  app/logic/initial_query,
  app/view/filters,
  app/view/data,
  app/view/layout
)

## enable Shiny bookmarking ----
enableBookmarking()

## Export UI functions from modules to app ----
#' @export
ui <- function(id) {
  ns <- NS(id)
  shiny.telemetry::use_telemetry() # telemetry needs to be called in UI to function
  ui_chosen <- filters$ui(ns('chosen_fils')) # create dynamic UI for filters
  ui_data <- data$ui(ns('data'), ui_chosen) # create UI for data selection pane and feed in filters from above
  ui_selection <- selection$ui(ns('selection')) # create UI for selection pane
  ui_out <- out$ui(ns('out')) # create ui for output pane
  layout$ui('layout', ui_data, ui_selection, ui_out) # feed in all ui elements to layout module to format ui
}

## Export server functions from modules to app ----
#' @export
server <- function(id) {
  moduleServer(id, function(input, output, session) {

    ## Create layout for initialization and prep bookmarking ----
    observe({
      layout$server(
        'layout', 
        table = table, 
        dat = dat, 
        agg = agg, 
        filter_list = filter_list
      )
    })

Layout.R

## import necessary functions for box ----
box::use(
  shiny[...],
  shiny.fluent[Stack, fluentPage, Text, Image, HoverCard, Nav, ActionButton, DefaultButton.shinyInput, TextField, Dialog, DialogFooter, Icon],
  glue[glue],
  shiny.react[JS],
  shinyjs
)

## import other pages for layout ----
box::use(
  app/view/selection,
  app/view/data,
  app/view/out
)

## footer UI details ----
footer <- tagList()

## helper functions ----
# function to create and style overall page
makePage <- function (contents) {
  tagList(
    contents
  )
}

# function to create and style individual cards
makeCard <- function(title, content, size = 12, style = "") {
  div(
    class = glue("card ms-depth-4 ms-xs{size} ms-lg{size}"),
    style = style,
    Stack(
      tokens = list(childrenGap = 5), 
      Text(variant = "large", title, block = TRUE),
      content
    )
  )
}

#' @export
ui <- function(id, data, selection, out, chosen, request) {
  ns <- NS(id)
  
  ## header UI details ----
  header <- tagList(
    ActionButton(
      inputId = ns('menu'),
      iconProps = list('iconName' = 'CollapseMenu'),
      menuProps = menuProps,
      className = 'menubtn'
    ),
    bookmarkButton(),
    div(
      class = "page-title",
      span('PREPROD', class = "title"),
      br(),
      span('Query Data', class = "subtitle")
  )
  ## Create tooltip information ----
  tooltip <- "Analyst: Erik Renz"
  
  # create base page (without header and footer)
  query_page <- makePage(
    div(
      Stack(
        horizontal = T,
        tokens = list(childrenGap = 5),
        makeCard('Choose data', data, size = 3),
        makeCard('Current selections', selection, size = 3),
        makeCard('Results', out, size = 6)
      ),
      uiOutput('layout')
    )
  )
  
  # function to create layout of header, panes, and footer
  layout <- function(mainUI) {
    div(class = 'grid-container',
        div(class = 'header', header),
        div(class = 'main', mainUI),
        div(class = 'footer', footer)
    )
  }

#' @export
server <- function(id, table, dat, agg, filter_list) {
  moduleServer(id, function(input, output, session) {
  })
}

A screenshot of the result is here: