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.
This commit is contained in:
		
					parent
					
						
							
								c45a75ad34
							
						
					
				
			
			
				commit
				
					
						5abb3d8150
					
				
			
		
					 1 changed files with 3 additions and 7 deletions
				
			
		|  | @ -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> | ||||
|             ))} | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue