treehouse
/
mastodon
19
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Rerender modal on property changes (#4175) 

Render function for BundleContainer must not be methods.
React doesn't know dependency of the method, so they won't rerender on property updates.

In this case, when you close modal and open another modal immediately,
old modal will be open instead of new one.
lolsob-rspec
unarist 2017-07-13 03:51:44 +09:00 committed by Eugen Rochko
parent 7507e7c8fe
commit c3ec4f2dac
1 changed files with 3 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/javascript/mastodon/features/ui/components/modal_root.js
View File

@ -54,12 +54,6 @@ export default class ModalRoot extends React.PureComponent {
return { opacity: spring(0), scale: spring(0.98) };
}
renderModal = (SpecificComponent) => {
const { props, onClose } = this.props;
return <SpecificComponent {...props} onClose={onClose} />;
}
renderLoading = () => {
return <ModalLoading />;
}
@ -95,7 +89,9 @@ export default class ModalRoot extends React.PureComponent {
<div key={key} style={{ pointerEvents: visible ? 'auto' : 'none' }}>
<div role='presentation' className='modal-root__overlay' style={{ opacity: style.opacity }} onClick={onClose} />
<div className='modal-root__container' style={{ opacity: style.opacity, transform: `translateZ(0px) scale(${style.scale})` }}>
<BundleContainer fetchComponent={MODAL_COMPONENTS[type]} loading={this.renderLoading} error={this.renderError} renderDelay={200}>{this.renderModal}</BundleContainer>
<BundleContainer fetchComponent={MODAL_COMPONENTS[type]} loading={this.renderLoading} error={this.renderError} renderDelay={200}>
{(SpecificComponent) => <SpecificComponent {...props} onClose={onClose} />}
</BundleContainer>
</div>
</div>
))}