ReactDOM.unmountComponentAtNode => root.unmount() (#4338)

unmountComponentAtNode is deprecated, so save or
pass the root as a prop and call root.unmount when
the component is destroyed
This commit is contained in:
Bogdan Abaev 2024-07-05 17:34:00 -07:00 committed by Dan Stillman
parent 37991e220e
commit fd93af8305
3 changed files with 13 additions and 8 deletions

View file

@ -65,9 +65,10 @@ function AnnotationBox({ data }) {
Zotero.AnnotationBox = memo(AnnotationBox);
Zotero.AnnotationBox.render = (domEl, props) => {
ReactDOM.createRoot(domEl).render(<AnnotationBox { ...props } />);
Zotero.AnnotationBox.root = ReactDOM.createRoot(domEl);
Zotero.AnnotationBox.root.render(<AnnotationBox { ...props } />);
};
Zotero.AnnotationBox.destroy = (domEl) => {
ReactDOM.unmountComponentAtNode(domEl);
Zotero.AnnotationBox.destroy = () => {
Zotero.AnnotationBox.root.unmount();
};

View file

@ -80,11 +80,12 @@ CreateParent.propTypes = {
Zotero.CreateParent = memo(CreateParent);
Zotero.CreateParent.destroy = (domEl) => {
ReactDOM.unmountComponentAtNode(domEl);
Zotero.CreateParent.destroy = () => {
Zotero.CreateParent.root.unmount();
};
Zotero.CreateParent.render = (domEl, props) => {
ReactDOM.createRoot(domEl).render(<CreateParent { ...props } />);
Zotero.CreateParent.root = ReactDOM.createRoot(domEl);
Zotero.CreateParent.root.render(<CreateParent { ...props } />);
};

View file

@ -860,7 +860,9 @@ Zotero.TagSelector = class TagSelectorContainer extends React.PureComponent {
static async init(domEl, opts) {
var ref;
await new Promise((resolve) => {
ReactDOM.createRoot(domEl).render(<TagSelectorContainer ref={(c) => {
let root = ReactDOM.createRoot(domEl);
opts.root = root;
root.render(<TagSelectorContainer ref={(c) => {
ref = c;
resolve();
} } {...opts} />);
@ -870,7 +872,7 @@ Zotero.TagSelector = class TagSelectorContainer extends React.PureComponent {
uninit() {
this._uninitialized = true;
ReactDOM.unmountComponentAtNode(this.domEl);
this.props.root.unmount();
Zotero.Notifier.unregisterObserver(this._notifierID);
Zotero.Prefs.unregisterObserver(this._prefObserverID);
}
@ -878,6 +880,7 @@ Zotero.TagSelector = class TagSelectorContainer extends React.PureComponent {
static propTypes = {
container: PropTypes.string.isRequired,
onSelection: PropTypes.func.isRequired,
root: PropTypes.object,
};
};