JSFiddle - React, Tailwind, and code Playground

JavaScript

var KEY_CTRL = 17;
var KEY_f = 70;

var isReserved = false;
var useExclusiveKeyEvent = false;
var isNewSearchEvent = false;


/*THIS VARIABLE IS RENDERED BY SERVER SIDE*/
var clientRandomKey = "78349DE472AA30032RRJDF344FFS8374";

window.onkeyup=function(ev){
  if(ev.which == KEY_CTRL){
    isReserved=false;
  }
}
window.onkeydown=function(ev){
  //!IMPORTANT NOT MAKE UI DELAY IN THIS FUCTION
  if(ev.which == KEY_CTRL) {
       isReserved=true;
  }
	if((isReserved==true)&&(ev.which == KEY_f)) {		
    var currentDate = new Date();
    console.log( "INTO EVENT FUNCTION >\n   "+ currentDate+ " \n   ID: "+clientRandomKey+"\n   launch search a word");
    isNewSearchEvent=true;
    if(useExclusiveKeyEvent){
      return false;}
	}
}

window.setInterval(function(){            
    if(isNewSearchEvent){
      isNewSearchEvent=false;
      //TODO ajax send code
      var currentDate = new Date();
      var msg = "OUTSIDE EVENT FUNCTION >\n   " + currentDate+ " \n   ID: "+clientRandomKey+"\n   launch search a word"
      console.log(msg);
      alert(msg);
    }
},2500);