refactor: fix nextjs imports

apps/main/src/app/GlobalLayout.tsx

@@ -1,3 +1,4 @@
+import NextTopLoader from 'nextjs-toploader'
 import { type ReactNode } from 'react'
 import daoNetworks from '@/dao/networks'
 import { useDexAppStats, useDexRoutes } from '@/dex/hooks/useDexAppStats'
@@ -14,7 +15,6 @@ import { APP_LINK, AppMenuOption, type AppName } from '@ui-kit/shared/routes'
 import { SizesAndSpaces } from '@ui-kit/themes/design/1_sizes_spaces'
 import { Footer } from '@ui-kit/widgets/Footer'
 import { Header as Header } from '@ui-kit/widgets/Header'
-import NextTopLoader from 'nextjs-toploader'
 
 const { MinHeight } = SizesAndSpaces
 

apps/main/src/app/crvusd/client.tsx

@@ -1,13 +1,13 @@
 'use client'
 import '@/global-extensions'
-import { useParams } from 'next/navigation'
 import { type ReactNode, useEffect } from 'react'
 import type { CrvUsdServerData } from '@/app/api/crvusd/types'
 import { setAppStatsDailyVolume } from '@/loan/entities/appstats-daily-volume'
 import { networks, networksIdMapper } from '@/loan/networks'
 import useStore from '@/loan/store/useStore'
 import type { UrlParams } from '@/loan/types/loan.types'
 import { recordValues } from '@curvefi/prices-api/objects.util'
+import { useParams } from '@ui-kit/hooks/router'
 import { useHydration } from '@ui-kit/hooks/useHydration'
 import { useRedirectToEth } from '@ui-kit/hooks/useRedirectToEth'
 import { logSuccess } from '@ui-kit/lib'

apps/main/src/app/dao/layout.tsx

@@ -1,11 +1,11 @@
 'use client'
 import '@/global-extensions'
-import { useParams } from 'next/navigation'
 import { type ReactNode } from 'react'
 import networks, { networksIdMapper } from '@/dao/networks'
 import useStore from '@/dao/store/useStore'
 import { type UrlParams } from '@/dao/types/dao.types'
 import { useLayoutStore } from '@ui-kit/features/layout'
+import { useParams } from '@ui-kit/hooks/router'
 import { useHydration } from '@ui-kit/hooks/useHydration'
 import usePageVisibleInterval from '@ui-kit/hooks/usePageVisibleInterval'
 import { useRedirectToEth } from '@ui-kit/hooks/useRedirectToEth'

apps/main/src/app/dex/layout.tsx

@@ -1,6 +1,5 @@
 'use client'
 import '@/global-extensions'
-import { useParams } from 'next/navigation'
 import { type ReactNode, use, useCallback, useEffect, useState } from 'react'
 import curvejsApi from '@/dex/lib/curvejs'
 import { getNetworkDefs } from '@/dex/lib/networks'
@@ -11,6 +10,7 @@ import { recordValues } from '@curvefi/prices-api/objects.util'
 import type { NetworkDef } from '@ui/utils'
 import { useConnection } from '@ui-kit/features/connect-wallet'
 import { useLayoutStore } from '@ui-kit/features/layout'
+import { useParams } from '@ui-kit/hooks/router'
 import { useHydration } from '@ui-kit/hooks/useHydration'
 import usePageVisibleInterval from '@ui-kit/hooks/usePageVisibleInterval'
 import { useRedirectToEth } from '@ui-kit/hooks/useRedirectToEth'

apps/main/src/app/lend/layout.tsx

@@ -1,10 +1,10 @@
 'use client'
 import '@/global-extensions'
-import { useParams } from 'next/navigation'
 import { type ReactNode } from 'react'
 import networks, { networksIdMapper } from '@/lend/networks'
 import useStore from '@/lend/store/useStore'
 import type { UrlParams } from '@/lend/types/lend.types'
+import { useParams } from '@ui-kit/hooks/router'
 import { useHydration } from '@ui-kit/hooks/useHydration'
 import { useRedirectToEth } from '@ui-kit/hooks/useRedirectToEth'
 import { useGasInfoAndUpdateLib } from '@ui-kit/lib/model/entities/gas-info'

apps/main/src/dao/components/PageAnalytics/CrvStats/index.tsx

@@ -92,9 +92,7 @@ const CrvStats = () => {
             value={noProvider || !statsSuccess ? null : veCrvApr.current}
             valueOptions={{ unit: 'percentage', decimals: 2 }}
             notional={
-              Boolean(loading || veCrvFeesLoading || aprLoading)
-                ? undefined
-                : `${veCrvApr.fourDayAverage.toFixed(2)}% 4w avg`
+              loading || veCrvFeesLoading || aprLoading ? undefined : `${veCrvApr.fourDayAverage.toFixed(2)}% 4w avg`
             }
           />
         </MetricsContainer>

apps/main/src/dex/components/PagePool/index.tsx

@@ -93,12 +93,12 @@ const Transfer = (pageTransferProps: PageTransferProps) => {
 
   const { data: gaugeManager, isPending: isPendingGaugeManager } = useGaugeManager({
     chainId: rChainId,
-    poolId: poolData?.pool.id!,
+    poolId: poolData?.pool.id,
   })
 
   const { data: rewardDistributors, isPending: isPendingRewardsDistributors } = useGaugeRewardsDistributors({
     chainId: rChainId,
-    poolId: poolData?.pool.id!,
+    poolId: poolData?.pool.id,
   })
 
   const [selectedTab, setSelectedTab] = useState<DetailInfoTypes>('pool')

packages/curve-ui-kit/src/shared/icons/ArbitrageIcon.tsx

@@ -11,14 +11,14 @@ export const ArbitrageIcon = createSvgIcon(
     <path
       d="M21 9L21 14.625M21 9L23 11M21 9L19 11"
       stroke="currentcolor"
-      stroke-linecap="round"
-      stroke-linejoin="round"
+      strokeLinecap="round"
+      strokeLinejoin="round"
     />
     <path
       d="M27 14.625V9M27 14.625L25 12.625M27 14.625L29 12.625"
       stroke="currentcolor"
-      stroke-linecap="round"
-      stroke-linejoin="round"
+      strokeLinecap="round"
+      strokeLinejoin="round"
     />
     <path
       d="M24.0269 40.021C23.1934 40.021 22.4989 39.8866 21.9432 39.6177C21.3966 39.3489 20.9843 38.9769 20.7065 38.502C20.4287 38.018 20.2853 37.4624 20.2763 36.835H21.7685C21.7774 37.2473 21.8626 37.6102 22.0239 37.9239C22.1852 38.2286 22.4317 38.4661 22.7633 38.6364C23.1038 38.7977 23.5385 38.8784 24.0672 38.8784C24.7035 38.8784 25.2189 38.7529 25.6132 38.502C26.0165 38.2421 26.2181 37.8522 26.2181 37.3324C26.2181 37.0367 26.1733 36.7947 26.0837 36.6065C25.9941 36.4093 25.8552 36.2435 25.667 36.1091C25.4788 35.9747 25.2278 35.8626 24.9142 35.773C24.6005 35.6744 24.2151 35.5848 23.7581 35.5042C23.2472 35.4145 22.7902 35.3025 22.3869 35.1681C21.9836 35.0336 21.6385 34.8679 21.3517 34.6707C21.0739 34.4646 20.8588 34.2091 20.7065 33.9044C20.5631 33.5908 20.4914 33.2144 20.4914 32.7752C20.4914 32.2016 20.6303 31.7087 20.9081 31.2965C21.186 30.8753 21.5848 30.5526 22.1046 30.3286C22.6244 30.1045 23.2472 29.9925 23.9731 29.9925C24.6901 29.9925 25.304 30.1135 25.8148 30.3555C26.3257 30.5885 26.72 30.9201 26.9978 31.3503C27.2756 31.7715 27.419 32.2733 27.428 32.8559H25.9493C25.9403 32.4615 25.8462 32.1344 25.667 31.8745C25.4967 31.6146 25.2592 31.422 24.9545 31.2965C24.6587 31.171 24.3137 31.1083 23.9194 31.1083C23.5161 31.1083 23.171 31.171 22.8843 31.2965C22.6064 31.413 22.3869 31.5833 22.2255 31.8073C22.0732 32.0224 21.997 32.2823 21.997 32.587C21.997 32.9545 22.0777 33.2368 22.239 33.4339C22.4093 33.6221 22.6736 33.7745 23.0321 33.891C23.3996 33.9985 23.8835 34.1106 24.484 34.2271C24.9052 34.2988 25.3085 34.3929 25.6938 34.5094C26.0792 34.6169 26.4243 34.7738 26.729 34.9799C27.0337 35.186 27.2756 35.4683 27.4549 35.8268C27.6341 36.1763 27.7237 36.6334 27.7237 37.198C27.7237 37.7536 27.5848 38.2465 27.307 38.6767C27.0292 39.0979 26.6125 39.4295 26.0568 39.6715C25.5101 39.9045 24.8335 40.021 24.0269 40.021ZM23.5026 41.0427V28.9574H24.5109V41.0427H23.5026Z"

packages/curve-ui-kit/src/shared/icons/MarketTypeIcon.tsx

@@ -8,9 +8,9 @@ export const MarketTypeIcon = createSvgIcon(
       d="M5.84894 9.62004C5.47141 8.86499 4.3334 9.13363 4.3334 9.97781V44.8001C4.3334 45.2419 3.97523 45.6001 3.5334 45.6001C3.09157 45.6001 2.7334 45.2419 2.7334 44.8001V9.97781C2.7334 7.44528 6.14744 6.63933 7.28002 8.9045L22.0179 38.3802C22.3954 39.1352 23.5334 38.8666 23.5334 38.0224V9.97781C23.5334 7.44528 26.9474 6.63933 28.08 8.9045L45.8489 44.4423C46.0465 44.8375 45.8863 45.3181 45.4912 45.5156C45.096 45.7132 44.6154 45.5531 44.4179 45.1579L26.6489 9.62004C26.2714 8.86499 25.1334 9.13363 25.1334 9.97781V38.0224C25.1334 40.5549 21.7194 41.3609 20.5868 39.0957L5.84894 9.62004Z"
       fill="#1F1E1B"
       stroke="#1F1E1B"
-      stroke-width="0.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
+      strokeWidth="0.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
     />
   </svg>,
   'MarketType',

packages/curve-ui-kit/src/shared/icons/RebalancingIcon.tsx

@@ -10,7 +10,7 @@ export const RebalancingIcon = createSvgIcon(
       d="M37 20C37 20.5523 36.5523 21 36 21H14C13.4477 21 13 20.5523 13 20V10C13 9.44772 13.4477 9 14 9H36C36.5523 9 37 9.44772 37 10V20ZM20 12C18.3431 12 17 13.3431 17 15C17 16.6569 18.3431 18 20 18C21.6569 18 23 16.6569 23 15C23 13.3431 21.6569 12 20 12ZM30 12C28.3431 12 27 13.3431 27 15C27 16.6569 28.3431 18 30 18C31.6569 18 33 16.6569 33 15C33 13.3431 31.6569 12 30 12Z"
       fill="currentcolor"
     />
-    <path d="M5 42L45 42" stroke="currentcolor" stroke-linecap="round" />
+    <path d="M5 42L45 42" stroke="currentcolor" strokeLinecap="round" />
     <path
       d="M29 46C29 44.9391 28.5786 43.9217 27.8284 43.1716C27.0783 42.4214 26.0609 42 25 42C23.9391 42 22.9217 42.4214 22.1716 43.1716C21.4214 43.9217 21 44.9391 21 46L25 46H29Z"
       fill="currentcolor"

packages/curve-ui-kit/src/widgets/Header/MobileHeader.tsx

@@ -6,6 +6,7 @@ import Stack from '@mui/material/Stack'
 import Toolbar from '@mui/material/Toolbar'
 import { useLayoutStore } from '@ui-kit/features/layout'
 import { usePathname } from '@ui-kit/hooks/router'
+import { useBetaFlag } from '@ui-kit/hooks/useLocalStorage'
 import { t } from '@ui-kit/lib/i18n'
 import { APP_LINK, routeToPage } from '@ui-kit/shared/routes'
 import { GlobalBanner } from '@ui-kit/shared/ui/GlobalBanner'
@@ -17,7 +18,6 @@ import { SidebarSection } from './SidebarSection'
 import { SocialSidebarSection } from './SocialSidebarSection'
 import { HeaderImplementationProps } from './types'
 import { useMainNavRef } from './useMainNavRef'
-import { useBetaFlag } from '@ui-kit/hooks/useLocalStorage'
 
 const HIDE_SCROLLBAR = {
   // hide the scrollbar, on mobile it's not needed, and it messes up with the SideBarFooter

tests/tsconfig.json

@@ -5,6 +5,7 @@
     "baseUrl": "./cypress",
     "resolveJsonModule": true,
     "paths": {
+      "@/*": ["*"],
       "@ui": ["../../packages/ui/src/index.ts"],
       "@ui/*": ["../../packages/ui/src/*"],
       "@ui-kit/*": ["../../packages/curve-ui-kit/src/*"],

tests/vite.config.ts

@@ -7,6 +7,7 @@ export default defineConfig({
   plugins: [react(), tsconfigPaths()],
   resolve: {
     alias: [
+      { find: '@', replacement: resolve(__dirname, './cypress') },
       { find: '@ui', replacement: resolve(__dirname, '../packages/ui/src/') },
       { find: '@ui-kit', replacement: resolve(__dirname, '../packages/curve-ui-kit/src') },
       { find: '@external-rewards', replacement: resolve(__dirname, '../packages/external-rewards/src/index.ts') },