React JS delete cookie based on browser inactivity

You should first verify the browser's inactivity, afterwards you can delete the cookie as per your requirements. Following library is optional, hence it would be beneficial:

import { useCookies } from 'react-cookie';


const [cookies, setCookies, removeCookies] = useCookies(['token']);
function checkIdleness() {
var t;
window.onload = timerReset;
window.onmousemove = timerReset;
window.onmousedown = timerReset;  // catches touchscreen presses as well      
window.ontouchstart = timerReset; // catches touchscreen swipes as well 
window.onclick = timerReset;      // catches touchpad clicks as well
window.onkeydown = timerReset;
window.addEventListener('scroll', timerReset, true); // improved; see comments

function writeYourFunction() {
  // your function for too long inactivity goes here
  removeCookies('token', { path: '/' })
}

function timerReset() {
  clearTimeout(t);
  t = setTimeout(writeYourFunction, 10000);  // time is in milliseconds
}


}


checkIdleness();

You first need to check the idleness of the browser. For detecting idle time, refer to this Question How to detect idle time in JavaScript After that, you can delete the cookie as per your need. For deleting the cookey, follow this link https://www.guru99.com/cookies-in-javascript-ultimate-guide.html#:~:text=JavaScript%20Delete%20Cookie,expires%20to%20a%20passed%20date.

If the cookie you're trying to delete is an httpOnly cookie, which is often the case and a best practice for storing authorization tokens, you won't be able to delete it using client-side javascript. Instead, you'll need to make another request to your backend, which can remove the cookie.