rshiny

Multiple Web application R shiny


Assuming I have 2 action buttons as a starting page 'Client' & 'Employee' as shown below, and for each option, there is a different web application. enter image description here

when the user clicks the 'Client' button I need the following code to be run:

library(shiny)

ui <- 
navbarPage(
"The Client Web",
tabPanel("Section1 "),
tabPanel(" Section1 2")
)

server <- function(input, output,session){

}

shinyApp(ui = ui, server = server)

and when the user clicks the 'Employee' button I need the following code to be run:

 library(shiny)

 ui <- 
 navbarPage(
 "The Employee Web",
 tabPanel("Component 1"),
 tabPanel("Component 2"),
  tabPanel("Component 3")
  )

  server <- function(input, output,session){

  }

 shinyApp(ui = ui, server = server)

I need both of the web applications in one app depending on the type of the user either 'Client' or 'Employee'. Thank you in advance!


Solution

  • Using JavaScript

    I would do it using Javascript code to hide/show either of the pages.

    You have to create your app with de buttons and both navbarpages.

    library(shiny)
    
    ui <- fluidPage(
      # Buttons
      actionButton('clientsBtn', 'Clients'),
      actionButton('employeeBtn', 'Employee'),
      
      # Employee pag
      div(
        class = 'employees-page',
        navbarPage(
          "The Employee Web",
          tabPanel("Component 1"),
          tabPanel("Component 2"),
          tabPanel("Component 3")
        )
      ),
      
      # Clients page
      div(
        class = 'clients-page',
        navbarPage(
          "The Client Web",
          tabPanel("Section1 "),
          tabPanel(" Section1 2")
        )
      ),
    
      # Javascript to control de page logic
    includeScript('script.js')
    )
    
    server <- function(input, output,session){
      
      
    }
    
    shinyApp(ui = ui, server = server)
    

    The script.js file is just a text file with that extension.

    // hide by default the clients page
    $('.clients-page').hide(); 
    
    $('#clientsBtn').on('click', () => { 
      $('.employees-page').hide(); 
      $('.clients-page').show();
    })
    
    $('#employeeBtn').on('click', ()=>{ 
      $('.employees-page').show(); 
      $('.clients-page').hide(); 
    })
    

    enter image description here

    Individual pages using shiny.router

    As I promised, here is the approach using {shiny.router} to accomplish what you want.

    
    library(shiny)
    library(shiny.router)
    
    # The root page is separated from clients and employee pages
    # and contains two buttons/links that takes you the destination
    # you wish
    
    root_page <- tagList(
      tags$a(
      div(class='btn btn-default', id='clientsBtn', 'Clients'),
      href=route_link('clients')
      ),
      
      tags$a(
        div(class='btn btn-default', id='employeeBtn', 'Employee'), 
        href=route_link('employees')
        )
    )
    
    # The employee and clients page should include a button/link
    # to take you back to the root page. I place the button in the
    # first tabpanel of each page, but for better ux is good idea
    # if you place it in all of them. Consider change its style and
    # position using css configuration.
    
    employee_page <- tagList(
      navbarPage(
        "The Employee Web",
        tabPanel(
          "Component 1",
          tags$a(
            div(class='btn btn-default', id='home1', 'Home'), 
            href=route_link('/')
          )
          ),
        tabPanel("Component 2"),
        tabPanel("Component 3")
      )
    )
    
    
    clients_page <- tagList(
      navbarPage(
        "The Client Web",
        tabPanel(
          "Section1 ",
          tags$a(
            div(class='btn btn-default', id='home1', 'Home'), 
            href=route_link('/')
          )
          ),
        tabPanel(" Section1 2")
      )
    )
    
    router <- make_router(
      route("/", root_page),
      route("employees", employee_page),
      route("clients", clients_page)
    )
    
    ui <- fluidPage(
      router$ui
    )
    
    server <- function(input, output, session) {
      router$server(input, output, session)
    }
    
    shinyApp(ui, server)
    

    enter image description here