SwiftUI View Not Refreshing When Updating #State Variable - swiftui

Question

I'm sure my view could use all kinds of refactoring, but what I'm currently stuck on is why updating #State private var savedEntities isn't triggering a view refresh. I'm passing in updated data for the following variables from another view.
var overallSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var yearSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var monthSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var overallMoodCounts: [GroupingKey: [MoodCount]]
var yearMoodCounts: [GroupingKey: [MoodCount]]
var monthMoodCounts: [GroupingKey: [MoodCount]]
Then, in .onAppear(), depending on the picker selection (timeframe), I attempt to assign those values to #State private var savedEntities with the expectation that the view and Chart will update accordingly. It does not. If I use the Picker, the .onChange() method seems to work and my view & Chart data gets updated. Also if I restart the app. Appreciate any help. Thanks!
#available(iOS 16.0, *)
struct SwiftUIViewTemplate: View {
#StateObject private var UIState = UIStateModel()
#State private var timeframe: TimeFrame = .overall
#State private var savedEntities: [GroupingKey: [MoodCount]] = [:]
#State private var sortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element] = []
var overallSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var yearSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var monthSortedKeys: [Dictionary<GroupingKey, [MoodCount]>.Keys.Element]
var overallMoodCounts: [GroupingKey: [MoodCount]]
var yearMoodCounts: [GroupingKey: [MoodCount]]
var monthMoodCounts: [GroupingKey: [MoodCount]]
var body: some View {
let spacing: CGFloat = 16
let widthOfHiddenCards: CGFloat = 32
VStack {
Text("Moods")
.padding(.top, 50)
.foregroundColor(App.Colors.secondary.suColor)
.font(.system(size: 44))
Picker("Timeframe", selection: $timeframe) {
Text("Overall").tag(TimeFrame.overall)
Text("Year").tag(TimeFrame.year)
Text("Month").tag(TimeFrame.month)
}
.onAppear() {
switch timeframe {
case TimeFrame.year:
savedEntities = yearMoodCounts
sortedKeys = yearSortedKeys
case TimeFrame.month:
savedEntities = monthMoodCounts
sortedKeys = monthSortedKeys
default:
savedEntities = overallMoodCounts
sortedKeys = overallSortedKeys
}
}
.onChange(of: timeframe, perform: { timeframe in
switch timeframe {
case TimeFrame.year:
savedEntities = yearMoodCounts
sortedKeys = yearSortedKeys
case TimeFrame.month:
savedEntities = monthMoodCounts
sortedKeys = monthSortedKeys
default:
savedEntities = overallMoodCounts
sortedKeys = overallSortedKeys
}
UIState.activeCard = sortedKeys.count - 1
})
.pickerStyle(.segmented)
.padding(.bottom, 20)
Carousel (
numberOfItems: CGFloat(savedEntities.count),
spacing: spacing,
widthOfHiddenCards: widthOfHiddenCards
) {
ForEach(Array(sortedKeys.enumerated()), id: \.element) { index, groupingKey in
Item(
_id: index,
spacing: spacing,
widthOfHiddenCards: widthOfHiddenCards
){
GroupBox {
let year = String(groupingKey.dateComponents?.year ?? 99)
let month = String(groupingKey.dateComponents?.month ?? 99)
Text("\(year) \(month)")
.foregroundColor(.black)
Chart {
ForEach(savedEntities[groupingKey] ?? [], id: \.self) { moodCount in
BarMark(x: .value("Entries", moodCount.count),
y: .value("Mood", moodCount.mood), width: .ratio(0.6))
}
}
.frame(maxWidth: .infinity)
.chartXAxis(.hidden)
.chartYAxis(content: {
AxisMarks(preset: .extended) { axisValue in
AxisValueLabel(centered: true) {
if let stringValue = axisValue.as(String.self) {
let confettiIcon = RevenueService().getConfettiIcon(identifier: stringValue)
Image(uiImage: confettiIcon)
}
}
}
})
}
}
.equatable()
.shadow(color: .gray, radius: 8, x: -4, y: 4)
.animation(.easeInOut) // Makes the cards slide in & out smoothly
}
}
Spacer()
}
.padding()
.environmentObject(UIState)
}
}