How can I change state in client-side in NEXT.js?

You can't change state from a parent like this. The way that you're doing, you're only changing the value of tabItem inside the children component.

You could use Context API to achieve the desired result, or just pass down a function from the parent, which would be the best if you're not passing props down too many components.

Code example:

parent.tsx:

export const Parent = () => {
  const [tabItems, setTabItems] = useState()

  function changeTabItems(newValue) {
    setTabItems(newValue)
  }

  return <Child changeTabItems={changeTabItems} tabItems={tabItems}/>
}

child.tsx:

export const Child = ({changeTabItems, tabItems}) => {
  function setActiveTab(tabItem) {
    let aux = tabItems
    for (var i = 0; i < tabItems.length; i++) {
      aux[i].active = false;
    }
    aux.active = true;
    changeTabItems({...aux})
  }

}