Merge remote-tracking branch 'origin/adapt-with-new-asset-api' into k…

…yberai-filter-sort

.github/workflows/cypress.yml

@@ -116,7 +116,7 @@ jobs:
         run: |+
           #!/bin/bash
           yarn preview &
-          yarn test-e2e -e grepTags=smoke,NETWORK=Ethereum
+          yarn test-e2e -c baseUrl='http://127.0.0.1:4173/' -e grepTags=smoke,NETWORK=Ethereum
         env:
             DISPLAY: :0.0
 

.github/workflows/schedule.yml

@@ -2,7 +2,8 @@ name: 'E2E Testing Schedule'
 
 on:
   schedule:
-    - cron: '0 1,5 * * *' # run at 8AM and 12PM (GTM+7)
+    - cron: '*/20 1-12 * * *'
+    - cron: '0 13 * * *'
   workflow_dispatch:
 
 jobs:
@@ -49,12 +50,11 @@ jobs:
           echo ENV=${ENV} > .env
           echo GITHUB_RUN_ID=${GITHUB_RUN_ID} > .env
           echo CORE_PUSH_GATEWAY_URL=${{ secrets.CORE_PUSH_GATEWAY_URL }} > .env
-          echo CYPRESS_BASE_URL='https://kyberswap.com/' > .env
 
       - name: Run Cypress Test
         run: |+
           #!/bin/bash
-          yarn test-schedule -e grepTags=regression,NETWORK=${{ matrix.network }}
+          yarn test-schedule -c baseUrl='https://kyberswap.com/' -e grepTags=regression,NETWORK=${{ matrix.network }}
         env:
           DISPLAY: :0.0
 

cypress.config.ts

@@ -24,129 +24,125 @@ export default defineConfig({
       // eslint-disable-next-line @typescript-eslint/no-var-requires
       require('@cypress/grep/src/plugin')(config)
       synpressPlugins(on, config)
-      console.log('baseURL: ', process.env.CYPRESS_BASE_URL)
-      if (process.env.CYPRESS_BASE_URL === 'https://kyberswap.com/') {
-        on('after:run', async results => {
-          if (results) {
-            const register = new client.Registry()
-            const prefix = 'e2e_cypress'
-            const suite = new client.Counter({
-              name: `${prefix}_suite`,
-              help: `${prefix}_suite`,
-              labelNames: ['buildId', 'result', 'baseName', 'duration', 'chain'] as const,
-            })
-            suite.reset()
-            const { totalPassed, totalFailed, totalTests, totalDuration, runs } = results
-            runs.forEach(run => {
-              const { stats, spec } = run
-              const { tests, passes, pending, failures, duration } = stats
-              const { baseName } = spec
-              suite
-                .labels({
-                  buildId: `${process.env.GITHUB_RUN_ID}`,
-                  result: 'failed',
-                  baseName: baseName,
-                  duration: duration,
-                  chain: config.env.NETWORK,
-                })
-                .inc(failures)
-
-              suite
-                .labels({
-                  buildId: `${process.env.GITHUB_RUN_ID}`,
-                  result: 'passed',
-                  baseName: baseName,
-                  duration: duration,
-                  chain: config.env.NETWORK,
-                })
-                .inc(passes)
-
-              suite
-                .labels({
-                  buildId: `${process.env.GITHUB_RUN_ID}`,
-                  result: 'pending',
-                  baseName: baseName,
-                  duration: duration,
-                  chain: config.env.NETWORK,
-                })
-                .inc(pending)
-              suite
-                .labels({
-                  buildId: `${process.env.GITHUB_RUN_ID}`,
-                  result: 'tests',
-                  baseName: baseName,
-                  duration: duration,
-                  chain: config.env.NETWORK,
-                })
-                .inc(tests)
-            })
+      on('after:run', async results => {
+        if (results) {
+          const register = new client.Registry()
+          const prefix = 'e2e_cypress'
+          const suite = new client.Counter({
+            name: `${prefix}_suite`,
+            help: `${prefix}_suite`,
+            labelNames: ['buildId', 'result', 'baseName', 'duration', 'chain'] as const,
+          })
+          suite.reset()
+          const { totalPassed, totalFailed, totalTests, totalDuration, runs } = results
+          runs.forEach(run => {
+            const { stats, spec } = run
+            const { tests, passes, pending, failures, duration } = stats
+            const { baseName } = spec
+            suite
+              .labels({
+                buildId: `${process.env.GITHUB_RUN_ID}`,
+                result: 'failed',
+                baseName: baseName,
+                duration: duration,
+                chain: config.env.NETWORK,
+              })
+              .inc(failures)
 
             suite
               .labels({
                 buildId: `${process.env.GITHUB_RUN_ID}`,
                 result: 'passed',
-                baseName: 'All Specs',
-                duration: totalDuration,
+                baseName: baseName,
+                duration: duration,
                 chain: config.env.NETWORK,
               })
-              .inc(totalPassed)
+              .inc(passes)
 
             suite
               .labels({
                 buildId: `${process.env.GITHUB_RUN_ID}`,
-                result: 'failed',
-                baseName: 'All Specs',
-                duration: totalDuration,
+                result: 'pending',
+                baseName: baseName,
+                duration: duration,
                 chain: config.env.NETWORK,
               })
-              .inc(totalFailed)
+              .inc(pending)
             suite
               .labels({
                 buildId: `${process.env.GITHUB_RUN_ID}`,
-                result: 'total',
-                baseName: 'All Specs',
-                duration: totalDuration,
+                result: 'tests',
+                baseName: baseName,
+                duration: duration,
                 chain: config.env.NETWORK,
               })
-              .inc(totalTests)
+              .inc(tests)
+          })
 
-            const testPass = new client.Counter({
-              name: `${prefix}_test_passed`,
-              help: `${prefix}_pass`,
-              labelNames: ['buildId', 'chain'] as const,
+          suite
+            .labels({
+              buildId: `${process.env.GITHUB_RUN_ID}`,
+              result: 'passed',
+              baseName: 'All Specs',
+              duration: totalDuration,
+              chain: config.env.NETWORK,
             })
+            .inc(totalPassed)
 
-            const testFail = new client.Counter({
-              name: `${prefix}_test_failed`,
-              help: `${prefix}_fail`,
-              labelNames: ['buildId', 'chain'] as const,
+          suite
+            .labels({
+              buildId: `${process.env.GITHUB_RUN_ID}`,
+              result: 'failed',
+              baseName: 'All Specs',
+              duration: totalDuration,
+              chain: config.env.NETWORK,
+            })
+            .inc(totalFailed)
+          suite
+            .labels({
+              buildId: `${process.env.GITHUB_RUN_ID}`,
+              result: 'total',
+              baseName: 'All Specs',
+              duration: totalDuration,
+              chain: config.env.NETWORK,
             })
+            .inc(totalTests)
 
-            testPass.reset()
-            testFail.reset()
+          const testPass = new client.Counter({
+            name: `${prefix}_test_passed`,
+            help: `${prefix}_pass`,
+            labelNames: ['buildId', 'chain'] as const,
+          })
 
-            testFail.labels({ buildId: `${process.env.GITHUB_RUN_ID}`, chain: config.env.NETWORK }).inc(totalFailed)
-            testPass.labels({ buildId: `${process.env.GITHUB_RUN_ID}`, chain: config.env.NETWORK }).inc(totalPassed)
+          const testFail = new client.Counter({
+            name: `${prefix}_test_failed`,
+            help: `${prefix}_fail`,
+            labelNames: ['buildId', 'chain'] as const,
+          })
 
-            register.registerMetric(testPass)
-            register.registerMetric(testFail)
-            register.registerMetric(suite)
+          testPass.reset()
+          testFail.reset()
 
-            const gateway = new client.Pushgateway(`${process.env.CORE_PUSH_GATEWAY_URL}`, [], register)
-            await gateway
-              .push({ jobName: 'ui-automation' })
-              .then(({ resp, body }) => {
-                console.log(`Body: ${body}`)
-                console.log(`Response status: ${resp}`)
-              })
-              .catch((err: any) => {
-                console.log('err: ', err)
-              })
-          }
-        })
-      }
+          testFail.labels({ buildId: `${process.env.GITHUB_RUN_ID}`, chain: config.env.NETWORK }).inc(totalFailed)
+          testPass.labels({ buildId: `${process.env.GITHUB_RUN_ID}`, chain: config.env.NETWORK }).inc(totalPassed)
+
+          register.registerMetric(testPass)
+          register.registerMetric(testFail)
+          register.registerMetric(suite)
+
+          const gateway = new client.Pushgateway(`${process.env.CORE_PUSH_GATEWAY_URL}`, [], register)
+          await gateway
+            .push({ jobName: 'ui-automation' })
+            .then(({ resp, body }) => {
+              console.log(`Body: ${body}`)
+              console.log(`Response status: ${resp}`)
+            })
+            .catch((err: any) => {
+              console.log('err: ', err)
+            })
+        }
+      })
     },
-    baseUrl: process.env.CYPRESS_BASE_URL,
     specPattern: 'cypress/e2e/specs/*.e2e.cy.ts',
   },
 })

package.json

@@ -207,4 +207,4 @@
     "@lingui/core": "3.14.0",
     "@lingui/conf": "3.16.0"
   }
-}
+}

src/components/HorizontalScroll.tsx

@@ -1,4 +1,4 @@
-import { CSSProperties, ReactNode, useEffect, useRef } from 'react'
+import { CSSProperties, Fragment, ReactNode, useEffect, useRef } from 'react'
 import ScrollContainer from 'react-indiana-drag-scroll'
 import { Flex } from 'rebass'
 import styled from 'styled-components'
@@ -61,7 +61,9 @@ const HorizontalScroll = ({
     >
       <ScrollContainer innerRef={scrollRef} vertical={false} className="scroll-container" onScroll={handleShadow}>
         <TagContainer style={style} ref={contentRef}>
-          {(items ?? []).map(renderItem)}
+          {(items ?? []).map(i => (
+            <Fragment key={i}>{renderItem(i)}</Fragment>
+          ))}
         </TagContainer>
       </ScrollContainer>
     </ScrollContainerWithGradient>

src/components/KyberAITokenBanner/index.tsx

@@ -22,7 +22,7 @@ import useTheme from 'hooks/useTheme'
 import KyberScoreMeter from 'pages/TrueSightV2/components/KyberScoreMeter'
 import { NETWORK_TO_CHAINID } from 'pages/TrueSightV2/constants'
 import { SUPPORTED_NETWORK_KYBERAI } from 'pages/TrueSightV2/constants/index'
-import { useTokenDetailQuery } from 'pages/TrueSightV2/hooks/useKyberAIData'
+import { useTokenOverviewQuery } from 'pages/TrueSightV2/hooks/useKyberAIData'
 import { calculateValueToColor } from 'pages/TrueSightV2/utils'
 import { useIsWhiteListKyberAI } from 'state/user/hooks'
 import { MEDIA_WIDTHS } from 'theme'
@@ -47,17 +47,17 @@ const KyberAITokenBanner = ({
 
   const { isStableCoin } = useStableCoins(chainId)
 
-  const { data: tokenInputOverview } = useTokenDetailQuery(
+  const { data: tokenInputOverview } = useTokenOverviewQuery(
     { address: token0?.address, chain },
     { skip: !token0?.address || !account || !isWhiteList || !chain, refetchOnMountOrArgChange: true },
   )
 
-  const { data: tokenOutputOverview } = useTokenDetailQuery(
+  const { data: tokenOutputOverview } = useTokenOverviewQuery(
     { address: token1?.address, chain },
     { skip: !token1?.address || !account || !isWhiteList || !chain, refetchOnMountOrArgChange: true },
   )
 
-  const { data: tokenNativeOverview } = useTokenDetailQuery(
+  const { data: tokenNativeOverview } = useTokenOverviewQuery(
     { address: NativeCurrencies[chainId].wrapped.address, chain },
     { skip: !account || !isWhiteList || !chain, refetchOnMountOrArgChange: true },
   )

src/components/Modal/index.tsx

@@ -30,16 +30,14 @@ const StyledDialogContent = styled(
 ).attrs({
   'aria-label': 'dialog',
 })`
-  overflow-y: ${({ mobile }) => (mobile ? 'scroll' : 'hidden')};
-
   &[data-reach-dialog-content] {
     margin: ${({ margin }) => margin || '0 0 2rem 0'};
     background-color: ${({ theme, bgColor }) => bgColor || theme.tableHeader};
     box-shadow: 0 4px 8px 0 ${({ theme }) => transparentize(0.95, theme.shadow1)};
     padding: 0;
     width: ${({ width }) => width || '50vw'};
     height: ${({ height }) => height || 'auto'};
-    overflow-y: ${({ mobile }) => (mobile ? 'scroll' : 'hidden')};
+    overflow-y: scroll;
     overflow-x: hidden;
     align-self: ${({ mobile }) => (mobile ? 'flex-end' : 'center')};
     max-width: ${({ maxWidth }) => (maxWidth && !isNaN(maxWidth) ? `${maxWidth}px` : maxWidth)};

src/components/YieldPools/ElasticFarmGroup/FarmCard.tsx

@@ -17,6 +17,7 @@ import { Swap as SwapIcon } from 'components/Icons'
 import Harvest from 'components/Icons/Harvest'
 import InfoHelper from 'components/InfoHelper'
 import { MouseoverTooltip } from 'components/Tooltip'
+import { PartnerFarmTag } from 'components/YieldPools/PartnerFarmTag'
 import { APP_PATHS, ELASTIC_BASE_FEE_UNIT } from 'constants/index'
 import { TOBE_EXTENDED_FARMING_POOLS } from 'constants/v2'
 import { useActiveWeb3React } from 'hooks'
@@ -125,6 +126,7 @@ const FarmCard = ({
               </Link>
 
               <FeeTag style={{ fontSize: '12px' }}>FEE {(pool.pool.fee * 100) / ELASTIC_BASE_FEE_UNIT}%</FeeTag>
+              <PartnerFarmTag farmPoolAddress={pool.poolAddress} />
             </Flex>
 
             <Flex sx={{ gap: '4px' }}>

src/components/YieldPools/ElasticFarmGroup/PostionDetail.tsx

@@ -11,7 +11,7 @@ import PriceVisualize from 'components/ProAmm/PriceVisualize'
 import { MouseoverTooltipDesktopOnly } from 'components/Tooltip'
 import useIsTickAtLimit from 'hooks/useIsTickAtLimit'
 import useTheme from 'hooks/useTheme'
-import { useElasticFarms, useFarmAction } from 'state/farms/elastic/hooks'
+import { useFarmAction, useUserInfoByFarm } from 'state/farms/elastic/hooks'
 import { FarmingPool, NFTPosition } from 'state/farms/elastic/types'
 import { Bound } from 'state/mint/proamm/type'
 import { formatTickPrice } from 'utils/formatTickPrice'
@@ -42,8 +42,8 @@ const PositionDetail = ({
 }: Props) => {
   const theme = useTheme()
 
-  const { userFarmInfo } = useElasticFarms()
-  const joinedPositions = userFarmInfo?.[farmAddress]?.joinedPositions[pool.pid] || []
+  const userInfo = useUserInfoByFarm(farmAddress)
+  const joinedPositions = userInfo?.joinedPositions[pool.pid] || []
   const { unstake } = useFarmAction(farmAddress)
 
   const joinedInfo = joinedPositions.find(jp => jp.nftId.toString() === item.nftId.toString())
@@ -61,7 +61,7 @@ const PositionDetail = ({
   const priceLower = !isRevertPrice ? item.token0PriceLower : item.token0PriceUpper.invert()
   const priceUpper = !isRevertPrice ? item.token0PriceUpper : item.token0PriceLower.invert()
 
-  const rewardByNft = userFarmInfo?.[farmAddress]?.rewardByNft
+  const rewardByNft = userInfo?.rewardByNft
   const rewards = rewardByNft?.[pool.pid + '_' + item.nftId.toString()] || []
 
   const rewardValue = rewards.reduce(