ui.R

# =============================================================================
# SampleSizeR – User Interface (v2 – Enhanced)
# =============================================================================
# Built with shinydashboard. Improvements:
#   - Responsive home page grid (2 rows of 5 cards)
#   - Preset scenario dropdown in each module
#   - 3rd value box (design-specific metric)
#   - Interpretation panel
#   - Comparison tab
#   - Calculation history tab
#   - Loading spinners via CSS
# =============================================================================

# ---- Build dynamic tabItems from design_registry ----------------------------

# Home tab (redesigned with 2 rows of 5)
home_tab <- tabItem(tabName = "home",
  fluidRow(
    column(12,
      div(class = "home-hero",
        h1(class = "hero-title", icon("calculator"), " SampleSizeR"),
        h3(class = "hero-subtitle", "A Multi-Design Sample Size Calculator"),
        p(class = "hero-desc",
          "Compute sample sizes for cross-sectional studies, clinical trials,",
          "case-control studies, cohort studies, cluster surveys, DHS-type surveys,",
          "and power analyses \u2014 all with step-by-step calculations and sensitivity plots."),
        div(class = "hero-badges",
          span(class = "hero-badge", icon("flask"), " 10 Study Designs"),
          span(class = "hero-badge", icon("chart-line"), " Sensitivity Analysis"),
          span(class = "hero-badge", icon("file-export"), " Export Reports"),
          span(class = "hero-badge", icon("globe-africa"), " DHS Survey Mode")
        )
      )
    )
  ),
  # Row 1: first 5 designs
  fluidRow(
    class = "card-row",
    lapply(names(design_registry)[1:5], function(id) {
      reg <- design_registry[[id]]
      column(width = 2, class = "card-col-5",
        div(class = "design-card",
            onclick = sprintf(
              "$('a[href=\"#shiny-tab-%s\"]').click();", id
            ),
          icon(reg$icon, class = "design-card-icon"),
          h4(reg$label),
          p(class = "text-muted", reg$desc)
        )
      )
    })
  ),
  # Row 2: next 5 designs
  fluidRow(
    class = "card-row",
    lapply(names(design_registry)[6:10], function(id) {
      reg <- design_registry[[id]]
      column(width = 2, class = "card-col-5",
        div(class = "design-card",
            onclick = sprintf(
              "$('a[href=\"#shiny-tab-%s\"]').click();", id
            ),
          icon(reg$icon, class = "design-card-icon"),
          h4(reg$label),
          p(class = "text-muted", reg$desc)
        )
      )
    })
  ),
  # Quick-start section
  fluidRow(
    column(12,
      div(class = "quick-start",
        h4(icon("rocket"), " Quick Start"),
        p("Select a study design from the sidebar or click a card above.",
          "Each calculator includes real-time sensitivity plots, step-by-step formulas,",
          "and export options. Use the ", strong("Comparison"), " tab to compare results across designs.")
      )
    )
  )
)

# Study-design tabs (one per registry entry) with preset dropdown + interpretation
design_tabs <- lapply(names(design_registry), function(id) {
  reg <- design_registry[[id]]
  
  # Build preset dropdown if available
  has_presets <- id %in% names(presets) && length(presets[[id]]) > 1
  preset_ui <- if (has_presets) {
    div(class = "preset-bar",
      icon("magic"), " ",
      selectInput(paste0(id, "-preset_select"), "Load Preset Scenario:",
                  choices = names(presets[[id]]),
                  selected = "Custom",
                  width = "350px")
    )
  } else {
    NULL
  }
  
  tabItem(tabName = id,
    # Title bar with preset
    fluidRow(
      column(8,
        h2(icon(reg$icon), reg$label,
           tags$small(class = "text-muted", paste0(" \u2014 ", reg$desc)))
      ),
      column(4, preset_ui)
    ),
    hr(),
    
    # Input panel
    fluidRow(
      column(12,
        box(
          title = tags$span(icon("sliders-h"), " Parameters"),
          status = "primary", solidHeader = TRUE,
          width = 12, collapsible = TRUE,
          reg$ui_func(id)
        )
      )
    ),
    
    # Results: 3 value boxes
    fluidRow(
      column(4, valueBoxOutput(paste0(id, "_vbox_n"), width = 12)),
      column(4, valueBoxOutput(paste0(id, "_vbox_adj"), width = 12)),
      column(4, valueBoxOutput(paste0(id, "_vbox_extra"), width = 12))
    ),
    
    # Interpretation
    fluidRow(
      column(12,
        uiOutput(paste0(id, "_interpretation"))
      )
    ),
    
    # Note
    fluidRow(
      column(12, uiOutput(paste0(id, "_note")))
    ),
    
    # Formula + Steps
    fluidRow(
      column(12,
        box(
          title = tags$span(icon("superscript"), " Formula & Step-by-Step Calculation"),
          status = "info", solidHeader = TRUE,
          width = 12, collapsible = TRUE, collapsed = FALSE,
          uiOutput(paste0(id, "_formula")),
          hr(),
          verbatimTextOutput(paste0(id, "_steps"))
        )
      )
    ),
    
    # Sensitivity plots
    fluidRow(
      column(6,
        box(
          title = tags$span(icon("chart-area"), " Sensitivity Analysis"),
          status = "warning", solidHeader = TRUE,
          width = 12, collapsible = TRUE,
          div(class = "plot-loading-wrapper",
            plotOutput(paste0(id, "_sens_plot1"), height = "380px")
          )
        )
      ),
      column(6,
        box(
          title = tags$span(icon("chart-area"), " Sensitivity Analysis"),
          status = "warning", solidHeader = TRUE,
          width = 12, collapsible = TRUE,
          div(class = "plot-loading-wrapper",
            plotOutput(paste0(id, "_sens_plot2"), height = "380px")
          )
        )
      )
    ),
    
    # Parameters table + Export
    fluidRow(
      column(6,
        box(
          title = tags$span(icon("table"), " Parameter Summary"),
          status = "success", solidHeader = TRUE,
          width = 12, collapsible = TRUE,
          DT::dataTableOutput(paste0(id, "_params_table"))
        )
      ),
      column(6,
        box(
          title = tags$span(icon("download"), " Export & Reports"),
          status = "success", solidHeader = TRUE,
          width = 12, collapsible = TRUE,
          fluidRow(
            column(6,
              downloadButton(paste0(id, "_dl_csv"), 
                             tags$span(icon("file-csv"), " Download CSV"),
                             class = "btn-block btn-info"),
              br(), br(),
              downloadButton(paste0(id, "_dl_report"),
                             tags$span(icon("file-alt"), " Download HTML Report"),
                             class = "btn-block btn-danger")
            ),
            column(6,
              h5("Calculation Summary"),
              verbatimTextOutput(paste0(id, "_summary_text"))
            )
          )
        )
      )
    )
  )
})

# Comparison tab
comparison_tab <- tabItem(tabName = "comparison",
  fluidRow(
    column(12,
      h2(icon("balance-scale-right"), " Cross-Design Comparison"),
      p(class = "text-muted",
        "Compare sample sizes across all active study designs side by side.",
        "Navigate to each design tab to generate results, then return here to compare."),
      hr()
    )
  ),
  fluidRow(
    column(12,
      box(
        title = tags$span(icon("chart-bar"), " Comparison Chart"),
        status = "primary", solidHeader = TRUE, width = 12,
        plotOutput("comparison_chart", height = "450px")
      )
    )
  ),
  fluidRow(
    column(12,
      box(
        title = tags$span(icon("table"), " Comparison Table"),
        status = "info", solidHeader = TRUE, width = 12,
        DT::dataTableOutput("comparison_table")
      )
    )
  )
)

# History tab
history_tab <- tabItem(tabName = "history",
  fluidRow(
    column(12,
      h2(icon("history"), " Calculation History"),
      p(class = "text-muted",
        "A log of all calculations performed during this session.",
        "History is cleared when the app is restarted."),
      hr()
    )
  ),
  fluidRow(
    column(12,
      box(
        title = "Session History", status = "primary",
        solidHeader = TRUE, width = 12,
        DT::dataTableOutput("history_table")
      )
    )
  )
)

# About tab
about_tab <- tabItem(tabName = "about",
  fluidRow(
    column(8, offset = 2,
      box(
        title = "About SampleSizeR", status = "primary",
        solidHeader = TRUE, width = 12,
        div(class = "about-header",
          h3("SampleSizeR v2.0.0"),
          tags$span(class = "badge-custom", "Open Source"),
          tags$span(class = "badge-custom badge-green", "Peer-Reviewed Formulas")
        ),
        p("A comprehensive, modular R Shiny application for computing sample",
          "sizes across a wide range of epidemiological and clinical study designs."),
        hr(),
        h4(icon("clipboard-list"), " Supported Study Designs"),
        tags$ol(
          tags$li(strong("Single Proportion"), " \u2014 Cross-sectional prevalence studies"),
          tags$li(strong("Two Proportions"), " \u2014 Comparative / RCT studies"),
          tags$li(strong("Mean Estimation"), " \u2014 Descriptive studies for continuous outcomes"),
          tags$li(strong("Two Means"), " \u2014 Comparing means between independent groups"),
          tags$li(strong("Case-Control"), " \u2014 Retrospective case-control designs"),
          tags$li(strong("Cohort Study"), " \u2014 Prospective / retrospective cohort designs"),
          tags$li(strong("Cluster Sampling"), " \u2014 Complex survey designs with DEFF/ICC"),
          tags$li(strong("Finite Population"), " \u2014 Small-population correction factor"),
          tags$li(strong("DHS Survey"), " \u2014 Multi-stage DHS/MICS-style surveys"),
          tags$li(strong("Power Analysis"), " \u2014 Power-based sample size determination")
        ),
        hr(),
        h4(icon("star"), " Key Features"),
        fluidRow(
          column(6,
            tags$ul(
              tags$li(icon("sync-alt"), " Reactive recalculation"),
              tags$li(icon("chart-area"), " Sensitivity analysis with current-value markers"),
              tags$li(icon("file-csv"), " Clean structured CSV export"),
              tags$li(icon("file-alt"), " HTML report generation"),
              tags$li(icon("lightbulb"), " Plain-language interpretation")
            )
          ),
          column(6,
            tags$ul(
              tags$li(icon("magic"), " Preset scenarios for common studies"),
              tags$li(icon("balance-scale-right"), " Cross-design comparison tab"),
              tags$li(icon("history"), " Session calculation history"),
              tags$li(icon("info-circle"), " Tooltips on every parameter"),
              tags$li(icon("globe-africa"), " DHS/MICS survey mode")
            )
          )
        ),
        hr(),
        h4(icon("book"), " References"),
        tags$ul(
          tags$li("Cochran, W.G. (1977). ", em("Sampling Techniques"), ", 3rd Edition. Wiley."),
          tags$li("Kelsey, J.L. et al. (1996). ", em("Methods in Observational Epidemiology"),
                  ", 2nd Edition. Oxford University Press."),
          tags$li("ICF International. ", em("DHS Survey Design Manual"), ". The DHS Program."),
          tags$li("Lwanga, S.K. & Lemeshow, S. (1991). ",
                  em("Sample Size Determination in Health Studies"), ". WHO.")
        ),
        hr(),
        h4(icon("code"), " Extending the Application"),
        p("To add a new study design:"),
        tags$ol(
          tags$li("Add the formula function to ", code("helpers/formulas.R")),
          tags$li("Create a new module file in ", code("modules/")),
          tags$li("Register the module in ", code("global.R"), "'s ", code("design_registry")),
          tags$li("The UI tab, plots, exports, and history are all auto-wired.")
        ),
        hr(),
        p(class = "text-muted text-center",
          "Built with R Shiny \u2022 shinydashboard \u2022 ggplot2 \u2022 DT",
          br(),
          "Designed for epidemiologists, biostatisticians, and DHS analysts.")
      )
    )
  )
)

# ---- Combine all tabs -------------------------------------------------------
all_tabs <- c(list(home_tab), design_tabs, list(comparison_tab, history_tab, about_tab))

# ---- Dashboard Page ----------------------------------------------------------
ui <- dashboardPage(
  skin = "blue",

  # ---- Header ----------------------------------------------------------------
  dashboardHeader(
    title = tags$span(
      icon("calculator", class = "header-logo-icon"),
      " SampleSizeR"
    ),
    titleWidth = 280,
    tags$li(
      class = "dropdown",
      tags$a(href = "#", style = "padding: 15px; color: #ccc;",
             icon("code-branch"), " v2.0.0")
    )
  ),

  # ---- Sidebar ---------------------------------------------------------------
  dashboardSidebar(
    width = 280,
    sidebarMenu(
      id = "sidebar_menu",

      menuItem("Home", tabName = "home", icon = icon("home")),

      menuItem("Study Designs", icon = icon("flask"), startExpanded = TRUE,
        menuSubItem("Single Proportion", tabName = "single_prop",
                    icon = icon("percentage")),
        menuSubItem("Two Proportions", tabName = "two_prop",
                    icon = icon("not-equal")),
        menuSubItem("Mean Estimation", tabName = "mean_est",
                    icon = icon("calculator")),
        menuSubItem("Two Means", tabName = "two_means",
                    icon = icon("balance-scale")),
        menuSubItem("Case-Control", tabName = "case_control",
                    icon = icon("users")),
        menuSubItem("Cohort Study", tabName = "cohort",
                    icon = icon("chart-line")),
        menuSubItem("Cluster Sampling", tabName = "cluster",
                    icon = icon("project-diagram")),
        menuSubItem("Finite Population", tabName = "finite_pop",
                    icon = icon("compress-arrows-alt"))
      ),

      menuItem("DHS Survey Mode", tabName = "dhs_survey",
               icon = icon("globe-africa")),

      menuItem("Power Analysis", tabName = "power_based",
               icon = icon("bolt")),

      hr(),

      menuItem("Comparison", tabName = "comparison",
               icon = icon("balance-scale-right"),
               badgeLabel = "NEW", badgeColor = "green"),

      menuItem("History", tabName = "history",
               icon = icon("history")),

      menuItem("About & Docs", tabName = "about",
               icon = icon("book"))
    )
  ),

  # ---- Body ------------------------------------------------------------------
  dashboardBody(
    tags$head(
      tags$link(rel = "stylesheet", type = "text/css", href = "custom.css"),
      tags$script("$(function () { $('[data-toggle=\"tooltip\"]').tooltip(); })"),
      tags$script(src = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.9/MathJax.js?config=TeX-AMS-MML_HTMLorMML"),
      tags$script(HTML("
        MathJax.Hub.Config({
          tex2jax: { inlineMath: [['$','$'], ['\\\\(','\\\\)']], processEscapes: true }
        });
      "))
    ),
    do.call(tabItems, all_tabs)
  )
)