Unable to get last update state from new window in react - reactjs

Question

I have four js file to demonstrate my problem.
home.js
command-input.js
tree-view.js
new-window.js
I want to open a new window from command-input.js file along with the command text. From tree-view.js file it works fine but not from command-input.js file.
In my program I have changed the state based on my tree node name and then call window opener method from child window to get the node name. It works fine but dose not work from command-input.js file(can't get the last command text).
Home.js
let browser = window;
let newWindow = null;
class Home extends React.PureComponent {
constructor(props) {
super(props);
this.state = { SBFCommand: {} };
browser = window.self;
browser.getCompName = () => {
return this.state.SBFCommand;
};
}
openNewWindow =(commandText)=> {
this.setState({
SBFCommand: {
ComponentName: compName,
SBCommand: comndText,
componentTitle: complabel,
},
});
newWindow = browser.open(
"/sbfrontapp/sb-user-component",
Math.random(),
"width=900,height=600,toolbar=no,scrollbars=no,location=no,resizable =no"
);
}
}
command-input.js
class CommanInput extends Component {
keyDownHandler = (event) => {
if (event.key === "Enter") {
if (event.target.value !== "") {
let cmdText = event.target.value.toUpperCase();
this.child.openNewWindow(cmdText);
}
}
};
render() {
return (
<div>
<input
type="text"
className="sb-magic-box"
onKeyDown={(e) => this.keyDownHandler(e)}
/>
<Home onRef={(ref) => (this.child = ref)} />
</div>
);
}
}
tree-view.js
class TreeView extends PureComponent{
onNodeClick = (node) => {
if (node.isLeaf) {
const cmdText = node.value.split("_")[1].toUpperCase();
if (cmdText !== null && cmdText !== "") {
this.child.openNewWindow(cmdText);
}
}
};
render() {
const { expanded, nodeData, loading } = this.state;
return (
<>
<Home onRef={(ref) => (this.child = ref)} />
{loading ? (
<LoadImg />
) : (
<CheckboxTree
expanded={expanded}
iconsClass="fa5"
nodes={nodeData}
onClick={this.onNodeClick}
onExpand={this.onExpand}
expandOnClick="true"
/>
)}
</>
);
}
}
new-window.js
class NewWindow extends React.Component {
state = {
loading: false,
ComponentName: "",
SBCommand: "",
};
componentDidMount() {
if (!window.opener) {
window.close();
}
const cmdDetails = window.opener.getCompName();
window.document.title = cmdDetails.componentTitle;
this.setState({
ComponentName: cmdDetails.ComponentName,
SBCommand: cmdDetails.SBCommand,
});
}
render() {
const { loading, ComponentName, SBCommand } = this.state;
return loading ? (
<LoadImg />
) : (
<React.Suspense fallback={<LoadImg />}>
<div className="sb-document-wrapper">
{SBCommand}
</div>
</React.Suspense>
);
}
}