chore: prop cleanup + naming

aragon · Mar 25, 2024 · 18c445d · 18c445d
1 parent b214cff
commit 18c445d
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 16 deletions.
diff --git a/...transactionDataListItem/transactionDataListItemStructure/transactionDataListItem.test.tsx b/...transactionDataListItem/transactionDataListItemStructure/transactionDataListItem.test.tsx
@@ -19,8 +19,8 @@ describe('<TransactionDataListItemStructure /> component', () => {
     };
 
     it('renders the transaction type heading', () => {
-        const transactionType = TransactionType.ACTION;
-        render(createTestComponent({ transactionType }));
+        const txType = TransactionType.ACTION;
+        render(createTestComponent({ txType }));
         const transactionTypeHeading = screen.getByText('Smart contract action');
         expect(transactionTypeHeading).toBeInTheDocument();
     });
@@ -54,7 +54,7 @@ describe('<TransactionDataListItemStructure /> component', () => {
     });
 
     it('overrides the transaction type display with the transaction status', () => {
-        render(createTestComponent({ transactionType: TransactionType.DEPOSIT, status: TxStatusCode.FAILED }));
+        render(createTestComponent({ txType: TransactionType.DEPOSIT, txStatus: TxStatusCode.FAILED }));
         const failedTransactionText = screen.getByText('Failed transaction');
         expect(failedTransactionText).toBeInTheDocument();
         const closeIcon = screen.getByTestId('CLOSE');

diff --git a/...tionDataListItem/transactionDataListItemStructure/transactionDataListItemStructure.api.ts b/...tionDataListItem/transactionDataListItemStructure/transactionDataListItemStructure.api.ts
@@ -51,11 +51,11 @@ export interface ITransactionDataListItemProps extends IDataListItemProps {
     /**
      * The type of transaction.
      */
-    transactionType?: TransactionType;
+    txType?: TransactionType;
     /**
      * The network state of the transaction.
      */
-    status?: TxStatusCode;
+    txStatus?: TxStatusCode;
     /**
      * The Unix timestamp of the transaction.
      */
@@ -64,10 +64,6 @@ export interface ITransactionDataListItemProps extends IDataListItemProps {
      * The estimated USD value of the transaction.
      */
     usdEstimate?: number;
-    /**
-     * Whether the transaction is pending.
-     */
-    isPending?: boolean;
     /**
      * The transaction hash.
      */

diff --git a/...sactionDataListItem/transactionDataListItemStructure/transactionDataListItemStructure.tsx b/...sactionDataListItem/transactionDataListItemStructure/transactionDataListItemStructure.tsx
@@ -26,16 +26,16 @@ export const TransactionDataListItemStructure: React.FC<ITransactionDataListItem
         tokenSymbol,
         tokenValue,
         usdEstimate,
-        transactionType,
-        status = TxStatusCode.PENDING,
+        txType,
+        txStatus = TxStatusCode.PENDING,
         unixTimestamp,
         txHash,
         ...otherProps
     } = props;
 
     const getEffectiveStatus = () => {
-        const type = transactionType;
-        if (status === TxStatusCode.FAILED) {
+        const type = txType;
+        if (txStatus === TxStatusCode.FAILED) {
             return {
                 icon: IconType.CLOSE,
                 variant: 'critical' as AvatarIconVariant,
@@ -53,7 +53,7 @@ export const TransactionDataListItemStructure: React.FC<ITransactionDataListItem
     const { icon, variant, heading } = getEffectiveStatus();
 
     const getTxIcon = () => {
-        if (status !== TxStatusCode.PENDING) {
+        if (txStatus !== TxStatusCode.PENDING) {
             return <AvatarIcon className="shrink-0" variant={variant} icon={icon} responsiveSize={{ md: 'md' }} />;
         }
         return (
@@ -85,7 +85,7 @@ export const TransactionDataListItemStructure: React.FC<ITransactionDataListItem
 
                 <div className="flex flex-col items-end gap-y-0.5">
                     <Heading size="h5" as="h2">
-                        {tokenValue && transactionType !== TransactionType.ACTION ? (
+                        {tokenValue && txType !== TransactionType.ACTION ? (
                             <>
                                 {formatterUtils.formatNumber(tokenValue, { format: NumberFormat.TOKEN_AMOUNT_SHORT })}
                                 {` ${tokenSymbol}`}
@@ -96,7 +96,7 @@ export const TransactionDataListItemStructure: React.FC<ITransactionDataListItem
                     </Heading>
                     <Heading className="!text-neutral-500" size="h5" as="h2">
                         {formatterUtils.formatNumber(
-                            usdEstimate && transactionType !== TransactionType.ACTION ? usdEstimate : 0,
+                            usdEstimate && txType !== TransactionType.ACTION ? usdEstimate : 0,
                             {
                                 format: NumberFormat.FIAT_TOTAL_SHORT,
                             },