update category pill for react 18

This commit is contained in:
Ajay
2022-10-11 00:04:02 -04:00
parent 9888dcc323
commit 5ebd44c0c7

View File

@@ -1,5 +1,6 @@
import * as React from "react"; import * as React from "react";
import * as ReactDOM from "react-dom"; import * as ReactDOM from "react-dom";
import { createRoot, Root } from "react-dom/client";
import CategoryPillComponent, { CategoryPillState } from "../components/CategoryPillComponent"; import CategoryPillComponent, { CategoryPillState } from "../components/CategoryPillComponent";
import Config from "../config"; import Config from "../config";
import { VoteResponse } from "../messageTypes"; import { VoteResponse } from "../messageTypes";
@@ -10,6 +11,7 @@ import { Tooltip } from "./Tooltip";
export class CategoryPill { export class CategoryPill {
container: HTMLElement; container: HTMLElement;
ref: React.RefObject<CategoryPillComponent>; ref: React.RefObject<CategoryPillComponent>;
root: Root;
unsavedState: CategoryPillState; unsavedState: CategoryPillState;
@@ -38,10 +40,8 @@ export class CategoryPill {
this.unsavedState = this.ref.current.state; this.unsavedState = this.ref.current.state;
} }
ReactDOM.render( this.root = createRoot(this.container);
<CategoryPillComponent ref={this.ref} vote={vote} />, this.root.render(<CategoryPillComponent ref={this.ref} vote={vote} />);
this.container
);
if (this.unsavedState) { if (this.unsavedState) {
this.ref.current?.setState(this.unsavedState); this.ref.current?.setState(this.unsavedState);
@@ -64,7 +64,7 @@ export class CategoryPill {
} }
close(): void { close(): void {
ReactDOM.unmountComponentAtNode(this.container); this.root.unmount();
this.container.remove(); this.container.remove();
} }