Converting Reactive Data Table to Kable in Shiny - r

Question

I am currently building a budgeting shiny application that prompts users to enter information of their past transactions such as: Amount, Type, and Description. I would like to have this information displayed in a Kable styled table in a seperate tab whenever a user hits submit, however, when I do this I get the following message and the table does not display:
"Warning: Error in as.data.frame.default: cannot coerce class ‘c("kableExtra", "knitr_kable")’ to a data.frame"
Here is what I have coded so far:
# Libraries
library(shiny)
library(ggplot2)
library(shinythemes)
library(DT)
library(kableExtra)
ui <- fluidPage(
theme = shinytheme("spacelab"),
## Application Title
titlePanel("2021 Budgeting & Finances"),
tags$em("By:"),
tags$hr(),
navbarPage("", id = "Budget",
tabPanel("Data Entry",
div(class = "outer",
# Sidebar Layout
sidebarLayout(
sidebarPanel(
selectInput("Name",
label = "Name:",
choices = c("","Jack", "Jill")),
selectInput("Bucket",
label = "Item Bucket:",
choices = c("","Essential", "Non-Essential", "Savings", "Rent/Bills", "Trip", "Other")),
textInput("Item",
label = "Item Name:",
placeholder = "Ex: McDonald's"),
shinyWidgets::numericInputIcon("Amount",
"Amount:",
value = 0,
step = 0.01,
min = 0,
max = 1000000,
icon = list(icon("dollar"), NULL)),
dateInput("Date",
label = "Date",
value = Sys.Date(),
min = "2021-05-01",
max = "2022-12-31",
format = "M-d-yyyy"),
actionButton("Submit", "Submit", class = "btn btn-primary"),
downloadButton("Download", "Download")),
# Show a plot of the generated distribution
mainPanel(
dataTableOutput("PreviewTable")
)
)
)
),
tabPanel("Monthly Budget",
tableOutput("MonthlyTable")
),
tabPanel("Budget to Date",
tableOutput("YearTable")
)
)
)
server <- function(input, output, session) {
## SAVE DATA
# Set Up Empty DF
df <- tibble("Name" = character(),
"Date" = character(),
"Category" = character(),
"Amount" = numeric(),
"Description" = character())
# DF is made reactive so we can add new lines
ReactiveDf <- reactiveVal(value = df)
# Add inputs as new data (lines)
observeEvent(input$Submit, {
if (input$Bucket == "" | input$Amount == 0 |
is.na(input$Amount)) {
return(NULL)
}
else {
# New lines are packaged together in a DF
new_lines <- data.frame(Name = as.character(input$Name),
Date = as.character(input$Date),
Category = input$Bucket,
Amount = as.character(input$Amount),
Description = as.character(input$Item))
# change df globally
df <<- rbind(df, new_lines)
# ensure amount is numeric
df <<- df %>%
mutate("Amount" = as.numeric(Amount))
# Update reactive values
ReactiveDf(df)
#clear out original inputs now that they are written to df
updateSelectInput(session, inputId = "Name", selected = "")
updateSelectInput(session, inputId = "Bucket", selected = "")
updateNumericInput(session, inputId = "Amount", value = 0)
updateTextInput(session, inputId = "Item", value = "")
}
})
## Preview Table
output$PreviewTable <- renderTable({
ReactiveDf()
})
## MONTHLY TABLE
output$MonthlyTable <- renderTable({
ReactiveDf() %>%
kbl()
})
## YEAR TO DATE TABLE
output$YearTable <- renderTable({
ReactiveDf()
})
}
# Run the application
shinyApp(ui = ui, server = server)
Ideally what I would like to have is a table preview on the main page where the user enters their information that updates once the user submits their data. Then, I would like the month tab to populate with only the data relating to the current month and the year tab to have all information for the current year. However the biggest issue currently is that the kable table is not displaying. Any help is greatly appreciated!

Answer 1

Kable is plain Html so it doesn't require special render functions. This should work.
## MONTHLY TABLE
output$MonthlyTable <- function(){
ReactiveDf() %>%
kable("html") %>%
kable_styling("striped", full_width = TRUE)
}