feat: exchange (#11501)

DimensionDev · Mar 20, 2024 · 8ee90fe · 8ee90fe
1 parent 185bcfc
commit 8ee90fe
Show file tree

Hide file tree

Showing 152 changed files with 6,342 additions and 12,649 deletions.
diff --git a/cspell.json b/cspell.json
@@ -151,6 +151,7 @@
         "lensprotocol",
         "lenster",
         "lenstube",
+        "lifi",
         "linkify",
         "linkifyjs",
         "linkswap",
@@ -372,11 +373,11 @@
         "defi",
         "deletable",
         "devnet",
-        "dodoex",
         "drawed",
         "dsearch",
         "energi",
         "enjin",
+        "ethersproject",
         "ethjs",
         "fbclid",
         "frax",
@@ -437,6 +438,7 @@
         "redpackets",
         "rehype",
         "renfil",
+        "rpcs",
         "shapeclip",
         "simplehash",
         "splinecode",

diff --git a/package.json b/package.json
@@ -35,11 +35,11 @@
     "@emotion/serialize": "1.1.2",
     "@emotion/styled": "11.11.0",
     "@masknet/kit": "0.3.0",
-    "@mui/base": "5.0.0-alpha.100",
-    "@mui/icons-material": "5.10.6",
-    "@mui/lab": "5.0.0-alpha.102",
-    "@mui/material": "5.10.8",
-    "@mui/system": "5.10.8",
+    "@mui/base": "5.0.0-beta.38",
+    "@mui/icons-material": "5.15.12",
+    "@mui/lab": "5.0.0-alpha.167",
+    "@mui/material": "5.15.12",
+    "@mui/system": "5.15.12",
     "@tanstack/react-query": "^5.8.7",
     "@types/masknet__global-types": "workspace:^",
     "@types/react": "18.2.48",
@@ -96,10 +96,10 @@
       "cross-blob": "3.0.1",
       "i18next-translation-parser>html-parse-stringify2": "github:locize/html-parse-stringify2#d463109433b2c49c74a081044f54b2a6a1ccad7c",
       "web3@0.20.7>bignumber.js": "git+https://github.com/frozeman/bignumber.js-nolookahead.git#57692b3ecfc98bbdd6b3a516cb2353652ea49934",
-      "@mui/base": "5.0.0-alpha.100",
       "@protobufjs/inquire": "1.1.0",
       "reflect-metadata": "0.1.13",
-      "webpack@5": "Jack-Works/webpack#528c91e564d5756e21c9c462b607d913452af770"
+      "webpack@5": "Jack-Works/webpack#528c91e564d5756e21c9c462b607d913452af770",
+      "@tanstack/react-query": "^5.8.7"
     },
     "override comments": {
       "i18next-translation-parser": "see https://github.com/i18next/i18next-translation-parser/issues/11 we manually pin the commit"
@@ -124,10 +124,8 @@
       }
     },
     "patchedDependencies": {
-      "@uniswap/v3-sdk@3.9.0": "patches/@uniswap__v3-sdk@3.9.0.patch",
       "@ceramicnetwork/rpc-transport@0.3.1": "patches/@ceramicnetwork__rpc-transport@0.3.1.patch",
       "gulp@4.0.2": "patches/gulp@4.0.2.patch",
-      "@mui/base@5.0.0-alpha.100": "patches/@mui__base@5.0.0-alpha.100.patch",
       "micromark@3.1.0": "patches/micromark@3.1.0.patch",
       "micromark-util-symbol@1.0.1": "patches/micromark-util-symbol@1.0.1.patch",
       "@types/react-avatar-editor@13.0.0": "patches/@types__react-avatar-editor@13.0.0.patch",
@@ -146,7 +144,10 @@
       "web3-core@1.10.2": "patches/web3-core@1.10.2.patch",
       "react-devtools-inline@4.28.5": "patches/react-devtools-inline@4.28.5.patch",
       "@tanstack/query-async-storage-persister@5.8.7": "patches/@tanstack__query-async-storage-persister@5.8.7.patch",
-      "eslint-plugin-i@2.29.1": "patches/eslint-plugin-i@2.29.1.patch"
+      "eslint-plugin-i@2.29.1": "patches/eslint-plugin-i@2.29.1.patch",
+      "@mui/material@5.15.12": "patches/@mui__material@5.15.12.patch",
+      "@lifi/widget@2.10.1": "patches/@lifi__widget@2.10.1.patch",
+      "@mui/base@5.0.0-beta.38": "patches/@mui__base@5.0.0-beta.38.patch"
     }
   }
 }
diff --git a/packages/mask/.webpack/config.ts b/packages/mask/.webpack/config.ts
@@ -152,6 +152,11 @@ export async function createConfiguration(_inputFlags: BuildFlags): Promise<webp
                         },
                     },
                 },
+                {
+                    test: /\.svg$/,
+                    include: /node_modules[\\/]@lifi[\\/]wallet-management/, // Only effective for @lifi/wallet-management
+                    loader: require.resolve('file-loader'),
+                },
                 // compress svg files
                 flags.mode === 'production' ?
                     {
@@ -163,15 +168,8 @@ export async function createConfiguration(_inputFlags: BuildFlags): Promise<webp
                                 pretty: false,
                             },
                         },
-                        dependency(data) {
-                            if (data === '') return false
-                            if (data !== 'url')
-                                throw new TypeError(
-                                    'The only import mode valid for a non-JS file is via new URL(). Current import mode: ' +
-                                        data,
-                                )
-                            return true
-                        },
+                        exclude: /node_modules/,
+                        dependency: 'url',
                         type: 'asset/resource',
                     }
                 :   null,

diff --git a/packages/mask/content-script/site-adaptors/twitter.com/injection/ProfileCard/index.tsx b/packages/mask/content-script/site-adaptors/twitter.com/injection/ProfileCard/index.tsx
@@ -66,7 +66,6 @@ function ProfileCardHolder() {
     return (
         <Fade in={active} easing="linear" timeout={250}>
             <ShadowRootPopper
-                placeholder={undefined}
                 open={!!anchorEl}
                 anchorEl={anchorEl}
                 keepMounted

diff --git a/packages/mask/package.json b/packages/mask/package.json
@@ -117,6 +117,7 @@
     "date-fns": "^2.30.0",
     "elliptic": "^6.5.4",
     "event-iterator": "^2.0.0",
+    "file-loader": "^6.2.0",
     "guess-calling-code": "^1.1.8",
     "html-to-image": "^1.11.11",
     "https-browserify": "^1.0.0",

diff --git a/packages/mask/popups/pages/Swap/SwapBox/index.tsx b/packages/mask/popups/pages/Swap/SwapBox/index.tsx
diff --git a/packages/mask/popups/pages/Swap/index.tsx b/packages/mask/popups/pages/Swap/index.tsx
@@ -1,4 +1,4 @@
-import { AllProviderTradeContext, languages } from '@masknet/plugin-trader'
+import { languages } from '@masknet/plugin-trader'
 import { Appearance } from '@masknet/public-api'
 import { SharedContextProvider, SwapPageModals } from '@masknet/shared'
 import { applyMaskColorVars, makeStyles } from '@masknet/theme'
@@ -7,7 +7,6 @@ import { Typography } from '@mui/material'
 import { useMaskSharedTrans } from '../../../shared-ui/index.js'
 import { NetworkSelector } from '../../components/NetworkSelector/index.js'
 import { useTokenParams } from '../../hooks/index.js'
-import { SwapBox } from './SwapBox/index.js'
 import { NetworkPluginID, PluginID, createI18NBundle, i18NextInstance } from '@masknet/shared-base'
 import { useCallback } from 'react'
 
@@ -84,11 +83,7 @@ export default function SwapPage() {
                             <NetworkSelector />
                         </header>
                         <main className={classes.main}>
-                            <EVMWeb3ContextProvider chainId={chainId} networkType={network?.type}>
-                                <AllProviderTradeContext.Provider>
-                                    <SwapBox />
-                                </AllProviderTradeContext.Provider>
-                            </EVMWeb3ContextProvider>
+                            <EVMWeb3ContextProvider chainId={chainId} networkType={network?.type} />
                         </main>
                     </div>
                 </div>

diff --git a/packages/mask/popups/pages/Wallet/components/WalletAssets/index.tsx b/packages/mask/popups/pages/Wallet/components/WalletAssets/index.tsx
@@ -124,7 +124,7 @@ const WalletAssetsUI = memo<WalletAssetsUIProps>(function WalletAssetsUI({ onAdd
         <div className={classes.content}>
             <TabContext value={currentTab}>
                 <Box className={classes.header}>
-                    <StyledTabList value={currentTab} onChange={handleTabChange}>
+                    <StyledTabList onChange={handleTabChange}>
                         <Tab
                             className={classes.tab}
                             label={t.popups_wallet_tab_assets()}

diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json
@@ -492,7 +492,7 @@
     "plugin_savings_process_deposit": "Processing Deposit",
     "plugin_savings_process_withdraw": "Processing Withdrawal",
     "plugin_savings_no_protocol": "No deposit protocols found.",
-    "plugin_trader_swap": "Swap",
+    "plugin_trader_swap": "Exchange",
     "plugin_trader_wrap": "Wrap",
     "plugin_trader_swap_from": "You sell",
     "plugin_trader_swap_receive": "You buy",

diff --git a/packages/plugins/FileService/src/SiteAdaptor/components/FileBrowser.tsx b/packages/plugins/FileService/src/SiteAdaptor/components/FileBrowser.tsx
@@ -2,7 +2,7 @@ import { Icons } from '@masknet/icons'
 import { getEnumAsArray } from '@masknet/kit'
 import { EMPTY_LIST } from '@masknet/shared-base'
 import { makeStyles, MaskTextField } from '@masknet/theme'
-import { TabsUnstyled, TabUnstyled, tabUnstyledClasses } from '@mui/base'
+import { Tabs as TabsUnstyled, Tab as TabUnstyled, tabClasses as tabUnstyledClasses } from '@mui/base'
 import { Button, styled, Typography } from '@mui/material'
 import { useMemo, useState } from 'react'
 import { useNavigate, useSearchParams } from 'react-router-dom'

diff --git a/packages/plugins/Gitcoin/src/SiteAdaptor/modals/DonateModal/DonateDialog.tsx b/packages/plugins/Gitcoin/src/SiteAdaptor/modals/DonateModal/DonateDialog.tsx
@@ -214,6 +214,7 @@ export const DonateDialog = memo(({ grant, ...rest }: DonateDialogProps) => {
                             </ShadowRootTooltip>
                         </Typography>
                         <GiveBackSelect
+                            variant="filled"
                             value={giveBack}
                             className={classes.giveBackSelect}
                             onChange={(e) => {

diff --git a/packages/plugins/Gitcoin/src/SiteAdaptor/modals/DonateModal/GiveBackSelect.tsx b/packages/plugins/Gitcoin/src/SiteAdaptor/modals/DonateModal/GiveBackSelect.tsx
@@ -1,10 +1,8 @@
 import { memo } from 'react'
 import { MenuItem, Select, type SelectProps } from '@mui/material'
 
-interface Props extends SelectProps<number> {}
-
 const OPTIONS = [0, 0.05, 0.1, 0.15]
-export const GiveBackSelect = memo((props: Props) => {
+export const GiveBackSelect = memo((props: SelectProps<number>) => {
     return (
         <Select
             {...props}

diff --git a/packages/plugins/Savings/src/SiteAdaptor/SavingsDialog.tsx b/packages/plugins/Savings/src/SiteAdaptor/SavingsDialog.tsx
@@ -15,7 +15,6 @@ import { EMPTY_LIST, NetworkPluginID } from '@masknet/shared-base'
 import { makeStyles, MaskTabList, useTabs } from '@masknet/theme'
 import { ChainId, getAaveConstant } from '@masknet/web3-shared-evm'
 import { InjectedDialog, PluginWalletStatusBar, NetworkTab } from '@masknet/shared'
-import { AllProviderTradeContext } from '@masknet/plugin-trader'
 import { EVMContract } from '@masknet/web3-providers'
 import type { AaveProtocolDataProvider } from '@masknet/web3-contracts/types/AaveProtocolDataProvider.js'
 import AaveProtocolDataProviderABI from '@masknet/web3-contracts/abis/AaveProtocolDataProvider.json'
@@ -119,68 +118,66 @@ export function SavingsDialog({ open, onClose }: SavingsDialogProps) {
 
     return (
         <Web3ContextProvider network={NetworkPluginID.PLUGIN_EVM} chainId={ChainId.Mainnet}>
-            <AllProviderTradeContext.Provider>
-                <ChainContextProvider chainId={chainId}>
-                    <TabContext value={currentTab}>
-                        <InjectedDialog
-                            open={open}
-                            classes={{ paper: classes.dialogRoot }}
-                            title={t.plugin_savings()}
-                            onClose={() => {
-                                onClose?.()
-                                setSelectedProtocol(null)
-                            }}
-                            titleTabs={
-                                <MaskTabList variant="base" onChange={onChange} aria-label="Savings">
-                                    <Tab label={t.plugin_savings_deposit()} value={tabs.deposit} />
-                                    <Tab label={t.plugin_savings_withdraw()} value={tabs.withdraw} />
-                                </MaskTabList>
-                            }>
-                            <DialogContent className={classes.content}>
-                                <div className={classes.abstractTabWrapper}>
-                                    <NetworkTab
-                                        requireChains
-                                        chains={chains.filter(Boolean)}
-                                        pluginID={NetworkPluginID.PLUGIN_EVM}
+            <ChainContextProvider chainId={chainId}>
+                <TabContext value={currentTab}>
+                    <InjectedDialog
+                        open={open}
+                        classes={{ paper: classes.dialogRoot }}
+                        title={t.plugin_savings()}
+                        onClose={() => {
+                            onClose?.()
+                            setSelectedProtocol(null)
+                        }}
+                        titleTabs={
+                            <MaskTabList variant="base" onChange={onChange} aria-label="Savings">
+                                <Tab label={t.plugin_savings_deposit()} value={tabs.deposit} />
+                                <Tab label={t.plugin_savings_withdraw()} value={tabs.withdraw} />
+                            </MaskTabList>
+                        }>
+                        <DialogContent className={classes.content}>
+                            <div className={classes.abstractTabWrapper}>
+                                <NetworkTab
+                                    requireChains
+                                    chains={chains.filter(Boolean)}
+                                    pluginID={NetworkPluginID.PLUGIN_EVM}
+                                />
+                            </div>
+                            <div className={classes.tableTabWrapper}>
+                                <TabPanel style={{ padding: '8px 0 0 0' }} value={tabs.deposit}>
+                                    <SavingsTable
+                                        loadingProtocols={loadingProtocols}
+                                        tab={TabType.Deposit}
+                                        protocols={protocols}
+                                        setSelectedProtocol={setSelectedProtocol}
                                     />
-                                </div>
-                                <div className={classes.tableTabWrapper}>
-                                    <TabPanel style={{ padding: '8px 0 0 0' }} value={tabs.deposit}>
-                                        <SavingsTable
-                                            loadingProtocols={loadingProtocols}
-                                            tab={TabType.Deposit}
-                                            protocols={protocols}
-                                            setSelectedProtocol={setSelectedProtocol}
-                                        />
-                                    </TabPanel>
-                                    <TabPanel style={{ padding: '8px 0 0 0' }} value={tabs.withdraw}>
-                                        <SavingsTable
-                                            loadingProtocols={loadingProtocols}
-                                            tab={TabType.Withdraw}
-                                            protocols={protocols}
-                                            setSelectedProtocol={setSelectedProtocol}
-                                        />
-                                    </TabPanel>
-                                </div>
-                            </DialogContent>
+                                </TabPanel>
+                                <TabPanel style={{ padding: '8px 0 0 0' }} value={tabs.withdraw}>
+                                    <SavingsTable
+                                        loadingProtocols={loadingProtocols}
+                                        tab={TabType.Withdraw}
+                                        protocols={protocols}
+                                        setSelectedProtocol={setSelectedProtocol}
+                                    />
+                                </TabPanel>
+                            </div>
+                        </DialogContent>
 
-                            <DialogActions style={{ padding: 0, position: 'sticky', bottom: 0 }}>
-                                <PluginWalletStatusBar />
-                            </DialogActions>
-                        </InjectedDialog>
-                    </TabContext>
-                </ChainContextProvider>
-                {selectedProtocol ?
-                    <RevokeChainContextProvider>
-                        <SavingsFormDialog
-                            tab={currentTab}
-                            chainId={chainId}
-                            protocol={selectedProtocol}
-                            onClose={() => setSelectedProtocol(null)}
-                        />
-                    </RevokeChainContextProvider>
-                :   null}
-            </AllProviderTradeContext.Provider>
+                        <DialogActions style={{ padding: 0, position: 'sticky', bottom: 0 }}>
+                            <PluginWalletStatusBar />
+                        </DialogActions>
+                    </InjectedDialog>
+                </TabContext>
+            </ChainContextProvider>
+            {selectedProtocol ?
+                <RevokeChainContextProvider>
+                    <SavingsFormDialog
+                        tab={currentTab}
+                        chainId={chainId}
+                        protocol={selectedProtocol}
+                        onClose={() => setSelectedProtocol(null)}
+                    />
+                </RevokeChainContextProvider>
+            :   null}
         </Web3ContextProvider>
     )
 }