bs4Dash (version 2.3.3)

userMessages: AdminLTE3 user message container

Description

userMessages creates a user message container. Maybe inserted in a box.

userMessage creates a user message html element.

updateUserMessages allows to interact with a userMessages container, such as sending, removing or editing messages.

Usage

userMessages(..., id = NULL, status, width = 4, height = NULL)
userMessage(
  ...,
  author = NULL,
  date = NULL,
  image = NULL,
  type = c("sent", "received")
)
updateUserMessages(
  id,
  action = c("add", "remove", "update"),
  index = NULL,
  content = NULL,
  session = shiny::getDefaultReactiveDomain()
)

Arguments

...

Message text.

id

userMessages to target.

status

Messages status. Valid colors are defined as follows:

• primary: bs4Dash:::rd_color_tag("#007bff").

• secondary: bs4Dash:::rd_color_tag("#6c757d").

• info: bs4Dash:::rd_color_tag("#17a2b8").

• success: bs4Dash:::rd_color_tag("#28a745").

• warning: bs4Dash:::rd_color_tag("#ffc107").

• danger: bs4Dash:::rd_color_tag("#dc3545").

• gray-dark: bs4Dash:::rd_color_tag("#343a40").

• gray: bs4Dash:::rd_color_tag("#adb5bd").

• white: bs4Dash:::rd_color_tag("#fff").

• indigo: bs4Dash:::rd_color_tag("#6610f2").

• lightblue: bs4Dash:::rd_color_tag("#3c8dbc").

• navy: bs4Dash:::rd_color_tag("#001f3f").

• purple: bs4Dash:::rd_color_tag("#605ca8").

• fuchsia: bs4Dash:::rd_color_tag("#f012be").

• pink: bs4Dash:::rd_color_tag("#e83e8c").

• maroon: bs4Dash:::rd_color_tag("#d81b60").

• orange: bs4Dash:::rd_color_tag("#ff851b").

• lime: bs4Dash:::rd_color_tag("#01ff70").

• teal: bs4Dash:::rd_color_tag("#39cccc").

• olive: bs4Dash:::rd_color_tag("#3d9970").

width

Container width: between 1 and 12.

height

Container height.

author

Message author.

date

Message date.

image

Message author image path or url.

type

Message type: c("sent", "received").

action

Action to perform: add, remove or update.

index

Index of item to update or remove.

content

New message content in a list. For actions like add and update only! See example.

session

Shiny session object.

Author

David Granjon,

Examples

if (interactive()) {
 library(shiny)
 library(bs4Dash)
 
 shinyApp(
  ui = dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody(
     box(
      title = "Box with messages",
      solidHeader = TRUE,
      status = "warning",
      userMessages(
       width = 12,
       status = "teal",
       userMessage(
         author = "Alexander Pierce",
         date = "20 Jan 2:00 pm",
         image = "https://adminlte.io/themes/AdminLTE/dist/img/user1-128x128.jpg",
         type = "sent",
         "Is this template really for free? That's unbelievable!"
       ),
       userMessage(
         author = "Sarah Bullock",
         date = "23 Jan 2:05 pm",
         image = "https://adminlte.io/themes/AdminLTE/dist/img/user3-128x128.jpg",
         type = "received",
         "You better believe it!"
       )
      )
     ),
     userMessages(
       width = 6,
       status = "danger",
        userMessage(
         author = "Alexander Pierce",
         date = "20 Jan 2:00 pm",
         image = "https://adminlte.io/themes/AdminLTE/dist/img/user1-128x128.jpg",
         type = "received",
         "Is this template really for free? That's unbelievable!"
       ),
       userMessage(
         author = "Sarah Bullock",
         date = "23 Jan 2:05 pm",
         image = "https://adminlte.io/themes/AdminLTE/dist/img/user3-128x128.jpg",
         type = "sent",
         "You better believe it!"
       )
      )
    ),
    title = "user Message"
  ),
  server = function(input, output) { }
 )
}

if (interactive()) {
 library(shiny)
 library(bs4Dash)
 
 shinyApp(
  ui = dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody(
      fluidRow(
        actionButton("remove", "Remove message"),
        actionButton("add", "Add message"),
        actionButton("update", "Update message")
      ),
      numericInput("index", "Message index:", 1, min = 1, max = 3),
      br(),
      br(),
      userMessages(
        width = 6,
        status = "danger",
        id = "message",
        userMessage(
          author = "Alexander Pierce",
          date = "20 Jan 2:00 pm",
          image = "https://adminlte.io/themes/AdminLTE/dist/img/user1-128x128.jpg",
          type = "received",
          "Is this template really for free? That's unbelievable!"
        ),
        userMessage(
          author = "Sarah Bullock",
          date = "23 Jan 2:05 pm",
          image = "https://adminlte.io/themes/AdminLTE/dist/img/user3-128x128.jpg",
          type = "sent",
          "You better believe it!"
        )
      )
    ),
    title = "user Message"
  ),
  server = function(input, output, session) {
    observeEvent(input$remove, {
      updateUserMessages("message", action = "remove", index = input$index)
    })
    observeEvent(input$add, {
      updateUserMessages(
        "message", 
        action = "add", 
        content = list(
          author = "David",
          date = "Now",
          image = "https://i.pinimg.com/originals/f1/15/df/f115dfc9cab063597b1221d015996b39.jpg",
          type = "received",
          text = tagList(
           sliderInput(
            "obs", 
            "Number of observations:",
            min = 0, 
            max = 1000, 
            value = 500
           ),
           plotOutput("distPlot")
          )
        )
      )
    })
    
    output$distPlot <- renderPlot({
     hist(rnorm(input$obs))
    })
    
    observeEvent(input$update, {
      updateUserMessages(
        "message", 
        action = "update", 
        index = input$index,
        content = list(
         text = tagList(
          appButton(
           inputId = "reload",
           label = "Click me!", 
           icon = icon("arrows-rotate"), 
           dashboardBadge(1, color = "primary")
          )
         )
        )
      )
    })
    
    observeEvent(input$reload, {
     showNotification("Yeah!", duration = 1, type = "default")
    })
  }
 )
}