Sign out button disappears for a gmail user with bslib version 0.5.1
udurraniAtPresage opened this issue · 4 comments
I am not sure if this needs work from bslib or firebase but reporting here. My app server contains the regular firebase code for signing out, and the email and google login options:
server <- function(input, output, session) {
# Firebase authentication ---------------------------------------------------
f <- FirebaseUI$new(persistence = "local")$set_providers(
email = TRUE,
google = TRUE)$launch()
# Sign out ----------------------------------------------------------------
## Button for signing out
output$sign_out_button <- shiny::renderUI({
f$req_sign_in()
actionButton("signout", "Sign out")
})
## User signs out when the button with ID "signout" is clicked
observeEvent(input$signout, {
f$sign_out()
})
}
The sign out button does not appear if signed in with google. But it does appear if signed in with email.
> sessionInfo()
R version 4.3.1 (2023-06-16 ucrt)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 10 x64 (build 19045)
Matrix products: default
locale:
[1] LC_COLLATE=English_Canada.utf8 LC_CTYPE=English_Canada.utf8
[3] LC_MONETARY=English_Canada.utf8 LC_NUMERIC=C
[5] LC_TIME=English_Canada.utf8
time zone: America/Toronto
tzcode source: internal
attached base packages:
[1] stats graphics grDevices utils datasets methods
[7] base
other attached packages:
[1] shiny_1.7.5 firebase_1.0.2 bslib_0.5.1
loaded via a namespace (and not attached):
[1] jsonlite_1.8.7 dplyr_1.1.3 compiler_4.3.1
[4] promises_1.2.1 tidyselect_1.2.0 Rcpp_1.0.11
[7] later_1.3.1 jquerylib_0.1.4 fastmap_1.1.1
[10] mime_0.12 R6_2.5.1 shinyjs_2.1.0
[13] generics_0.1.3 jose_1.2.0 tibble_3.2.1
[16] openssl_2.1.0 pillar_1.9.0 rlang_1.1.1
[19] utf8_1.2.4 cachem_1.0.8 httpuv_1.6.12
[22] sass_0.4.7 cli_3.6.1 magrittr_2.0.3
[25] digest_0.6.33 rstudioapi_0.15.0 xtable_1.8-4
[28] base64enc_0.1-3 askpass_1.2.0 lifecycle_1.0.3
[31] vctrs_0.6.4 glue_1.6.2 fansi_1.0.5
[34] tools_4.3.1 pkgconfig_2.0.3 ellipsis_0.3.2
[37] htmltools_0.5.6.9001
Can you share the UI the buttons in question?
Yes. Here are the server and ui files:
UI
ui <- page_fluid(
# autoWaiter(),
useWaiter(),
waiterPreloader(),
useSever(),
# Bootstrap Theme visa bslib ----------------------------------------------
theme = bs_theme(version = 5,
primary = "#0072bc",
success = "#00a775",
base_font = font_google("Libre Franklin"),
preset = "shiny",
heading_font = font_google("Libre Franklin")
),
## Firebase UI
useFirebase(),
firebaseUIContainer(),
## Complete dashboard
uiOutput(
"logged_in_ui",
fill = TRUE
)
)
shinyUI(ui)
server
server <- function(input, output, session) {
# Firebase authentication ---------------------------------------------------
f <- FirebaseUI$new(persistence = "local")$set_providers(
email = TRUE,
google = TRUE)$launch()
# Sign out ----------------------------------------------------------------
## Button for signing out
output$sign_out_button <- shiny::renderUI({
f$req_sign_in()
actionButton("signout", "Sign out")
})
## User signs out when the button with ID "signout" is clicked
observeEvent(input$signout, {
f$sign_out()
})
# Logged-in UI ------------------------------------------------------------
## Show instructor view or user view depending on who signed in
## Another reason for creating this output is to hide/show the Firebase login UI
output$logged_in_ui <- renderUI({
f$req_sign_in()
if ("CONDITION"){
ui_dashboard_instructor2
} else {
ui_dashboard
}
})
# <OTHER CODE>
}
I have 2 UIs (ui_dashboard and ui_dashboard_instructor2) depending on who signs in. They both look something like below. The sign out button is at the end:
ui_dashboard <- page_navbar(
# Header ----------------------------------------------
header = div(
## Inform shiny to use {micromodal}
use_micromodal(),
## Use shinyjs
shinyjs::useShinyjs(),
),
# Title ----------------------------------------------
title = tags$span(
tags$img(
src = "logo.png",
width = "46px",
height = "auto",
class = "me-3"
),
"TITLE"
),
# Sidebar ----------------------------------------------
sidebar = sidebar(
width = 300,
## Accordians
accordion(
### Panel 1: Demographic information
accordion_panel(
"ONE",
),
accordion_panel(
"TWO"
),
accordion_panel(
"THREE"
),
accordion_panel(
"FOUR"
)
)
),
# Navigation panels ----------------------------------------------
## 1.
nav_panel(
"FIRST",
layout_columns(),
),
## 2.
nav_panel(
"TWO",
),
## 3.
nav_panel(
"THREE",
),
## Space between sections and sign out button
nav_spacer(),
## 4. Sign out button
nav_item(
uiOutput("sign_out_button")
)
)
And here's the global.R:
Global
# Load libraries ----------------------------------------------------------
# <ALL LIBRARY CALLS AND OTHER CODE>
# Load all functions and modules in R folder ------------------------------
x <- list.files("R")
lapply(x, FUN = function(x) source(paste0("R/", x)))
# Firebase project configuration ------------------------------------------
firebase::firebase_config(api_key = Sys.getenv("FIREBASE_API_KEY"),
project_id = Sys.getenv("FIREBASE_PROJECT_ID"),
app_id = Sys.getenv("FIREBASE_APP_ID"),
overwrite = TRUE)
@JohnCoene
I figured out what is causing the issue. It is echarts with NULL data. If I remove the echarts plot from the app, the sign out button appears. But if I include the echarts plot, the sign out button disappears for both gmail and email users.
Also, it isn't with any echarts plot. When a user has existing data (in a remote database), the following plot is created (and sign out button shows up):
data_long |>
e_charts(Var1) |>
e_radar(Var2, max = 100,
color = COLORS) |>
e_radar(Var3) |>
e_labels(
show = TRUE
) |>
e_radar_opts(
axisName = list(
color = "black",
fontFamily = "Libre Franklin",
fontSize = 18
),
# axisLabel = list(show = TRUE),
) |>
e_title("TITLE",
textStyle = list(
fontSize = 24,
fontFamily = "Libre Franklin"
)) |>
e_tooltip(trigger = "item") |>
e_legend(
textStyle = list(
fontSize = 16
)
)But when the user does not yet have data, I use NULL for data to create the plot (and sign out button disappears):
e_charts(NULL) |>
e_title("Nothing to see here.",
textStyle = list(
fontSize = 24,
fontFamily = "Libre Franklin"
))
Chrome Console shows this:
TypeError: Cannot read properties of undefined (reading 'coordinateSystem')
at ZM (echarts-en.min.js:45:392576)
at e.render (echarts-en.min.js:45:412432)
at echarts-en.min.js:45:215199
at Array.forEach (<anonymous>)
at E (echarts-en.min.js:35:5056)
at Xv (echarts-en.min.js:45:215137)
at Yv (echarts-en.min.js:45:214979)
at e.update (echarts-en.min.js:45:210388)
at e.setOption (echarts-en.min.js:45:198630)
at Object.renderValue (echarts4r.js:75:17)
(anonymous) @ shinyapp.ts:437
Current solution
I understand that this is because I am not providing a variable name to e_charts. But running this code in RStudio does not throw any errors. This is my current solution:
e_charts(mtcars, mpg) |>
e_title("Nothing to see here.",
textStyle = list(
fontSize = 24,
fontFamily = "Libre Franklin"
))
It shows the title and axes lines. But I prefer just the text. The sign out button shows up though.
Aaaah, thanks for this and sorry it occurred.
I'm guessing the error in echarts4r caused the JavaScript to stop executing.
I will transfer this issue to echarts4r and fix it there.
Thanks!