I'm having some issues with a tab component in multiple instances inside the same page. I would like some sort of page reload detection to be able of clearing the history. This is my prefilter function and click tab function when someone reloads:

const onTabClick = (tabId, tabHead) => {
    const state = !tabSelected;
    toggleTabSelected(tabId);
    history.push(
      `${location.pathname}?tab=${tabId}`,

      {
        shallow: true,
      }
    );
  };


 const preSelect = () => {

    if (values.tab) {
      let queryString = values.tab.toString();
      let selectedTab = Number(queryString) - 1;
      const allTabs = props.tabs;

      toggleTabSelected(queryString);
      toggleMobSelected(queryString);

 
    } else {
     
      toggleTabSelected(firstTab);
      toggleMobSelected(firstTab);
    }
  };

  useEffect(() => {
    preSelect();
  }, [tabSelected, mobSelected]);

The problem with this code is when I reload the page, the history keeps the url of the last tab that was open, while I would like to reset it. Thanks