How to update the props property of type array after filtering in one functionnal component

I made it work by using the useState of the functional component as we can't update props.

with the steps:

• create a State with useState in the functional component called statearrayData (to distinct it from the props called arrayData)
• in the useEffect : update the state with the props arrayData by using setStatearrayData ==> triggered on the first render and when redux state is updated
• in the handleChange we also use setStatearrayData ==> we can filter the props and update the component state
   

By the way I used redux here

export function Sample({ arrayData}) { const [statearrayData , setStatearrayData ] = useState([]); useEffect(() => { // we update here the state with the prop setStatearrayData (arrayData); }, [arrayData]); function handleChange(event) { event.preventDefault();setStatearrayData(arrayData.filter(b => b.key === event.target.value)); }}function mapStateToProps(state) { return { arrayData: state.arrayData };}function mapDispatchToProps(dispatch) { ....}export default connect(mapStateToProps, mapDispatchToProps)(Sample);