Show and hide dialog using props instead of methods?

[galexy]

I think it would be idiomatic react (and flux) to have props on the dialog that determine if the dialog is visible or not.

Thoughts?

[alitaheri]

I totally agree with you. I myself had to write a wrapper component only to handle porp changes and call show() and dismiss() on the Dialog.

[nixoz]

+1 for this, doing "monkey patching" of the methods to read the props and to change the state of components manually...

p.s. amazing job boys!! thank you so much for your work.

[shaurya947]

@galexy / @subjectix PRs welcome :-)

[oliviertassinari]

Here is the monkey patching I'm using, if this can help.

'use strict';

const React = require('react');
const PureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');

const CanvasDialog = React.createClass({
  propTypes: {
    children: React.PropTypes.element.isRequired,
    show: React.PropTypes.bool.isRequired,
  },
  mixins: [
    PureRenderMixin,
  ],
  componentDidUpdate: function(prevProps) {
    const show = this.props.show;

    if (prevProps.show !== show) {
      const dialog = this.refs.dialog;

      // Prevent nested action trigger
      setTimeout(() => {
        if (show) {
          dialog.show();
        } else {
          dialog.dismiss();
        }
      }, 0);
    }
  },
  render: function() {
    return React.cloneElement(this.props.children, {
      ref: 'dialog',
      openImmediately: this.props.show,
    });
  },
});

module.exports = CanvasDialog;