feat: ci pipelines

.github/workflows/ci.yml

@@ -1,15 +1,14 @@
 name: CI
 
-# CI temporarily disabled as we crunch the first commits and PRs of this repo to avoid spamming it.
-# on:
-  # push:
-    # branches:
-      # - main
-      # - develop
-  # pull_request:
-    # branches:
-      # - main
-      # - develop
+on:
+  push:
+    branches:
+      - main
+      - develop
+  pull_request:
+    branches:
+      - main
+      - develop
 
 jobs:
   install-and-cache:
@@ -23,6 +22,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v3
         with:
+          node-version: '18.20.4'
           node-version-file: '.nvmrc'
           cache: 'yarn'
 

.github/workflows/preview.yml

@@ -1,13 +1,12 @@
 name: Vercel Preview Deployment
 
-# CI temporarily disabled as we crunch the first commits and PRs of this repo to avoid spamming it.
-# on:
-  # push:
-    # branches:
-      # - develop
-  # pull_request:
-    # branches:
-      # - develop
+on:
+  push:
+    branches:
+      - develop
+  pull_request:
+    branches:
+      - develop
 
 concurrency:
   # don't allow multiple deployments at once
@@ -55,6 +54,8 @@ jobs:
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
+      - name: Install Vercel CLI
+        run: npm i vercel@latest -g
       - name: Cache
         uses: actions/cache@v3
         with:

.gitignore

@@ -23,3 +23,7 @@ dist-ssr
 *.sln
 *.sw?
 .vercel
+
+# Yarn build bs
+
+.yarn/install-state.gz

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

package.json

@@ -13,7 +13,7 @@
     "type-check": "yarn tsc --noEmit"
   },
   "dependencies": {
-    "@chakra-ui/react": "^2.8.2",
+    "@chakra-ui/react": "^2.10.3",
     "@emotion/react": "^11.11.3",
     "@emotion/styled": "^11.11.0",
     "@shapeshiftoss/caip": "^8.15.0",

src/components/AssetSelectModal/AssetSelectModal.tsx

@@ -18,7 +18,6 @@ import { isNft } from 'lib/utils'
 import type { Asset } from 'types/Asset'
 
 import { AssetList } from './AssetList'
-import type { ChainRow } from './ChainButton'
 import { ChainButton } from './ChainButton'
 import { filterAssetsBySearchTerm } from './helpers/filterAssetsBySearchTerm'
 
@@ -28,9 +27,15 @@ type AssetSelectModalProps = {
   onClick: (asset: Asset) => void
 }
 
+type NetworkItem = {
+  chainId: ChainId
+  icon: string
+  name: string
+}
+
 export const AssetSelectModal: React.FC<AssetSelectModalProps> = ({ isOpen, onClose, onClick }) => {
   const [searchQuery, setSearchQuery] = useState('')
-  const assets = useMemo(() => Object.values(AssetData), [])
+  const assets = useMemo(() => Object.values(AssetData) as Asset[], [])
   const [activeChain, setActiveChain] = useState<ChainId | 'All'>('All')
   const [searchTermAssets, setSearchTermAssets] = useState<Asset[]>([])
   const iniitalRef = useRef(null)
@@ -82,21 +87,24 @@ export const AssetSelectModal: React.FC<AssetSelectModalProps> = ({ isOpen, onCl
 
   const listAssets = searching ? searchTermAssets : filteredAssets
 
-  const uniqueChainIds: ChainRow[] = assets.reduce((accumulator, currentAsset: Asset) => {
-    const existingEntry = accumulator.find(
-      (entry: ChainRow) => entry.chainId === currentAsset.chainId,
-    )
-
-    if (!existingEntry) {
-      accumulator.push({
-        chainId: currentAsset.chainId,
-        icon: currentAsset.networkIcon ?? currentAsset.icon,
-        name: currentAsset.networkName ?? currentAsset.name,
-      })
-    }
+  const uniqueChainIds: NetworkItem[] = assets.reduce<NetworkItem[]>(
+    (accumulator, currentAsset) => {
+      const existingEntry = accumulator.find(
+        (entry: NetworkItem) => entry.chainId === currentAsset.chainId,
+      )
 
-    return accumulator
-  }, [])
+      if (!existingEntry) {
+        accumulator.push({
+          chainId: currentAsset.chainId,
+          icon: currentAsset.networkIcon || currentAsset.icon,
+          name: currentAsset.networkName || currentAsset.name,
+        })
+      }
+
+      return accumulator
+    },
+    [],
+  )
 
   const renderRows = useMemo(() => {
     return <AssetList assets={listAssets} handleClick={handleClick} />

src/hooks/useLocaleFormatter/useLocaleFormatter.ts

@@ -89,7 +89,7 @@ const getParts = (locale: string, fiatType = 'USD') => {
       style: 'currency',
       useGrouping: true,
     })
-    const parts = groupFormatter.formatToParts(1234567.1234567890123456789)
+    const parts = groupFormatter.formatToParts(1234567)
     const groups = parts.filter(p => p.type === 'integer')
 
     // @TODO: Do we want to support non-arabic numerals?

src/theme/components/Stepper.tsx

@@ -1,4 +1,4 @@
-import { keyframes } from '@chakra-ui/react'
+import { keyframes } from '@emotion/react'
 
 const throb = keyframes({
   '0%': {