Why I do not get my data under the Load Data Panel?

Question

I am having two tabs in the navigation bar (I am trying to keep it simple, I have more, but won't matter). Now, I get my info tab the way I want it. But when I upload the module for load data, I cannot get it under 'Load Data' tab but rather under the first tab - Info .

Here is a snipped of the code (although I can give access to the repo upon request - https://github.com/gabrielburcea/grwtgolem), it is golem shiny framework and would like to keep it this way.

First, I define app_ui :

app_ui <- function(request) {
  tagList(# Leave this function for adding external resources
    golem_add_external_resources(),
    shinyjs::useShinyjs(),
    
    # Your application UI logic
    shinyUI(
      shiny::navbarPage(title = div(tags$a(img(src = "www/RGB.png", height = "50px"), "Growth Rate Explorer"),
                                    id = "navBar",
                                    theme = "www/style.css",
                                    # collapsible = TRUE,
                                    # inverse = TRUE,
                                    style = "position: relative; top: -30px; margin-left: 10px; margin-top: 5px;"),
                        header = tags$head(includeCSS("www/style.css")),# sourcing css style sheet
                        # make navigation bar collapse on smaller screens
                        windowTitle = "Growt",
                        collapsible = TRUE,
                        
                        shiny::tabPanel("Info", icon = icon("fa-light fa-info"), mod_info_app_ui("info_app_1")),
                        
                        shiny::tabPanel("Load Data", icon = icon("fa-light fa-database"), mod_load_app_ui("load_app_1"))
                        
      )
    )
  )
}

And then, I define the server_app as:

#' app_server
#'
#' @param input,output,session Internal parameters for {shiny}.
#'     DO NOT REMOVE.
#' @import shiny
#' @noRd
app_server <- function(input, output, session){

  mod_info_app_server("info_app_1")
  mod_load_app_server("load_app_1")
 
}

To reiterate, I get my load app under the info tab. Why is this happening?

I have tried for the last two days different configuration but nothing helped.

I tried to re-define the app_server with the shiny::callModule(mod_load_server, mod_load_ui_1) and it did not work whatsoever.

For your info: mod_info_app and mod_load_app:

First is mod_info_app that contains html scripts (which I won't provide, these are way too big) but this module defines the ui and server for info tab, just as golem requires:

#'mod_info_app_ui UI Function
#'
#' @description A shiny Module.
#'
#' @param id,input,output,session Internal parameters for {shiny}.
#'
#' @noRd
#'
#' @importFrom shiny NS tagList
mod_info_app_ui <- function(id){
  ns <- NS(id)
  tagList(
    tagList(shiny::tabPanel(title = "Info",
                            tags$div(
                              class = "main",
                              shiny::fluidPage(
                                htmltools::htmlTemplate("www/welcome_to_growth_rate_explorer.html"),
                                htmltools::htmlTemplate("www/info_tabs_list.html")
                              )
                            )))


  )
}

#' mod_info_app_server Server Functions
#'
#' @noRd
mod_info_app_server <- function(id){
  moduleServer( id, function(input, output, session){
    ns <- session$ns

    # Color coding
    colorCoding <- reactive({

      tagList(
        tags$b("Legend"),
        tags$p(drawBullet(color = paste(myColors[1], "; border: 1px solid black")), "Adjusted p Value > 0.05"),
        tags$p(drawBullet(color = myColors[2]), "0.01 < Adjusted p Value", HTML("&le;"), "0.05"),
        tags$p(drawBullet(color = myColors[3]), "0.001 < Adjusted p Value", HTML("&le;"), "0.01"),
        tags$p(drawBullet(color = myColors[4]), "0.0001 < Adjusted p Value", HTML("&le;"), "0.001"),
        tags$p(drawBullet(color = myColors[5]), "Adjusted p Value", HTML("&le;"), "0.0001")

      )

    })

    output$info_colorCoding <- renderUI(colorCoding()) 

   etc, etc, 





  })
}

Then comes the mod_load_app, with ui and server defined, it is a bit long but just for yourself to make yourself:

#' mod_load_app_ui UI Function
#'
#' @description A shiny Module.
#'
#' @param id,input,output,session Internal parameters for {shiny}.
#'
#' @noRd
#'
#' @importFrom shiny NS tagList
mod_load_app_ui <- function(id) {
  ns <- NS(id)
  tagList(shiny::tabPanel(
    title = "Load Data",

    tags$br(),

    shiny::sidebarLayout(
      shiny::sidebarPanel(
        hidden(
          actionButton(
            inputId = "load_loadNewButton",
            icon = icon("arrow-alt-circle-up"),
            label = "Upload new data"
          )
        ),
        # Load data
        div(
          id = "load_inputDataSpecifics",
          fileInput(
            inputId = "load_file",
            label = "Data File(s)",
            accept = c(".csv", ".xlsx"),
            multiple = TRUE
          ),
          uiOutput("load_selectColumnNamesUI"),
          uiOutput("load_dayOffsetInput"),
          uiOutput("load_loadDataButtonUI")

        ),
        uiOutput("load_warnings"), etc, etc, etc, etc

  
          )
        )
      )
    )
  ))

}

#' mod_load_app_server Server Functions
#'
#' @noRd
mod_load_app_server <- function(id){
  moduleServer( id, function(input, output, session){
    ns <- session$ns


    observe({
      req(results$load_dataType())

      if(length(input$load_loadDataButton) ==1){
        toggleElement(id = "load_MBPlotFacet", condition = results$load_dataType() ==2)
      }

      toggleElement(id = "load_excludeIdSelect", condition = input$load_outlierType %in% c(1,3))
      toggleElement(id = "load_excludeButton", condition = isTruthy(input$load_excludeReason))
      toggleElement(id = "load_excludeDaySelect", condition = input$load_outlierType %in% c(2,3))

    })

    observe({
      req(results$load_dataVolume())
      updateSelectInput(session,
                        inputId= "load_excludeDaySelect",
                        choices = sort(unique(results$load_dataVolume()$day)))

      sortedIds <- list()
      for(treatment in levels(results$load_dataVolume()$treatment)){
        ids <- unique(results$load_dataVolume()$animal_id[results$load_dataVolume()$treatment == treatment])
        sortedIds[[treatment]] <- ids
      }

      updateSelectInput(session, inputId= "load_excludeIdSelect", choices = sortedIds)
    })

    output$load_selectColumnNamesUI <- renderUI({
      req(results$load_dataInputFile0())

      myColumns <- matchColumns(results$load_dataInputFile0())
      names <- names(myColumns)
      inputIds <- paste0("load_columnName_", names)

      tagList(
        textInput("load_dayOffset",
                  label = "Specify how day is defined",
                  value = "Post-implant"),
        helpText("Please check whether the program has detected the right columns"),
        lapply(1:length(myColumns), function(i)
          selectizeInput(inputId = inputIds[i],
                         label = names[i],
                         choices = myColumns[[i]]$options,
                         selected = myColumns[[i]]$guess))
      )
    }) etc, etc, etc.. 



}

## To be copied in the UI
# mod_load_app_ui("load_app_1")

## To be copied in the server
# mod_load_app_server("load_app_1")

....... Adding more ----------

If you look, as you can see the body page appears under both tabs regardless of which I choose

Second pic

And the third pic with load data info mixed up with Info Tab:

Answer 1

The simple answer was that in info_ui script I had an html and at the end of the html I suppose to add another </div>