How do I link a box on the home tab to another tab in shiny app?

Question

Reproducible code below. I have a shiny app with several tabs, including a "Home" tab. On the Home tab, I would like to include a box with a link to "Tab 2". Meaning when the box is clicked, it takes the user to Tab 2. Additionally, I would also love to have the box do some sort of highlight when a user hovers over it in order to make it easier to recognize that the box is a hyperlink to something. How do I make this work?

library(tidyverse)
library(DT)
library(shiny)
library(shinydashboard)
library(shinyWidgets)


ui <- navbarPage(
    useShinydashboard(),
    
    tabPanel(
        title = "Home",
        
        box(
            title = "Box to link to tab2",
            status = "primary",
            width = 3
        )
    ),
    
    tabPanel(
        title = "Tab 1"
    ),
    
    tabPanel(
        title = "Tab 2",
        dataTableOutput("mtcars_table")
    )
    
    

)

server <- function(input, output) {
    
    output$mtcars_table <- DT::renderDataTable({mtcars})

    
}

shinyApp(ui, server)

Yes I have see several examples related to this but I can't seem to make them work for this particular case.

Answer 1

You could use an actionLink along with updateTabItems. Please check the following:

library(DT)
library(shiny)
library(shinydashboard)
library(shinyWidgets)

ui <- navbarPage(
  useShinydashboard(),
  tabPanel(
    title = "Home",
    box(
      title = actionLink("tab2link", label = "Box to link to tab2"),
      status = "primary",
      width = 3
    )
  ),
  tabPanel(
    title = "Tab 1"
  ),
  tabPanel(
    title = "Tab 2",
    dataTableOutput("mtcars_table")
  ),
  id = "navbar_id"
)

server <- function(input, output, session) {
  observeEvent(input$tab2link, {
    updateTabItems(session, inputId = "navbar_id", selected = "Tab 2")
  })
  
  output$mtcars_table <- DT::renderDataTable({mtcars})
}

shinyApp(ui, server)