Accessing and changing nested values in immutable object

Question

Im trying to access nest objects and array to concatenate all errors to a single string for each object key separated by dot .. I would like it to iterate over the ones that need it and the ones that don't need it i would like it to move on to the next key.

I have been able to pass the first two tests by mapping through the first two keys and successfully adding a dot and by joining the spacing but cannot get through the nested objects or arrays

  function transformErrors(error) {
  return error.map(value => {
    // console.log("The current iteration is: " + index);
    // console.log("The current element is: " + currElement);

    return value
      .map((currElement, index) => {
        // console.log("The current iteration is: " + index);
        // console.log("The current element is: " + currElement);

        if (index === undefined && index === index) {
          // return index++;
        } else {
          return `${currElement}.`;
        }
      })
      .join(" ");
  });
}

The test I'm trying to pass:

it("should tranform errors", () => {
  // example error object returned from API converted to Immutable.Map
  const errors = Immutable.fromJS({
    name: ["This field is required"],
    age: ["This field is required", "Only numeric characters are allowed"],
    urls: [
      {},
      {},
      {
        site: {
          code: ["This site code is invalid"],
          id: ["Unsupported id"]
        }
      }
    ],
    url: {
      site: {
        code: ["This site code is invalid"],
        id: ["Unsupported id"]
      }
    },
    tags: [
      {},
      {
        non_field_errors: ["Only alphanumeric characters are allowed"],
        another_error: ["Only alphanumeric characters are allowed"],
        third_error: ["Third error"]
      },
      {},
      {
        non_field_errors: [
          "Minumum length of 10 characters is required",
          "Only alphanumeric characters are allowed"
        ]
      }
    ],
    tag: {
      nested: {
        non_field_errors: ["Only alphanumeric characters are allowed"]
      }
    }
  });

  let result = transformErrors(errors);

  assert.deepEqual(result.toJS(), {
    name: "This field is required.",
    age: "This field is required. Only numeric characters are allowed.",
    urls: [
      {},
      {},
      {
        site: {
          code: "This site code is invalid.",
          id: "Unsupported id."
        }
      }
    ],
    url: {
      site: {
        code: "This site code is invalid.",
        id: "Unsupported id."
      }
    },
    tags:
      "Only alphanumeric characters are allowed. Third error. " +
      "Minumum length of 10 characters is required.",
    tag: "Only alphanumeric characters are allowed."
  });
});

Current output :

{
  "age": "This field is required. Only numeric characters are 
allowed."
  "name": "This field is required."
 "tag": "Map { \"non_field_errors\": List [ \"Only alphanumeric 
characters are allowed\" ] }."
 "tags": "Map {}. Map { \"non_field_errors\": List [ \"Only 
alphanumeric characters are allowed\" ], \"another_error\": List [ 
\"Only alphanumeric characters are allowed\" ], \"third_error\": 
List [ \"Third error\" ] }. Map {}. Map { \"non_field_errors\": List 
[ \"Minumum length of 10 characters is required\", \"Only 
alphanumeric characters are allowed\" ] }."
 "url": "Map { \"code\": List [ \"This site code is invalid\" ], 
\"id\": List [ \"Unsupported id\" ] }."
 "urls": "Map {}. Map {}. Map { \"site\": Map { \"code\": List [ 
\"This site code is invalid\" ], \"id\": List [ \"Unsupported id\" ] 
} }."
}

Expected output :

  "tag": "Only alphanumeric characters are allowed."
  "tags": "Only alphanumeric characters are allowed. Third error. 
 Minumum length of 10 characters is required."
  "url": {
    "site": {
      "code": "This site code is invalid."
      "id": "Unsupported id."
    }
  }
  "urls": [
    {}
    {}
    {
      "site": {
        "code": "This site code is invalid."
        "id": "Unsupported id."
       }
    }
  ]

I assume Function is actually function ?

Jonas Wilms
– Jonas Wilms

2018-12-19 18:07:59 +00:00
Commented Dec 19, 2018 at 18:07 — Jonas Wilms
– Jonas Wilms, Commented Dec 19, 2018 at 18:07

Jonas Wilms · Accepted Answer · 2018-12-19 18:19:34Z

1

You have to recursively go over all key/value pairs:

 // Map & List shall be the Immutable types

 function flattenErrors(errors) {
    let result = Map();
    for(let [key, value] of errors) {
       if(Map.isMap(value))
         value = flattenErrors(value); // the recursive call
       if(List.isList(value) && value.every(entry => typeof entry === "string"))
         value = value.join(". ");
       result = result.set(key, value);
   }
   return result;
 }

edited Dec 19, 2018 at 18:19

answered Dec 19, 2018 at 18:12

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Saul Over a year ago

Yes ok i pulled the Map, fromJS, List from the immutable module thank you

Collectives™ on Stack Overflow

Accessing and changing nested values in immutable object

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related