Fix debug page contracts view

[rin-st]

Description

Fixes https://github.com/scaffold-eth/scaffold-eth-2/issues/939

One of the possible (and simple) solutions is to use sessionStorage instead of localStorage. As I understand it doesn't change anything except one case: User worked with debug page where he chose some non-first contract. User closes browser tab with his debug page and open debug page in another browser tab. With localStorage, last chosen contract will be selected. With sessionStorage first contract will be selected. I believe it's not a problem at all

Additionally, using sessionStorage adds possibility to view different contracts of debug page in different browser tabs

---

What I also tried to do:

• use simple hash function depending on contractNames

  const [selectedContract, setSelectedContract] = useLocalStorage<ContractName>(
  ${selectedContractStorageKey}-${hash},
  contractNames[0],
  { initializeWithValue: false },
  );

  it works great, but adds new entry to localstorage for every hash

• use one localStorage for selectedContract and one for hash. But in this case I needed to use useEffects to handle logic and again it didn't work for multiple tabs, same as https://github.com/scaffold-eth/scaffold-eth-2/issues/939

[carletex]

With sessionStorage first contract will be selected. I believe it's not a problem at all

Agree.

The main reason we have this functionality is to avoid "losing the contract focus" if you refresh the page. And session storage does the trick too