javascript - Extending or cloning File Web API object in Redux reducer to support other properties -

i'm trying keep array of files user has selected upload. each file file object. add other properties it, 'progress' , 'status' can present data user when begin upload process.

the problem i'm having when try 'copy' file object using object.assign() or json.parse(json.stringify(obj)) approach, i'm ever getting properties have set myself, not values inherent object.

this example of 1 of attempts use object.assign():

object.assign({}, state, {     files: [         ...state.files.slice(0, payload.index),         object.assign({}, state.files[payload.index], {             status: 'uploading',             progress: 0         }),         ...state.files.slice(payload.index + 1)     ] }) 

understandably, causes me sorts of problems...

what way of keeping track of files , being able extend properties in redux-suitable manner?

thanks in advance.

just don't try store properties on file object. instead store them siblings on parent object:

// init case return {     ...state,     files: [         ...state.files,         { fileobject, status: "initial" }     ] };  // update case return {     ...state,     files: [         ...state.files.slice(0, payload.index),         { ...state.files[payload.index], status: "uploading", progress: 0 },         ...state.files.slize(payload.index + 1)     ] }; 

in scheme:

// fileobject file const { fileobject, status, progress } = state.files[2];