In my application, I have a complex state structure that represents a time entry table. Each table row is stored as an array of TimeEntryRow objects, where each row object contains its own array of TimeEntry objects. It's important to note that each object maintains an index representing its position in the table.
export interface TimeState {
timeEntryRows?: TimeEntryRow[];
...
}
export class TimeEntryRow {
rowIndex: number;
timeEntries: TimeEntry[];
...
}
export class TimeEntry {
cellIndex: number;
hours: number;
...
}
I'm currently facing challenges with updating the hours for a single cell in the table using a reducer. Despite implementing the following action case, the state doesn't seem to change:
case timeEntryActions.HOURS_CHANGED_ACTION: {
return {
...state,
timeEntryRows: {
...state.timeEntryRows.map(row => {
return row.rowIndex !== action.payload.rowIndex ? row : {
...row,
timeEntries: {
...row.timeEntries.map(te => {
return te.cellIndex !== action.payload.cellIndex ? te : {
...te,
hours: action.payload.hours
}
})
}
}
})
}
}
}
If anyone has insights or suggestions on how to resolve this issue, I would greatly appreciate it.