Merge master to rococo

.env.development

@@ -17,4 +17,6 @@ VITE_EVM_CHAIN_ID=222222
 VITE_EVM_NATIVE_ASSET_ID=20
 VITE_MIGRATION_TRIGGER_DOMAIN="deploy-preview-1334--testnet-hydra-app.netlify.app"
 VITE_MIGRATION_TARGET_DOMAIN="testnet-app.hydradx.io"
-VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+
+VITE_FF_AAVE_AMM_ENABLED=true

.env.production

@@ -17,4 +17,6 @@ VITE_EVM_CHAIN_ID=222222
 VITE_EVM_NATIVE_ASSET_ID=20
 VITE_MIGRATION_TRIGGER_DOMAIN="app.hydradx.io"
 VITE_MIGRATION_TARGET_DOMAIN="app.hydration.net"
-VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+
+VITE_FF_AAVE_AMM_ENABLED=false

.env.rococo

@@ -17,4 +17,6 @@ VITE_EVM_CHAIN_ID=
 VITE_EVM_NATIVE_ASSET_ID=20
 VITE_MIGRATION_TRIGGER_DOMAIN=""
 VITE_MIGRATION_TARGET_DOMAIN=""
-VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+VITE_FF_UNIFIED_ADDRESS_FORMAT="false"
+
+VITE_FF_AAVE_AMM_ENABLED=true

package.json

@@ -38,16 +38,16 @@
     "@emotion/styled": "^11.10.4",
     "@ethersproject/address": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@galacticcouncil/apps": "^10.10.0",
+    "@galacticcouncil/apps": "^12.0.0",
     "@galacticcouncil/math-lbp": "^1.0.0",
     "@galacticcouncil/math-liquidity-mining": "^1.0.0",
     "@galacticcouncil/math-omnipool": "^1.1.0",
-    "@galacticcouncil/math-stableswap": "^1.2.0",
+    "@galacticcouncil/math-stableswap": "^2.0.0",
     "@galacticcouncil/math-staking": "^1.0.0",
     "@galacticcouncil/math-xyk": "^1.0.0",
-    "@galacticcouncil/sdk": "^5.6.0",
-    "@galacticcouncil/ui": "^5.4.0",
-    "@galacticcouncil/xcm-cfg": "^8.1.0",
+    "@galacticcouncil/sdk": "^6.0.0",
+    "@galacticcouncil/ui": "^5.5.0",
+    "@galacticcouncil/xcm-cfg": "^9.0.0",
     "@galacticcouncil/xcm-core": "^7.0.0",
     "@galacticcouncil/xcm-sdk": "^9.1.1",
     "@hookform/resolvers": "^3.3.4",

src/api/provider.ts

@@ -51,6 +51,8 @@ const defaultProvider: Omit<ProviderProps, "name" | "url"> = {
   dataEnv: "mainnet",
 }
 
+const AAVE_AMM_ENABLED = import.meta.env.VITE_FF_AAVE_AMM_ENABLED === "true"
+
 export const PROVIDERS: ProviderProps[] = [
   {
     name: "GalacticCouncil",
@@ -404,6 +406,11 @@ export const useProviderData = (
         PoolType.XYK,
         PoolType.LBP,
       ]
+
+      if (AAVE_AMM_ENABLED) {
+        traderRoutes.push(PoolType.Aave)
+      }
+
       const tradeRouter = new TradeRouter(poolService, {
         includeOnly: traderRoutes,
       })

src/i18n/locales/en/translations.json

@@ -1081,6 +1081,7 @@
   "lending.apyStable": "APY, stable",
   "lending.apyType": "APY type",
   "lending.apyVariable": "APY, variable",
+  "lending.apyBorrowRate": "APY, borrow rate",
   "lending.asset": "Asset",
   "lending.available": "Available",
   "lending.balance": "Balance",
@@ -1098,6 +1099,7 @@
   "lending.reserveFactor": "Reserve factor",
   "lending.viewContract": "View contract",
   "lending.maxLTV": "Max LTV",
+  "lending.totalWorth": "Total worth",
   "lending.apyType.switch.title": "Select APY type to switch",
   "lending.apyType.switch.charts": "See charts",
   "lending.collateralUsage": "Collateral usage",
@@ -1120,12 +1122,18 @@
   "lending.tooltip.maxLTV": "The Maximum LTV ratio represents the maximum borrowing power of a specific collateral. For example, if a collateral has an LTV of 75%, the user can borrow up to 0.75 worth of ETH in the principal currency for every 1 ETH worth of collateral.",
   "lending.tooltip.liquidationThreshold": "This represents the threshold at which a borrow position will be considered undercollateralized and subject to liquidation for each collateral. For example, if a collateral has a liquidation threshold of 80%, it means that the position will be liquidated when the debt value is worth 80% of the collateral value.",
   "lending.tooltip.liquidationPenalty": "When a liquidation occurs, liquidators repay up to 50% of the outstanding borrowed amount on behalf of the borrower. In return, they can buy the collateral at a discount and keep the difference (liquidation penalty) as a bonus.",
+  "lending.tooltip.fixedAPYTooltip": "This rate may be changed over time depending on the need for the {{ symbol }} supply to contract/expand.",
   "lending.reserve.overview": "Overview",
   "lending.reserve.yourInfo": "Your info",
   "lending.reserve.paused": "Because this asset is paused, no actions can be taken until further notice.",
   "lending.reserve.frozen": "Since this asset is frozen, the only available actions are withdraw and repay.",
   "lending.reserve.collectorInfo": "Collector info",
   "lending.reserve.collectorContract": "Collector Contract",
+  "lending.reserve.reserveSize":"Reserve size",
+  "lending.reserve.maxToBorrow":"Maximum available to borrow",
+  "lending.reserve.availableLiq":"Available liquidity",
+  "lending.reserve.utilRate":"Utilization rate",
+  "lending.reserve.oraclePrice":"Oracle price",
   "lending.wallet.connect.description": "Please connect a wallet to view your personal information here.",
   "lending.supply.isolatedCollateral.title": "Asset can only be used as collateral in isolation mode only.",
   "lending.supply.isolatedCollateral.description": "In Isolation mode you cannot supply other assets as collateral for borrowing. Assets used as collateral in Isolation mode can only be borrowed to a specific debt ceiling.",
@@ -1173,8 +1181,6 @@
   "lending.bind.banner.button": "Enable Borrowing",
   "lending.hollar.banner.title": "Meet HOLLAR",
   "lending.hollar.banner.description": "HOLLAR is a native decentralized, collateral-backed digital asset",
-  "lending.hollar.banner.total": "Total borrowed",
-  "lending.hollar.banner.apy": "Borrow rate APY",
   "lending.risk.liquidationValue": "Liquidation value",
   "lending.risk.liquidationThreshold": "Liquidation threshold",
   "lending.risk.liquidationPenalty": "Liquidation penalty",
@@ -1204,7 +1210,9 @@
   "lending.history.event.withdraw": "Withdraw",
   "lending.history.event.liquidation": "Liquidation", 
   "lending.history.event.collateral": "Collateral Change",
-  "lending.history.event.emode": "User EMode Set", 
+  "lending.history.event.emode": "User EMode Set",
+  "lending.claimRewards.toast.onLoading": "Claiming <0>{{ value, bignumber(type: token) }} {{ symbol }}</0>...",
+  "lending.claimRewards.toast.onSuccess": "Claimed <0>{{ value, bignumber(type: token) }} {{ symbol }}</0>.",
   "migration.export.title": "HydraDX is now Hydration",
   "migration.export.description": "As part of the rebranding, this app has moved to app.hydration.net.",
   "migration.export.question": "Would you like to migrate all past app settings to the new app?",

src/sections/assets/AssetsModal.utils.tsx

@@ -150,6 +150,7 @@ export const useAssetsData = ({
     bonds: bondAssets,
     isBond,
     tokens: tokenAssets,
+    erc20,
   } = useAssets()
   const { data } = useAccountAssets()
 
@@ -225,7 +226,12 @@ export const useAssetsData = ({
 
     const tokens = allAssets
       ? getAssetBalances(
-          [...tokenAssets, ...stableswap, ...(withExternal ? external : [])],
+          [
+            ...tokenAssets,
+            ...stableswap,
+            ...(withExternal ? external : []),
+            ...erc20,
+          ],
           tokensData,
         )
       : tokensData
@@ -244,6 +250,7 @@ export const useAssetsData = ({
     withExternal,
     getAssetPrice,
     isLoading,
+    erc20,
   ])
 
   const bonds = useMemo(() => {

src/sections/lending/LendingDashboardPage.tsx

@@ -11,12 +11,14 @@ import { SupplyAssetsTable } from "sections/lending/ui/table/supply-assets/Suppl
 import { useEvmAccount } from "sections/web3-connect/Web3Connect.utils"
 import { theme } from "theme"
 import { SContainer, SFilterContainer } from "./LendingDashboardPage.styled"
+import { HollarBanner } from "sections/lending/ui/hollar/hollar-banner/HollarBanner"
+import { useAppDataContext } from "sections/lending/hooks/app-data-provider/useAppDataProvider"
 
 export const LendingDashboardPage = () => {
   const { t } = useTranslation()
   const [mode, setMode] = useState<"supply" | "borrow">("supply")
   const isDesktop = useMedia(theme.viewport.gte.sm)
-
+  const { ghoEnabled } = useAppDataContext()
   const { account: evmAccount, isBound, isLoading } = useEvmAccount()
 
   const shouldRenderSupply = mode === "supply" || isDesktop
@@ -25,6 +27,7 @@ export const LendingDashboardPage = () => {
   return (
     <>
       <DashboardHeaderValues sx={{ mb: [10, 40] }} />
+      {ghoEnabled && <HollarBanner sx={{ mb: [10, 40] }} />}
       {evmAccount && !isLoading && !isBound && (
         <MoneyMarketBanner sx={{ mb: [20, 30] }} />
       )}

src/sections/lending/LendingMarketsPage.tsx

@@ -2,11 +2,16 @@ import { useNavigate, useSearch } from "@tanstack/react-location"
 import { Search } from "components/Search/Search"
 import { useState } from "react"
 import { useDebounce } from "react-use"
+import { useAppDataContext } from "sections/lending/hooks/app-data-provider/useAppDataProvider"
 import { MarketsHeaderValues } from "sections/lending/ui/header/MarketsHeaderValues"
+import { HollarBanner } from "sections/lending/ui/hollar/hollar-banner/HollarBanner"
 import { MarketAssetsTable } from "sections/lending/ui/table/market-assets/MarketAssetsTable"
 
 export const LendingMarketsPage = () => {
   const navigate = useNavigate()
+
+  const { ghoEnabled } = useAppDataContext()
+
   const query = useSearch<{
     Search: {
       search?: string
@@ -32,6 +37,7 @@ export const LendingMarketsPage = () => {
   return (
     <>
       <MarketsHeaderValues sx={{ mb: [10, 40] }} />
+      {ghoEnabled && <HollarBanner sx={{ mb: [10, 40] }} />}
       <Search
         name="market-search"
         placeholder="Search by token name, symbol or address"

src/sections/lending/LendingReserveOverviewPage.tsx

@@ -17,6 +17,9 @@ import {
 import { useEvmAccount } from "sections/web3-connect/Web3Connect.utils"
 import { MoneyMarketBanner } from "sections/lending/ui/money-market/MoneyMarketBanner"
 import { ReserveActionsSkeleton } from "sections/lending/skeleton/LendingReserveOverviewSkeleton"
+import { useRootStore } from "sections/lending/store/root"
+import { useProtocolDataContext } from "sections/lending/hooks/useProtocolDataContext"
+import { GhoReserveConfiguration } from "sections/lending/ui/reserve-overview/gho/GhoReserveConfiguration"
 
 export type LendingReserveOverviewPageProps = {
   underlyingAsset: string
@@ -26,19 +29,25 @@ export const LendingReserveOverviewPage: React.FC<
   LendingReserveOverviewPageProps
 > = ({ underlyingAsset }) => {
   const { t } = useTranslation()
+  const displayGho = useRootStore((store) => store.displayGho)
+  const { reserves } = useAppDataContext()
+  const { currentMarket } = useProtocolDataContext()
 
   const { isBound, isLoading, account: evmAccount } = useEvmAccount()
 
   const shouldRenderReserveActions = !evmAccount || (!!evmAccount && isBound)
 
-  const { reserves } = useAppDataContext()
-
   const reserve = reserves.find(
     (reserve) => reserve.underlyingAsset === underlyingAsset,
   ) as ComputedReserveData
 
   const [mode, setMode] = useState<"overview" | "actions">("overview")
 
+  const isGho = displayGho({
+    symbol: reserve.symbol,
+    currentMarket,
+  })
+
   return (
     <AssetCapsProvider asset={reserve}>
       <ReserveOverviewHeaderValues
@@ -67,7 +76,11 @@ export const LendingReserveOverviewPage: React.FC<
       </SFilterContainer>
       <SContent>
         <SContainer active={mode === "overview"}>
-          <ReserveConfiguration reserve={reserve} />
+          {isGho ? (
+            <GhoReserveConfiguration reserve={reserve} />
+          ) : (
+            <ReserveConfiguration reserve={reserve} />
+          )}
         </SContainer>
         {shouldRenderReserveActions ? (
           <SContainer active={mode === "actions"}>

src/sections/lending/components/incentives/GhoIncentivesCard.tsx

@@ -0,0 +1,102 @@
+import { InfoTooltip } from "components/InfoTooltip/InfoTooltip"
+import { Text } from "components/Typography/Text/Text"
+import { FormattedNumber } from "sections/lending/components/primitives/FormattedNumber"
+import { Link } from "sections/lending/components/primitives/Link"
+import { NoData } from "sections/lending/components/primitives/NoData"
+import { TokenIcon } from "sections/lending/components/primitives/TokenIcon"
+import { useAppDataContext } from "sections/lending/hooks/app-data-provider/useAppDataProvider"
+import { HollarBorrowApyRange } from "sections/lending/ui/hollar/hollar-banner/HollarBorrowApyRange"
+
+export interface GhoIncentivesCardProps {
+  value: string | number
+  useApyRange?: boolean
+  rangeValues?: [number, number]
+  stkAaveBalance: string | number
+  ghoRoute: string
+  userQualifiesForDiscount: boolean
+  onMoreDetailsClick?: () => void
+  withTokenIcon?: boolean
+  forceShowTooltip?: boolean
+}
+
+export const GhoIncentivesCard = ({
+  value,
+  useApyRange,
+  rangeValues = [0, 0],
+  ghoRoute,
+  stkAaveBalance,
+  userQualifiesForDiscount,
+  onMoreDetailsClick,
+  withTokenIcon = false,
+  forceShowTooltip = false,
+}: GhoIncentivesCardProps) => {
+  const { ghoReserveData } = useAppDataContext()
+  const stkAaveAmount = Number(stkAaveBalance)
+
+  const minStkAaveBalanceReached =
+    stkAaveAmount >= ghoReserveData.ghoMinDiscountTokenBalanceForDiscount
+
+  let toolTipContent = <></>
+  const showTooltip = userQualifiesForDiscount || forceShowTooltip
+  if (showTooltip) {
+    toolTipContent = (
+      <div
+        sx={{
+          py: 4,
+          px: 6,
+          fontSize: "12px",
+          lineHeight: "16px",
+        }}
+      >
+        <Text fs={12} lh={16} sx={{ py: 12, px: 18 }}>
+          <span>
+            Estimated compounding interest, including discount for Staking{" "}
+            {minStkAaveBalanceReached ? (
+              <>
+                <FormattedNumber value={stkAaveAmount} visibleDecimals={2} />{" "}
+              </>
+            ) : null}
+            in Safety Module.
+          </span>{" "}
+          <Link onClick={onMoreDetailsClick} href={ghoRoute}>
+            <span>Learn more</span>
+          </Link>
+        </Text>
+      </div>
+    )
+  }
+
+  return (
+    <div
+      sx={{
+        flex: "column",
+        align: ["flex-end", "center"],
+        justify: "center",
+        textAlign: "center",
+      }}
+    >
+      {value.toString() !== "-1" ? (
+        <InfoTooltip text={toolTipContent}>
+          <div sx={{ flex: "row", align: "center" }}>
+            {withTokenIcon && (
+              <TokenIcon
+                symbol="stkAAVE"
+                sx={{ height: 14, width: 14, mr: 1 }}
+              />
+            )}
+            {useApyRange ? (
+              <HollarBorrowApyRange
+                minVal={Math.min(...rangeValues)}
+                maxVal={Math.max(...rangeValues)}
+              />
+            ) : (
+              <FormattedNumber value={value} percent />
+            )}
+          </div>
+        </InfoTooltip>
+      ) : (
+        <NoData />
+      )}
+    </div>
+  )
+}

src/sections/lending/ui/incentives/IncentivesButton.styled.ts → src/sections/lending/components/incentives/IncentivesButton.styled.ts

@@ -8,13 +8,14 @@ export const SContainer = styled.div`
   padding: 2px 4px;
 
   font-size: 12px;
+  line-height: 1;
 
-  border: 1px solid ${theme.colors.basic800};
+  border: 1px solid rgba(${theme.rgbColors.basic300}, 0.2);
   border-radius: ${theme.borderRadius.default}px;
+  background-color: rgba(${theme.rgbColors.basic300}, 0.1);
 
   cursor: pointer;
 
-  background-color: transparent;
   &:hover {
     background-color: rgba(${theme.rgbColors.basic300}, 0.2);
     border-color: rgba(${theme.rgbColors.basic300}, 0.2);