Uniforms: DisplayIf bug with ListField

[vfonic]

I just noticed a strange bug in my app. When I use a DisplayIf component from the documentation:
https://github.com/vazco/uniforms/blob/e2d835df06eb04cce311fa165b1021314fe7a87e/INTRODUCTION.md#example-displayif

...in combination with ListField nested inside, it fails after doing: hide => show => hide => show (DisplayIf condition returns false => true => false => true).

Here's a simple code:

<RadioField
  name="radio"
  allowedValues={[false, true]}
  transform={val => [<span />, (val ? 'True' : 'False')]}
/>

<DisplayIf condition={context => context.model.radio}>
  <ListField
    name="media"
    itemProps={{component: MediaUploadField}}
    initialCount={6}
  />
</DisplayIf>

Here's what I noticed in the console:
console.log("model.media", model.media);

Initial render:
model.media undefined
After switching to true:
model.media (6) [{…}, {…}, {…}, {…}, {…}, {…}]
Switching to false:
model.media null
Switching to true:
Uncaught TypeError: Cannot read property 'map' of null
https://github.com/vazco/uniforms/blob/master/packages/uniforms-unstyled/src/ListField.js#L39
value is null

[vfonic]

I've found out that I'm setting the value of 'media' field to null in MediaForm component:

class MediaForm extends AutoForm {
  componentDidUpdate(prevProps, prevState) {
    if (prevState.model.radio && !prevState.modelSync.radio) {
      super.onChange('media', null);
    }
  }
}

I tried setting 'media' to undefined but that also throws an error.
What would be the correct way to "unset" the field value? Should I just omit it in my handleSubmit method before submitting?

[radekmie]

Hello @vfonic.

Uncaught TypeError: Cannot read property 'map' of null ...

And that's correct, because model.media is null, right?

I tried setting 'media' to undefined but that also throws an error.

It's also correct.

What would be the correct way to "unset" the field value?

You cannot really _unset_ it - you can set it to undefined. If you want to _really_ unset it, then hold own model, use delete or make a clone without this field and pass it as model prop.

Should I just omit it in my handleSubmit method before submitting?

Well, it depends. A field is simply rendering found value - if there's no such value, it results in an error. Also, it's really depending on the case: what would you expect to see after hiding and showing this field again? The same value? An empty one? Or maybe a default? Well, it's up to you. Simply skipping it during submit is an option. Setting it to an empty or default value after switching to visible is also an option.

[vfonic]

You cannot really _unset_ it - you can set it to undefined. If you want to really unset it, then hold own model, use delete or make a clone without this field and pass it as model prop.

Thanks! I figured it might be more valuable to my users if I _didn't_ unset it.