Merge branch 'main' into feat/add-alert-plasma-txhistory

Author: AGMASO

.eslintignore

@@ -20,3 +20,5 @@ src/locales/
 *.md
 *.log
 *.lock
+
+src/components/transactions/Swap/backup/**/*.*

.gitignore

@@ -42,6 +42,7 @@ yarn-error.log*
 package-lock.json
 
 .eslintcache
+.yarn-cache
 
 # IDE specific
 .idea

.npmrc

@@ -0,0 +1,6 @@
+# Uncomment for CoW Preview Releases
+
+# @cowprotocol:registry=https://npm.pkg.github.com
+# always-auth=true
+# # registry=https://registry.npmjs.org/
+# //npm.pkg.github.com/:_authToken=${GITHUB_TOKEN}

package.json

@@ -35,9 +35,10 @@
     "@aave/math-utils": "1.36.1",
     "@aave/react": "0.6.1",
     "@amplitude/analytics-browser": "^2.13.0",
-    "@bgd-labs/aave-address-book": "^4.34.1",
-    "@cowprotocol/app-data": "^3.1.0",
-    "@cowprotocol/cow-sdk": "6.3.3",
+    "@bgd-labs/aave-address-book": "^4.36.3",
+    "@cowprotocol/cow-sdk": "7.1.1",
+    "@cowprotocol/sdk-flash-loans": "1.5.3",
+    "@cowprotocol/sdk-ethers-v5-adapter": "0.2.0",
     "@emotion/cache": "11.10.3",
     "@emotion/react": "11.10.4",
     "@emotion/server": "latest",
@@ -157,4 +158,4 @@
     "budgetPercentIncreaseRed": 20,
     "showDetails": true
   }
-}
+}

pages/_app.page.tsx

@@ -16,10 +16,10 @@ import { AddressBlocked } from 'src/components/AddressBlocked';
 import { Meta } from 'src/components/Meta';
 import { TransactionEventHandler } from 'src/components/TransactionEventHandler';
 import { GasStationProvider } from 'src/components/transactions/GasStation/GasStationProvider';
-import { CowOrderToast } from 'src/components/transactions/Switch/cowprotocol/CowOrderToast';
+import { CowOrderToast } from 'src/components/transactions/Swap/modals/result/CowOrderToast';
 import { AppDataProvider } from 'src/hooks/app-data-provider/useAppDataProvider';
-import { CowOrderToastProvider } from 'src/hooks/useCowOrderToast';
 import { ModalContextProvider } from 'src/hooks/useModal';
+import { SwapOrdersTrackingProvider } from 'src/hooks/useSwapOrdersTracking';
 import { Web3ContextProvider } from 'src/libs/web3-data-provider/Web3Provider';
 import { useRootStore } from 'src/store/root';
 import { SharedDependenciesProvider } from 'src/ui-config/SharedDependenciesProvider';
@@ -31,16 +31,22 @@ import createEmotionCache from '../src/createEmotionCache';
 import { AppGlobalStyles } from '../src/layouts/AppGlobalStyles';
 import { LanguageProvider } from '../src/libs/LanguageProvider';
 
-const SwitchModal = dynamic(() =>
-  import('src/components/transactions/Switch/SwitchModal').then((module) => module.SwitchModal)
+const SwapModal = dynamic(() =>
+  import('src/components/transactions/Swap/modals/SwapModal').then((module) => module.SwapModal)
 );
 
 const CollateralSwapModal = dynamic(() =>
-  import('src/components/transactions/Switch/CollateralSwap/CollateralSwapModal').then(
+  import('src/components/transactions/Swap/modals/CollateralSwapModal').then(
     (module) => module.CollateralSwapModal
   )
 );
 
+const DebtSwapModal = dynamic(() =>
+  import('src/components/transactions/Swap/modals/DebtSwapModal').then(
+    (module) => module.DebtSwapModal
+  )
+);
+
 const BridgeModal = dynamic(() =>
   import('src/components/transactions/Bridge/BridgeModal').then((module) => module.BridgeModal)
 );
@@ -53,16 +59,6 @@ const ClaimRewardsModal = dynamic(() =>
     (module) => module.ClaimRewardsModal
   )
 );
-const CollateralChangeModal = dynamic(() =>
-  import('src/components/transactions/CollateralChange/CollateralChangeModal').then(
-    (module) => module.CollateralChangeModal
-  )
-);
-const DebtSwitchModal = dynamic(() =>
-  import('src/components/transactions/DebtSwitch/DebtSwitchModal').then(
-    (module) => module.DebtSwitchModal
-  )
-);
 const EmodeModal = dynamic(() =>
   import('src/components/transactions/Emode/EmodeModal').then((module) => module.EmodeModal)
 );
@@ -93,6 +89,11 @@ const CancelCowOrderModal = dynamic(() =>
 const ReadOnlyModal = dynamic(() =>
   import('src/components/WalletConnection/ReadOnlyModal').then((module) => module.ReadOnlyModal)
 );
+const CollateralChangeModal = dynamic(() =>
+  import('src/components/transactions/CollateralChange/CollateralChangeModal').then(
+    (module) => module.CollateralChangeModal
+  )
+);
 
 // Client-side cache, shared for the whole session of the user in the browser.
 const clientSideEmotionCache = createEmotionCache();
@@ -160,7 +161,7 @@ export default function MyApp(props: MyAppProps) {
                   <Web3ContextProvider>
                     <AppGlobalStyles>
                       <AddressBlocked>
-                        <CowOrderToastProvider>
+                        <SwapOrdersTrackingProvider>
                           <ModalContextProvider>
                             <SharedDependenciesProvider>
                               <AppDataProvider>
@@ -171,23 +172,25 @@ export default function MyApp(props: MyAppProps) {
                                   <BorrowModal />
                                   <RepayModal />
                                   <CollateralChangeModal />
-                                  <DebtSwitchModal />
                                   <ClaimRewardsModal />
                                   <EmodeModal />
                                   <FaucetModal />
                                   <TransactionEventHandler />
-                                  <SwitchModal />
-                                  <CollateralSwapModal />
                                   <StakingMigrateModal />
                                   <BridgeModal />
                                   <ReadOnlyModal />
-                                  <CowOrderToast />
+
+                                  {/* Swap Modals */}
+                                  <SwapModal />
+                                  <CollateralSwapModal />
+                                  <DebtSwapModal />
                                   <CancelCowOrderModal />
+                                  <CowOrderToast />
                                 </GasStationProvider>
                               </AppDataProvider>
                             </SharedDependenciesProvider>
                           </ModalContextProvider>
-                        </CowOrderToastProvider>
+                        </SwapOrdersTrackingProvider>
                       </AddressBlocked>
                     </AppGlobalStyles>
                   </Web3ContextProvider>

public/icons/tokens/tydroinkpoints.svg

@@ -78,7 +78,13 @@ type MarketLogoProps = {
 export const MarketLogo = ({ size, logo, testChainName, sx }: MarketLogoProps) => {
   return (
     <Box sx={{ mr: 2, width: size, height: size, position: 'relative', ...sx }}>
-      <img src={logo} alt="" width="100%" height="100%" />
+      <img
+        src={logo}
+        alt=""
+        width="100%"
+        height="100%"
+        style={{ display: 'block', objectFit: 'contain', objectPosition: 'center center' }}
+      />
 
       {testChainName && (
         <Tooltip title={testChainName} arrow>
@@ -351,6 +357,10 @@ export const MarketSwitcher = () => {
             value={selectedMarketVersion}
             exclusive
             onChange={(_, value) => {
+              if (value === SelectedMarketVersion.V2) {
+                window.open('https://v2-market.aave.com/', '_blank', 'noopener');
+                return;
+              }
               if (value !== null) {
                 setSelectedMarketVersion(value);
               }
@@ -372,6 +382,8 @@ export const MarketSwitcher = () => {
               value={SelectedMarketVersion.V3}
               data-cy={`markets_switch_button_v3`}
               sx={{
+                flex: '0 0 96px',
+                px: 1.5,
                 backgroundColor: theme.palette.mode === 'dark' ? '#EAEBEF' : '#383D51',
                 '&.Mui-selected, &.Mui-selected:hover': {
                   backgroundColor: theme.palette.mode === 'dark' ? '#292E41' : '#FFFFFF',
@@ -401,12 +413,16 @@ export const MarketSwitcher = () => {
               value={SelectedMarketVersion.V2}
               data-cy={`markets_switch_button_v2`}
               sx={{
+                flexGrow: 1.2,
+                flexBasis: 0,
+                px: 2,
                 backgroundColor: theme.palette.mode === 'dark' ? '#EAEBEF' : '#383D51',
                 '&.Mui-selected, &.Mui-selected:hover': {
                   backgroundColor: theme.palette.mode === 'dark' ? '#292E41' : '#FFFFFF',
                   boxShadow: '0px 1px 0px rgba(0, 0, 0, 0.05)',
                 },
                 borderRadius: '4px',
+                padding: 0,
               }}
             >
               <Typography
@@ -419,11 +435,17 @@ export const MarketSwitcher = () => {
                         color: 'transparent',
                       }
                     : {
+                        display: 'flex',
+                        flexDirection: 'row',
+                        alignItems: 'center',
                         color: theme.palette.mode === 'dark' ? '#0F121D' : '#FFFFFF',
                       }
                 }
               >
                 <Trans>Version 2</Trans>
+                <SvgIcon sx={{ ml: 1, fontSize: 14 }}>
+                  <ExternalLinkIcon />
+                </SvgIcon>
               </Typography>
             </StyledToggleButton>
           </StyledToggleButtonGroup>