Merge pull request anoma#54 from heliaxdev/bug/48-transfer-transactions

bug/40 - Fix Received Transactions Not Shown
phy-chain · May 11, 2022 · 99c33d0 · 99c33d0
2 parents 8366fce + 0e73388
commit 99c33d0
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 40 deletions.
diff --git a/packages/anoma-wallet/src/App/Token/TokenDetails.tsx b/packages/anoma-wallet/src/App/Token/TokenDetails.tsx
@@ -50,9 +50,13 @@ const TokenDetails = ({ persistor }: Props): JSX.Element => {
   const token = Tokens[tokenType] || {};
 
   // eslint-disable-next-line prefer-const
-  let transactions =
-    (accountTransactions[id] && [...accountTransactions[id]]) || [];
-  transactions.sort((a, b) => b.timestamp - a.timestamp);
+  const transactions = accountTransactions
+    .filter(
+      (transaction) =>
+        transaction.source === establishedAddress ||
+        transaction.target === establishedAddress
+    )
+    .reverse();
 
   useEffect(() => {
     dispatch(fetchBalanceByAccount(account));
@@ -128,7 +132,10 @@ const TokenDetails = ({ persistor }: Props): JSX.Element => {
                 <TransactionListItem key={`${appliedHash}:${timestamp}`}>
                   <div>
                     <strong>
-                      {type ? "Received" : "Sent"} {amount} {tokenType}
+                      {transaction.source === establishedAddress
+                        ? "Sent "
+                        : "Received "}
+                      ({type}) {amount} {tokenType}
                     </strong>
                     <br />
                     {dateTimeFormatted}

diff --git a/packages/anoma-wallet/src/App/Token/Transfers/TransferDetails.tsx b/packages/anoma-wallet/src/App/Token/Transfers/TransferDetails.tsx
@@ -13,21 +13,19 @@ type TransferDetailsParams = {
 
 const TransferDetail = (): JSX.Element => {
   const navigate = useNavigate();
-  const { id = "", appliedHash = "" } = useParams<TransferDetailsParams>();
-  const { transactions: accountTransactions } = useAppSelector<TransfersState>(
+  const { appliedHash = "" } = useParams<TransferDetailsParams>();
+  const { transactions } = useAppSelector<TransfersState>(
     (state) => state.transfers
   );
 
-  const transactions = accountTransactions[id] || [];
-
   const {
     tokenType,
     amount,
     gas = 0,
     timestamp = 0,
     height = 0,
     memo,
-    shielded,
+    source,
     target,
     type,
   } = transactions.find(
@@ -47,11 +45,15 @@ const TransferDetail = (): JSX.Element => {
       </NavigationContainer>
       <p>
         <strong>
-          {type ? "Received" : "Sent"} {amount} {tokenType}
+          {type}
+          <br />
+          {amount} {tokenType}
         </strong>
         <br />
         {dateTimeFormatted}
       </p>
+      <p>Source address:</p>
+      <Address>{source}</Address>
       <p>Target address:</p>
       <Address>{target}</Address>
       <p>Applied hash:</p>
@@ -63,9 +65,6 @@ const TransferDetail = (): JSX.Element => {
         Block height: <strong>{height}</strong>
       </p>
       <p>Notes: {memo ? memo : "n/a"}</p>
-      <p>
-        Shielded transaction?: <strong>{shielded ? "Yes!" : "No"}</strong>
-      </p>
     </TransferDetailContainer>
   );
 };

diff --git a/packages/anoma-wallet/src/slices/accounts.ts b/packages/anoma-wallet/src/slices/accounts.ts
@@ -106,7 +106,7 @@ export const submitInitAccountTransaction = createAsyncThunk(
       establishedAddress,
     };
 
-    if (url.match(/testnet/)) {
+    if (url.match(/testnet|localhost/)) {
       dispatch(
         submitTransferTransaction({
           account: initializedAccount,

diff --git a/packages/anoma-wallet/src/slices/transfers.ts b/packages/anoma-wallet/src/slices/transfers.ts
@@ -7,25 +7,22 @@ import { amountFromMicro, promiseWithTimeout } from "utils/helpers";
 import { DerivedAccount, fetchBalanceByAccount } from "./accounts";
 
 enum TransferType {
-  Sent,
-  Received,
+  IBC = "IBC",
+  Shielded = "Shielded",
+  NonShielded = "Non-Shielded",
 }
 
 export type TransferTransaction = {
-  tokenType: TokenType;
-  appliedHash: string;
+  source: string;
   target: string;
+  type: TransferType;
   amount: number;
-  memo?: string;
-  shielded: boolean;
-  gas: number;
   height: number;
+  tokenType: TokenType;
+  gas: number;
+  appliedHash: string;
+  memo: string;
   timestamp: number;
-  type: TransferType;
-};
-
-type TransferTransactions = {
-  [accountId: string]: TransferTransaction[];
 };
 
 type TransferEvents = {
@@ -34,7 +31,7 @@ type TransferEvents = {
 };
 
 export type TransfersState = {
-  transactions: TransferTransactions;
+  transactions: TransferTransaction[];
   isTransferSubmitting: boolean;
   transferError?: string;
   events?: TransferEvents;
@@ -69,16 +66,19 @@ export const submitTransferTransaction = createAsyncThunk(
   ) => {
     const {
       id,
-      establishedAddress: source = "",
+      establishedAddress = "",
       tokenType,
       signingKey: privateKey,
     } = account;
+
+    const source = useFaucet ? FAUCET_ADDRESS : establishedAddress;
+
     const epoch = await rpcClient.queryEpoch();
     const transfer = await new Transfer().init();
     const token = Tokens[tokenType];
 
     const { hash, bytes } = await transfer.makeTransfer({
-      source: useFaucet ? FAUCET_ADDRESS : source,
+      source,
       target,
       token: token.address || "",
       amount,
@@ -117,23 +117,23 @@ export const submitTransferTransaction = createAsyncThunk(
       id,
       useFaucet,
       transaction: {
+        source,
+        target,
         appliedHash,
         tokenType,
-        target,
         amount,
         memo,
-        shielded,
         gas,
         height,
         timestamp: new Date().getTime(),
-        type: useFaucet ? TransferType.Received : TransferType.Sent,
+        type: shielded ? TransferType.Shielded : TransferType.NonShielded,
       },
     };
   }
 );
 
 const initialState: TransfersState = {
-  transactions: {},
+  transactions: [],
   isTransferSubmitting: false,
 };
 
@@ -170,10 +170,8 @@ const transfersSlice = createSlice({
           transaction: TransferTransaction;
         }>
       ) => {
-        const { id, useFaucet, transaction } = action.payload;
+        const { useFaucet, transaction } = action.payload;
         const { gas, appliedHash } = transaction;
-        const transactions = state.transactions[id] || [];
-        transactions.push(transaction);
 
         state.isTransferSubmitting = false;
         state.transferError = undefined;
@@ -185,10 +183,7 @@ const transfersSlice = createSlice({
             }
           : undefined;
 
-        state.transactions = {
-          ...state.transactions,
-          [id]: transactions,
-        };
+        state.transactions.push(transaction);
       }
     );
   },