Tweaks, stalk struct, other cleanup and misc fixes (#528)

projects/ui/src/components/Balances/Actions/ClaimSiloRewards.tsx

@@ -25,7 +25,7 @@ import useToggle from '~/hooks/display/useToggle';
 import useGetChainToken from '~/hooks/chain/useGetChainToken';
 import useFarmerSiloBalances from '~/hooks/farmer/useFarmerSiloBalances';
 import RewardsForm, { ClaimRewardsFormParams } from '../../Silo/RewardsForm';
-import { ClaimRewardsAction } from '~/lib/Beanstalk/Farm';
+import { ClaimRewardsAction } from '~/util';
 import { UNRIPE_BEAN, UNRIPE_BEAN_CRV3 } from '~/constants/tokens';
 import DescriptionButton from '../../Common/DescriptionButton';
 import GasTag from '../../Common/GasTag';
@@ -343,6 +343,9 @@ const RewardsContent: React.FC<{}> = () => {
   );
 };
 
+/**
+ * FIXME: only used on the Balances page, but duplicates a ton of code
+ */
 const ClaimSiloRewards: React.FC<{}> = () => (
   <Module>
     <ModuleContent pt={1.5} px={1} pb={1}>

projects/ui/src/components/Balances/Actions/index.tsx

@@ -1,6 +1,5 @@
 import { Stack } from '@mui/material';
 import React from 'react';
-import ClaimSiloRewards from './ClaimSiloRewards';
 import QuickHarvest from './QuickHarvest';
 import QuickRinse from './QuickRinse';
 import useBanner from '~/hooks/app/useBanner';
@@ -21,7 +20,7 @@ const BalancesActions: React.FC<{}> = () => {
     >
       <QuickHarvest />
       <QuickRinse />
-      <ClaimSiloRewards />
+      {/* <ClaimSiloRewards /> */}
     </Stack>
   );
 };

projects/ui/src/components/Common/Fiat.tsx

@@ -65,11 +65,13 @@ const Fiat: FC<{
           />
           <span>{displayValue}</span>
         </>
-      ) : (
+      ) : price?.gt(0) ? (
         <>
           <span>$</span>
           <span>{displayValue}</span>
         </>
+      ) : (
+        <span>?</span>
       )}
     </Row>
   );

projects/ui/src/components/Common/Table/cells.tsx

@@ -24,17 +24,18 @@ const COLUMNS = {
   ///
   /// Generics
   ///
-  season: {
-    field: 'season',
+  depositId: (header: string) => ({
+    // The field is always `stem`, we just change the header for legacy seasons
+    field: 'stem',
     flex: 0.8,
-    headerName: 'Season',
+    headerName: header,
     align: 'left',
     headerAlign: 'left',
     valueFormatter: (params: GridValueFormatterParams) =>
       params.value.toString(),
     renderCell: basicCell,
     sortable: false,
-  } as GridColumns[number],
+  }),
 
   ///
   /// Silo

projects/ui/src/components/Nav/SettingsDialog.tsx

@@ -98,14 +98,27 @@ const SettingsDialog: FC<{ open: boolean; onClose?: () => void }> = ({
             curr,
             crate.amount,
             crate.bdv,
-            crate.season,
-            crate.stalk,
+            crate.stem,
+            crate.stalk.total,
+            crate.stalk.base,
+            crate.stalk.grown,
             crate.seeds,
           ])
         );
         return prev;
       },
-      [['Token', 'Amount', 'BDV', 'Season', 'Stalk', 'Seeds']] as any[]
+      [
+        [
+          'Token',
+          'Amount',
+          'BDV',
+          'Season',
+          'Total Stalk',
+          'Base Stalk',
+          'Grown Stalk',
+          'Seeds',
+        ],
+      ] as any[]
     );
     window.open(
       encodeURI(

projects/ui/src/components/Silo/Actions/Convert.tsx

@@ -353,14 +353,6 @@ const ConvertForm: FC<
               </Box>
             ) : null}
 
-            <Box>
-              <WarningAlert>
-                Due to an issue with the existing Silo implementation, some
-                Stalk may be lost during this Convert. An upcoming BIP known as
-                Silo V3 fixes this issue.
-              </WarningAlert>
-            </Box>
-
             {/* Add-on transactions */}
             <AdditionalTxnsAccordion filter={disabledFormActions} />
 

projects/ui/src/components/Silo/Actions/Deposit.tsx

@@ -183,7 +183,9 @@ const DepositForm: FC<
   const shouldApprove =
     values.balanceFrom === BalanceFrom.EXTERNAL ||
     (values.balanceFrom === BalanceFrom.TOTAL &&
-      values.tokens[0].amount?.gt(balances[tokenIn.address].internal));
+      values.tokens[0].amount?.gt(
+        balances[tokenIn.address]?.internal || ZERO_BN
+      ));
 
   return (
     <FormWithDrawer noValidate autoComplete="off" siblingRef={siblingRef}>

projects/ui/src/components/Silo/Actions/Deposits.tsx

@@ -1,13 +1,12 @@
 import React, { useMemo } from 'react';
-import BigNumber from 'bignumber.js';
 import { useAccount as useWagmiAccount } from 'wagmi';
 import { Stack, Tooltip, Typography } from '@mui/material';
 import { GridColumns } from '@mui/x-data-grid';
+import { ethers } from 'ethers';
 import { Token } from '~/classes';
 import { FarmerSiloBalance } from '~/state/farmer/silo';
 import type { LegacyDepositCrate } from '~/state/farmer/silo';
 import { displayBN, displayFullBN } from '~/util';
-import useSeason from '~/hooks/beanstalk/useSeason';
 import { BEAN, STALK } from '~/constants/tokens';
 import { ZERO_BN } from '~/constants';
 import useSiloTokenToFiat from '~/hooks/beanstalk/useSiloTokenToFiat';
@@ -16,27 +15,23 @@ import COLUMNS from '~/components/Common/Table/cells';
 import Fiat from '~/components/Common/Fiat';
 import TableCard, { TableCardProps } from '../../Common/TableCard';
 import StatHorizontal from '~/components/Common/StatHorizontal';
-
-/**
- * Prep data to loading to a CratesCard.
- */
 import { FC } from '~/types';
 
 const Deposits: FC<
   {
     token: Token;
     siloBalance: FarmerSiloBalance | undefined;
+    useLegacySeason?: boolean;
   } & Partial<TableCardProps>
-> = ({ token, siloBalance, ...props }) => {
+> = ({ token, siloBalance, useLegacySeason, ...props }) => {
   const Bean = useChainConstant(BEAN);
   const getUSD = useSiloTokenToFiat();
-  const currentSeason = useSeason();
   const account = useWagmiAccount();
 
-  const rows: (LegacyDepositCrate & { id: BigNumber })[] = useMemo(
+  const rows: (LegacyDepositCrate & { id: ethers.BigNumber })[] = useMemo(
     () =>
       siloBalance?.deposited.crates.map((deposit) => ({
-        id: deposit.season,
+        id: deposit.stem,
         ...deposit,
       })) || [],
     [siloBalance?.deposited.crates]
@@ -45,7 +40,7 @@ const Deposits: FC<
   const columns = useMemo(
     () =>
       [
-        COLUMNS.season,
+        COLUMNS.depositId(useLegacySeason ? 'Season' : 'Stem'),
         {
           field: 'amount',
           flex: 1,
@@ -97,44 +92,40 @@ const Deposits: FC<
           headerName: 'Stalk',
           align: 'right',
           headerAlign: 'right',
-          valueFormatter: (params) => displayBN(params.value),
-          renderCell: (params) => {
-            const grownStalk = ZERO_BN; // FIXME
-            const totalStalk = params.value.plus(grownStalk);
-            return (
-              <Tooltip
-                placement="bottom"
-                title={
-                  <Stack gap={0.5}>
-                    <StatHorizontal label="Stalk at Deposit">
-                      {displayFullBN(params.row.stalk, 2, 2)}
-                    </StatHorizontal>
-                    <StatHorizontal label="Stalk grown since Deposit">
-                      {displayFullBN(grownStalk, 2, 2)}
-                    </StatHorizontal>
-                  </Stack>
-                }
-              >
-                <span>
-                  <Typography display={{ xs: 'none', md: 'block' }}>
-                    {displayFullBN(
-                      totalStalk,
-                      STALK.displayDecimals,
-                      STALK.displayDecimals
-                    )}
-                  </Typography>
-                  <Typography display={{ xs: 'block', md: 'none' }}>
-                    {displayBN(totalStalk)}
-                  </Typography>
-                </span>
-              </Tooltip>
-            );
-          },
+          valueFormatter: (params) => displayBN(params.value.total),
+          renderCell: (params) => (
+            <Tooltip
+              placement="bottom"
+              title={
+                <Stack gap={0.5}>
+                  <StatHorizontal label="Stalk at Deposit">
+                    {displayFullBN(params.row.stalk.base, 2, 2)}
+                  </StatHorizontal>
+                  <StatHorizontal label="Stalk grown since Deposit">
+                    {displayFullBN(params.row.stalk.grown, 2, 2)}
+                  </StatHorizontal>
+                </Stack>
+              }
+            >
+              <span>
+                <Typography display={{ xs: 'none', md: 'block' }}>
+                  {displayFullBN(
+                    params.row.stalk.total,
+                    STALK.displayDecimals,
+                    STALK.displayDecimals
+                  )}
+                </Typography>
+                <Typography display={{ xs: 'block', md: 'none' }}>
+                  {displayBN(params.row.stalk.total)}
+                </Typography>
+              </span>
+            </Tooltip>
+          ),
           sortable: false,
         },
         COLUMNS.seeds,
       ] as GridColumns,
-    [token.displayDecimals, Bean]
+    [useLegacySeason, token.displayDecimals, Bean]
   );
 
   const amount = siloBalance?.deposited.amount;

projects/ui/src/components/Silo/Actions/Migrate.tsx

@@ -65,15 +65,21 @@ export const Migrate: FC<{}> = () => {
       console.log(`Migrating...`, params);
 
       try {
-        await sdk.contracts.beanstalk.mowAndMigrate(
-          account,
-          params.tokens,
-          params.seasons,
-          params.amounts,
-          params.stalkDiff,
-          params.seedsDiff,
-          params.proof
-        );
+        if (params.tokens.length === 0) {
+          await sdk.contracts.beanstalk.mowAndMigrateNoDeposits(account);
+        } else {
+          await sdk.contracts.beanstalk.mowAndMigrate(
+            account,
+            params.tokens,
+            params.seasons,
+            params.amounts,
+            params.stalkDiff,
+            params.seedsDiff,
+            params.proof
+          );
+        }
+
+        window.location.reload();
       } catch (e) {
         console.error(e);
       } finally {
@@ -150,6 +156,7 @@ export const Migrate: FC<{}> = () => {
                       maxRows={100}
                       onlyTable
                       hideFooter
+                      useLegacySeason
                     />
                   </AccordionDetails>
                 </Accordion>
@@ -166,9 +173,36 @@ export const Migrate: FC<{}> = () => {
           >
             Migrate
           </LoadingButton>
+          {migrating && (
+            <Typography variant="body1" textAlign="left">
+              The page will refresh when migration is complete.
+            </Typography>
+          )}
+        </Stack>
+      </Box>
+      <Box flex={2}>
+        <Stack spacing={2}>
+          <Stack spacing={1}>
+            <Typography variant="h4">
+              What happens to my Grown Stalk?
+            </Typography>
+            <Typography variant="body1">
+              All of your Grown Stalk will be claimed and applied to your Stalk
+              balance during the migration.
+            </Typography>
+          </Stack>
+          <Stack spacing={1}>
+            <Typography variant="h4">
+              I had withdrawn a deposit but didn&apos;t claim it, will I lose it
+              when migrating?
+            </Typography>
+            <Typography variant="body1">
+              No. After migrating, you can find your withdrawn deposits on the
+              Claim tab.
+            </Typography>
+          </Stack>
         </Stack>
       </Box>
-      <Box flex={2} />
     </Row>
   );
 };

projects/ui/src/components/Silo/Actions/Withdraw.tsx

@@ -329,8 +329,10 @@ const WithdrawPropProvider: FC<{
         );
 
         txToast = new TransactionToast({
-          loading: `Withdrawing ${withdrawAmtStr} ${token.name} from the Silo...`,
-          success: `Withdraw successful. Your ${token.name} will be available to Claim at the start of the next Season.`,
+          loading: `Withdrawing ${withdrawAmtStr} ${token.name} to your ${
+            destination === FarmToMode.EXTERNAL ? 'wallet' : 'Farm balance'
+          }...`,
+          success: `Withdraw successful.`,
         });
 
         const actionsPerformed = txnBundler.setFarmSteps(values.farmActions);

projects/ui/src/components/Silo/Actions/index.tsx

@@ -17,6 +17,7 @@ import useSdk from '~/hooks/sdk';
 import useFarmerSiloBalancesAsync from '~/hooks/farmer/useFarmerSiloBalancesAsync';
 import Convert from './Convert';
 import Claim from '~/components/Silo/Actions/Claim';
+import useMigrationNeeded from '~/hooks/farmer/useMigrationNeeded';
 
 /**
  * Show the three primary Silo actions: Deposit, Withdraw, Claim.
@@ -37,7 +38,7 @@ const SiloActions: FC<{
 }> = (props) => {
   const sdk = useSdk();
   const [tab, handleChange] = useTabs(SLUGS, 'action');
-  const hasClaimable = props.siloBalance?.claimable?.amount.gt(0);
+  const migrationNeeded = useMigrationNeeded();
 
   /// Temporary solutions. Remove these when we move the site to use the new sdk types.
   const token = useMemo(() => {
@@ -63,7 +64,7 @@ const SiloActions: FC<{
           <Tab label="Transfer" />
           <Tab label="Withdraw" />
           {hasClaimableBeans && (
-            <BadgeTab label="Claim" showBadge={hasClaimable} />
+            <BadgeTab label="Claim" showBadge={hasClaimableBeans} />
           )}
         </ModuleTabs>
         <ModuleContent>
@@ -83,7 +84,11 @@ const SiloActions: FC<{
       </Module>
       {/* Tables */}
       <Box>
-        <Deposits token={props.token} siloBalance={props.siloBalance} />
+        <Deposits
+          token={props.token}
+          siloBalance={props.siloBalance}
+          useLegacySeason={migrationNeeded}
+        />
       </Box>
     </>
   );