Question: Update element within nested array

Hello

thanks for that great module. I am in the moment replacing redux with pullstate in our solutions and facing a problem, that not might be a pullstate thing, but I am wondering if there is a specific way to do it using pullstate and update.

In my Store I am having an Array of so called “PlanningElements” which contain PlanningElements as childrens again. So I get like a tree structure. Now I have to update a property of a specific PlanningElement anywhere in the tree and I only have the ID of that planninglement.

Thanks very much for your help!! Pascal

// MY Model for the Tree Structure
export default interface PlanningElement {    
    planningId?:number; // ID of the planned Element
    title?:string;
    children?: PlanningElement[];
}

// MY STORE
interface IPlanningViewStore {    
    meetingsPlanningElements: [{ meetingId: number; planningElements: PlanningElement[] }?];
}

export const PlanningViewStore = new Store<IPlanningViewStore>({    
    meetingsPlanningElements: [],
});



// MY Method, trying to update the element anywhere within the tree structure
// The current implementation only supports elements, at the root level...
// How can I update nested objects
const updatePlanningElementWithinTree = (meetingId: number, updatedPlanningElement: PlanningElement) => {
    PlanningViewStore.update((s) => {
         const elements = s.meetingsPlanningElements.find((m) => m.meetingId == meetingId).planningElements;
         const index = elements.findIndex(e => e.planningId == updatedPlanningElement.planningId);
         s.meetingsPlanningElements.find((m) => m.meetingId == meetingId).planningElements[index] = updatedPlanningElement;
    });
};

[hohenp]

Cool, thanks alot @lostpebble . Happy to here, that it is a challange, so braining about that for days was it worth… 😃 Im am closing that and of course we can move the questions to the discussion section. My fault, sorry!!

[lostpebble]

Yea, it is somewhat of a challenge to do deep updates.

Look at the bottom section of the immer docs for updates (https://immerjs.github.io/immer/docs/update-patterns), they give the same advice I gave earlier: find the ID of the deep updates you need to do, and then apply them. This is somewhat harder given the structure you are using.

Another option would be to do the updates outside of Pullstate itself, and then just calling Store.replace(newState) with the entire new state tree that you’ve edited.