How to assign the value to the element of an array of the object and return the updated object typscript

Question

I am trying to return the updated values of Current for 'detailsState'. I tried as below:

  export function GetDetailsPayload(payload: INFO, detailsState: DetailsViewmodel, isSaved: boolean) {
  if (payload && payload.SSN && detailsState && detailsState.INFODetail && detailsState.INFODetail.Active) {

    detailsState.INFODetail.Active = payload;
    if (isSaved) {
      detailsState.INFODetail.Current.map((c, i) => {
        if (c.Id == detailsState.INFODetail.Active.Id) {
          c = payload;
          return c;
        }

      });

    }
  }
  return detailsState;
}

Actual result: detailsState.INFODetail.Current is same instead of payload.

Expected result: detailsState.INFODetail.Current having the value of payload when condition is met for one of the element in an array.

Thank you!

Answer 1

This part of your code:

detailsState.INFODetail.Current.map((c, i) => {
    if (c.Id == detailsState.INFODetail.Active.Id) {
        c = payload;
        return c;
    }
});

You map over the items in .Current, but you don't actually do anything with the mapped result. You probably meant to do this instead:

detailsState.INFODetail.Current = detailsState.INFODetail.Current.map((c, i) => {
    if (c.Id == detailsState.INFODetail.Active.Id) {
        c = payload;
        return c;
    }
});

Mind that that will replace certain elements with undefined when you don't return c within the mapper. You probably meant to return the original value otherwise:

detailsState.INFODetail.Current = detailsState.INFODetail.Current
    .map((c, i) => (c.Id == detailsState.INFODetail.Active.Id) ? payload : c);