optional to address in tx

types/api/transaction.ts

@@ -9,16 +9,9 @@ export type TransactionRevertReason = {
   raw: string;
 } | DecodedInput;
 
-export type Transaction = (
-  {
-    to: AddressParam;
-    created_contract: null;
-  } |
-  {
-    to: null;
-    created_contract: AddressParam;
-  }
-) & {
+export type Transaction = {
+  to: AddressParam | null;
+  created_contract: AddressParam | null;
   hash: string;
   result: string;
   confirmations: number;

ui/home/LatestTxsItem.tsx

@@ -97,6 +97,7 @@ const LatestTxsItem = ({ tx }: Props) => {
               mx={ 2 }
               color="gray.500"
             />
+            { dataTo && (
               <Address>
                 <AddressIcon address={ dataTo }/>
                 <AddressLink
@@ -109,6 +110,7 @@ const LatestTxsItem = ({ tx }: Props) => {
                   fontSize="sm"
                 />
               </Address>
+            ) }
           </Flex>
           <Flex fontSize="sm" justifyContent="end" flexDirection={{ base: 'column', lg: 'row' }}>
             <Box mr={{ base: 0, lg: 3 }} mb={{ base: 2, lg: 0 }}>

ui/tx/TxDetails.tsx

@@ -86,21 +86,21 @@ const TxDetails = () => {
 
   const toAddress = data.to ? data.to : data.created_contract;
   const addressToTags = [
-    ...toAddress.private_tags || [],
-    ...toAddress.public_tags || [],
-    ...toAddress.watchlist_names || [],
+    ...toAddress?.private_tags || [],
+    ...toAddress?.public_tags || [],
+    ...toAddress?.watchlist_names || [],
   ].map((tag) => <Tag key={ tag.label }>{ tag.display_name }</Tag>);
 
   const actionsExist = data.actions && data.actions.length > 0;
 
-  const executionSuccessBadge = toAddress.is_contract && data.result === 'success' ? (
+  const executionSuccessBadge = toAddress?.is_contract && data.result === 'success' ? (
     <Tooltip label="Contract execution completed">
       <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
         <Icon as={ successIcon } boxSize={ 4 } color={ executionSuccessIconColor } cursor="pointer"/>
       </chakra.span>
     </Tooltip>
   ) : null;
-  const executionFailedBadge = toAddress.is_contract && Boolean(data.status) && data.result !== 'success' ? (
+  const executionFailedBadge = toAddress?.is_contract && Boolean(data.status) && data.result !== 'success' ? (
     <Tooltip label="Error occurred during contract execution">
       <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
         <Icon as={ errorIcon } boxSize={ 4 } color="error" cursor="pointer"/>
@@ -214,6 +214,8 @@ const TxDetails = () => {
         flexWrap={{ base: 'wrap', lg: 'nowrap' }}
         columnGap={ 3 }
       >
+        { toAddress ? (
+          <>
             { data.to && data.to.hash ? (
               <Address alignItems="center">
                 <AddressIcon address={ toAddress }/>
@@ -238,6 +240,10 @@ const TxDetails = () => {
                 { addressToTags }
               </Flex>
             ) }
+          </>
+        ) : (
+          <span>[ Contract creation ]</span>
+        ) }
       </DetailsInfoItem>
       { data.token_transfers && <TxDetailsTokenTransfers data={ data.token_transfers } txHash={ data.hash }/> }
 

ui/txs/TxsListItem.tsx

@@ -112,6 +112,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
               color="gray.500"
             />
           ) }
+        { dataTo ? (
           <Address maxWidth={ `calc((100% - ${ currentAddress ? TAG_WIDTH + 16 : ARROW_WIDTH + 8 }px)/2)` }>
             <AddressIcon address={ dataTo }/>
             <AddressLink
@@ -123,6 +124,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
               isDisabled={ isIn }
             />
           </Address>
+        ) : '-' }
       </Flex>
       <Box mt={ 2 }>
         <Text as="span">Value { appConfig.network.currency.symbol } </Text>

ui/txs/TxsTableItem.tsx

@@ -39,7 +39,7 @@ type Props = {
 const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }: Props) => {
   const dataTo = tx.to ? tx.to : tx.created_contract;
   const isOut = Boolean(currentAddress && currentAddress === tx.from.hash);
-  const isIn = Boolean(currentAddress && currentAddress === dataTo.hash);
+  const isIn = Boolean(currentAddress && currentAddress === dataTo?.hash);
 
   const timeAgo = useTimeAgoIncrement(tx.timestamp, enableTimeIncrement);
 
@@ -50,12 +50,12 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }
     </Address>
   );
 
-  const addressTo = (
+  const addressTo = dataTo ? (
     <Address>
       <AddressIcon address={ dataTo }/>
       <AddressLink type="address" hash={ dataTo.hash } alias={ dataTo.name } fontWeight="500" ml={ 2 } truncation="constant" isDisabled={ isIn }/>
     </Address>
-  );
+  ) : '-';
 
   return (
     <Tr