Fix tabs when search by ens name; fix contract creation on block txs results

src/AddressTransactions.tsx

@@ -108,11 +108,9 @@ const AddressTransactions: React.FC = () => {
             </StandardSubtitle>
             <Tab.Group>
               <Tab.List className="flex space-x-2 border-l border-r border-t rounded-t-lg bg-white">
-                <NavTab href={`/address/${checksummedAddress}`}>
-                  Overview
-                </NavTab>
+                <NavTab href={`/address/${addressOrName}`}>Overview</NavTab>
                 {(contractAddresses?.length ?? 0) > 0 && (
-                  <NavTab href={`/address/${checksummedAddress}/contract`}>
+                  <NavTab href={`/address/${addressOrName}/contract`}>
                     <span
                       className={`flex items-baseline space-x-2 ${
                         addressMetadata === undefined ? "italic opacity-50" : ""

src/block/BlockTransactionResults.tsx

@@ -40,7 +40,7 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
       return [];
     }
 
-    return page.map((t) => t.to).filter((to): to is string => to !== undefined);
+    return page.map((t) => t.to).filter((to): to is string => to !== null);
   }, [page]);
   const metadatas = useContractsMetadata(addresses, provider);
 

src/search/TransactionItem.tsx

@@ -99,7 +99,10 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
           />
         </span>
       </span>
-      <span className="col-span-2 flex items-baseline" title={tx.to}>
+      <span
+        className="col-span-2 flex items-baseline"
+        title={tx.to ?? tx.createdContractAddress}
+      >
         <span className="truncate">
           {tx.to ? (
             <AddressHighlighter address={tx.to}>

src/search/search.ts

@@ -52,7 +52,7 @@ export class SearchController {
           idx: _receipt.transactionIndex,
           hash: t.hash,
           from: t.from,
-          to: t.to,
+          to: t.to ?? null,
           createdContractAddress: _receipt.contractAddress,
           value: t.value,
           fee: _receipt.gasUsed.mul(t.gasPrice!),

src/types.ts

@@ -16,7 +16,7 @@ export type ProcessedTransaction = {
   idx: number;
   hash: string;
   from?: string;
-  to?: string;
+  to: string | null;
   createdContractAddress?: string;
   internalMinerInteraction?: boolean;
   value: BigNumber;

src/useErigonHooks.ts

@@ -103,7 +103,7 @@ export const useBlockTransactions = (
             idx: i,
             hash: t.hash,
             from: t.from,
-            to: t.to,
+            to: t.to ?? null,
             createdContractAddress: _receipts[i].contractAddress,
             value: t.value,
             fee:
@@ -457,8 +457,10 @@ export const useAddressesWithCode = (
   const [results, setResults] = useState<ChecksummedAddress[] | undefined>();
 
   useEffect(() => {
+    // Reset
+    setResults(undefined);
+
     if (provider === undefined) {
-      setResults(undefined);
       return;
     }
 

src/useResolvedAddresses.ts

@@ -27,6 +27,11 @@ export const useAddressOrENSFromURL = (
 
   // If it looks like it is an ENS name, try to resolve it
   useEffect(() => {
+    // Reset
+    setENS(false);
+    setError(false);
+    setChecksummedAddress(undefined);
+
     // TODO: handle and offer fallback to bad checksummed addresses
     if (isAddress(addressOrName)) {
       // Normalize to checksummed address