dex: activity fixes

projects/dex-ui/src/components/Well/Activity/eventRender.tsx

@@ -1,6 +1,6 @@
 import { Well } from "@beanstalk/sdk/Wells";
 import React from "react";
-import { AddEvent, EVENT_TYPE, RemoveEvent, SwapEvent, WellEvent } from "src/wells/useWellHistory";
+import { AddEvent, EVENT_TYPE, RemoveEvent, ShiftEvent, SwapEvent, WellEvent } from "src/wells/useWellHistory";
 import { Row, Td } from "../Table";
 import { TokenValue } from "@beanstalk/sdk";
 import styled from "styled-components";
@@ -20,16 +20,24 @@ export const renderEvent = (event: WellEvent, well: Well, prices: (TokenValue |
 
   switch (event.type) {
     case EVENT_TYPE.SWAP:
-      event = event as SwapEvent;
+      // typescript bug if we leave this as event, it will cast it as "SwapEvent | ShiftEvent" for some reason
+      const tempEvent = event as SwapEvent;
       action = "Swap";
-      valueUSD = `$${event.fromAmount
-        .mul(tokenPrices[event.fromToken.symbol] || 0)
-        .add(event.toAmount.mul(tokenPrices[event.toToken.symbol] || 0))
+      valueUSD = `$${tempEvent.fromAmount
+        .mul(tokenPrices[tempEvent.fromToken.symbol] || 0)
+        // .add(tempEvent.toAmount.mul(tokenPrices[tempEvent.toToken.symbol] || 0))
         .toHuman("short")}`;
-      description = `${event.fromAmount.toHuman("short")} ${event.fromToken.symbol} for ${event.toAmount.toHuman("short")} ${
-        event.toToken.symbol
+      description = `${tempEvent.fromAmount.toHuman("short")} ${tempEvent.fromToken.symbol} for ${tempEvent.toAmount.toHuman("short")} ${
+        tempEvent.toToken.symbol
       }`;
 
+      break;
+    case EVENT_TYPE.SHIFT:
+      event = event as ShiftEvent;
+      action = "Shift";
+      valueUSD = `$${event.toAmount.mul(tokenPrices[event.toToken.symbol] || 0).toHuman("short")}`;
+      description = `Swaped to ${event.toAmount.toHuman("short")} ${event.toToken.symbol}`;
+
       break;
     case EVENT_TYPE.ADD_LIQUIDITY:
       event = event as AddEvent;
@@ -60,14 +68,16 @@ export const renderEvent = (event: WellEvent, well: Well, prices: (TokenValue |
     case EVENT_TYPE.SYNC:
       event = event as AddEvent;
       action = "Add Liquidity";
-      valueUSD = `$${(event.lpAmount).mul(lpTokenPrice).toHuman("short")}`;
+      valueUSD = `$${event.lpAmount.mul(lpTokenPrice).toHuman("short")}`;
       description = "Sync";
       break;
   }
   return (
     <Row key={event.tx}>
       <Td>
-        <Action href={`https://etherscan.io/tx/${event.tx}`} target="_blank" rel="noopener noreferrer">{action}</Action>
+        <Action href={`https://etherscan.io/tx/${event.tx}`} target="_blank" rel="noopener noreferrer">
+          {action}
+        </Action>
       </Td>
       <DesktopOnlyTd align={"right"}>{valueUSD}</DesktopOnlyTd>
       <DesktopOnlyTd align={"right"}>{description}</DesktopOnlyTd>

projects/dex-ui/src/wells/historyLoader.ts

@@ -1,5 +1,5 @@
 import { BeanstalkSDK } from "@beanstalk/sdk";
-import { AddEvent, BaseEvent, EVENT_TYPE, SwapEvent, WellEvent } from "./useWellHistory";
+import { AddEvent, BaseEvent, EVENT_TYPE, ShiftEvent, SwapEvent, WellEvent } from "./useWellHistory";
 import { fetchFromSubgraphRequest } from "./subgraphFetch";
 import { Settings } from "src/settings";
 import { Well } from "@beanstalk/sdk/Wells";
@@ -14,23 +14,33 @@ const HISTORY_DAYS_AGO_BLOCK_TIMESTAMP = Math.floor(new Date(Date.now() - HISTOR
 const loadFromChain = async (sdk: BeanstalkSDK, well: Well): Promise<any[]> => {
   Log.module("history").debug("Loading history from blockchain");
   const contract = well.contract;
+  const swapFilter = contract.filters.Swap();
   const addFilter = contract.filters.AddLiquidity();
   const removeFilter = contract.filters.RemoveLiquidity();
-  const swapFilter = contract.filters.Swap();
   const syncFilter = contract.filters.Sync();
+  const shiftFilter = contract.filters.Shift();
 
   if (!well.lpToken) await well.getLPToken();
 
   const combinedFilter = {
     address: contract.address,
-    topics: [[swapFilter?.topics?.[0] as string, addFilter?.topics?.[0] as string, removeFilter?.topics?.[0] as string, syncFilter?.topics?.[0] as string]]
+    topics: [
+      [
+        swapFilter?.topics?.[0] as string,
+        addFilter?.topics?.[0] as string,
+        removeFilter?.topics?.[0] as string,
+        syncFilter?.topics?.[0] as string,
+        shiftFilter?.topics?.[0] as string
+      ]
+    ]
   };
 
   const getEventType = (topics: string[]) => {
     if (isEqual(addFilter.topics, topics)) return EVENT_TYPE.ADD_LIQUIDITY;
     if (isEqual(removeFilter.topics, topics)) return EVENT_TYPE.REMOVE_LIQUIDITY;
     if (isEqual(swapFilter.topics, topics)) return EVENT_TYPE.SWAP;
     if (isEqual(syncFilter.topics, topics)) return EVENT_TYPE.SYNC;
+    if (isEqual(shiftFilter.topics, topics)) return EVENT_TYPE.SHIFT;
 
     throw new Error("Unknown topics found: " + topics);
   };
@@ -62,6 +72,16 @@ const loadFromChain = async (sdk: BeanstalkSDK, well: Well): Promise<any[]> => {
       };
       return event;
     }
+    if (type === EVENT_TYPE.SHIFT) {
+      const data = contract.interface.decodeEventLog("Shift", e.data, e.topics);
+      const toToken = well.getTokenByAddress(data.toToken)!;
+      const event: ShiftEvent = {
+        ...base,
+        toToken,
+        toAmount: toToken.fromBlockchain(data.amountOut)
+      };
+      return event;
+    }
     if (type === EVENT_TYPE.ADD_LIQUIDITY) {
       const data = contract.interface.decodeEventLog("AddLiquidity", e.data, e.topics);
       const event: AddEvent = {

projects/dex-ui/src/wells/useWellHistory.tsx

@@ -9,7 +9,8 @@ export enum EVENT_TYPE {
   SWAP,
   ADD_LIQUIDITY,
   REMOVE_LIQUIDITY,
-  SYNC
+  SYNC,
+  SHIFT
 }
 
 export type BaseEvent = {
@@ -19,6 +20,11 @@ export type BaseEvent = {
   block?: number;
 };
 
+export type ShiftEvent = BaseEvent & {
+  toToken: Token;
+  toAmount: TokenValue;
+};
+
 export type SwapEvent = BaseEvent & {
   fromToken: Token;
   fromAmount: TokenValue;
@@ -32,7 +38,7 @@ export type AddEvent = BaseEvent & {
 };
 export type RemoveEvent = AddEvent;
 
-export type WellEvent = SwapEvent | AddEvent | RemoveEvent;
+export type WellEvent = SwapEvent | AddEvent | RemoveEvent | ShiftEvent ;
 
 const useWellHistory = (well: Well) => {
   const sdk = useSdk();