amends

ui/address/contract/ContractMethodCallable.tsx

@@ -15,6 +15,7 @@ import ContractMethodField from './ContractMethodField';
 interface Props<T extends SmartContractMethod> {
   data: T;
   caller: (data: T, args: Array<string>) => Promise<Array<Array<string>>>;
+  isWrite?: boolean;
 }
 
 const getFieldName = (name: string, index: number): string => name || String(index);
@@ -35,7 +36,7 @@ const sortFields = (data: Array<SmartContractMethodInput>) => ([ a ]: [string, s
   return 0;
 };
 
-const ContractMethodCallable = <T extends SmartContractMethod>({ data, caller }: Props<T>) => {
+const ContractMethodCallable = <T extends SmartContractMethod>({ data, caller, isWrite }: Props<T>) => {
 
   const inputs = React.useMemo(() => {
     return data.payable && (!('inputs' in data) || data.inputs.length === 0) ? [ {
@@ -92,7 +93,7 @@ const ContractMethodCallable = <T extends SmartContractMethod>({ data, caller }:
           flexShrink={ 0 }
           type="submit"
         >
-          Query
+          { isWrite ? 'Write' : 'Query' }
         </Button>
       </chakra.form>
       { 'outputs' in data && data.outputs.length > 0 && (

ui/address/contract/ContractMethodsAccordion.tsx

-import { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, Box, Flex, Link } from '@chakra-ui/react';
+import { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, Box, Flex, Icon, Link, Tooltip } from '@chakra-ui/react';
 import _range from 'lodash/range';
 import React from 'react';
 
 import type { SmartContractMethod } from 'types/api/contract';
 
+import infoIcon from 'icons/info.svg';
+
 interface Props<T extends SmartContractMethod> {
   data: Array<T>;
   renderContent: (item: T, index: number, id: number) => React.ReactNode;
@@ -43,6 +45,19 @@ const ContractMethodsAccordion = <T extends SmartContractMethod>({ data, renderC
                 <Box as="span" fontFamily="heading" fontWeight={ 500 } fontSize="lg" mr={ 1 }>
                   { index + 1 }. { item.type === 'fallback' ? 'fallback' : item.name }
                 </Box>
+                { item.type === 'fallback' && (
+                  <Tooltip
+                    label={ `The fallback function is executed on a call to the contract if none of the other functions match 
+                    the given function signature, or if no data was supplied at all and there is no receive Ether function. 
+                    The fallback function always receives data, but in order to also receive Ether it must be marked payable.` }
+                    placement="top"
+                    maxW="320px"
+                  >
+                    <Box cursor="pointer" display="inherit">
+                      <Icon as={ infoIcon } boxSize={ 5 }/>
+                    </Box>
+                  </Tooltip>
+                ) }
                 <AccordionIcon/>
               </AccordionButton>
             </h2>

ui/address/contract/ContractWrite.tsx

@@ -41,6 +41,7 @@ const ContractWrite = () => {
         key={ id + '_' + index }
         data={ item }
         caller={ contractCaller }
+        isWrite
       />
     );
   }, [ contractCaller ]);