javascriptreactjssetstatepure-function

I cannot find anything that is impure about my function


Seriously, I'm getting desperate finding what the issue is. I can't find the answer for days!

React.StrictMode API causes our setState to be called twice, right? If it produces an error, then it means that somewhere in our setState callback is impure. So, which one is it?

setOrganization((initialValue) => {
    const newOrganization = { ...initialValue };

    const oldIssues = [...newOrganization.repository.issues.edges];
    const newIssues = [...data.data.organization.repository.issues.edges];

    newOrganization.repository.issues.edges = [...newIssues, ...oldIssues];

    return newOrganization;
});

Full script can be found here, on line 101: https://pastebin.com/ugsrBRTM


Solution

  • Thanks to Nick Parsons' comment above, I just know that object spreading only performs a shallow copy. All I need to do is to change the copy method to deep copy.

    I found the method here: What is the most efficient way to deep clone an object in JavaScript?