play js in react typescript

I need to runder some events when component fully loaded on react typescript

I tried using window.onload function but when the UI navigate it does not fire

I tried using

if (document.readyState === "complete" || document.readyState ==="interactive") {

playJs();
}

but in one component it works just fine in another it fails

here some code from playJs function

function playJs(){
  console.log("in");
  const container = document.querySelector('#main-page-img');

window.addEventListener('click', function (e: any) {
  console.log("log",container, userSetting);
  console.log(container!.contains(e.target), userSetting!.contains(e.target),"hi");
}

if (container!.contains(e.target) || userSetting!.contains(e.target)) {
      userSetting!.classList.toggle('active');
  }
  else { userSetting!.classList.remove('active'); }
})

I think window.onclick is the cause

is there any propper way to do it