Using immutability-helper in React to set a value of a (maybe nested) object

I have those code:

var update=require('immutability-helper');

var state = {
  step: 1,
  fields: {
    type: '',
    name: '',
    subtype: '',
    team: '',
    agreement: ''
  }
};

function assignAttribute(attr, value) {
  var temp = update(state, {
    [attr]: {$set: value}
  });

  state = temp;
};

console.log(state); // -> { step: 1, fields: { type: '', name: '', subtype: '', team: '', agreement: '' } }
assignAttribute('step', 3);
console.log(state); // -> { step: 3, fields: { type: '', name: '', subtype: '', team: '', agreement: '' } }
assignAttribute('fields.type','superType');
console.log(state); // -> { step: 3, fields: { type: '', name: '', subtype: '', team: '', agreement: '' }, 'fields.type': 'superType' }

What I want is that the last line is the following:

{ step: '3', fields: { type: 'superType', name: '', subtype: '', team: '', agreement: '' } }

The main problem seems to be that in the assignAttribute function [attr] is no longer used as dot-notation
What can I do to handle this?

I found a workaround (but not the right solution)

Using lodash/fp:

var _=require('lodash/fp');

var state = {
  step: 1,
  fields: {
    type: '',
    name: '',
    subtype: '',
    team: '',
    agreement: ''
  }
};

function assignAttribute(attr, value) {
  var temp = _.set(attr, value, state);

  state = temp;
};

Due to the fact that _.set is immutable I now got what I looked for 🙂