feat: add mock point chips and mock vault types to the ui

DLC-link · Nov 6, 2024 · cced6d0 · cced6d0
1 parent 8dc4238
commit cced6d0
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 17 deletions.
diff --git a/public/images/logos/symbiotic-comp-logo.svg b/public/images/logos/symbiotic-comp-logo.svg
diff --git a/public/images/logos/uniswap-comp-logo.svg b/public/images/logos/uniswap-comp-logo.svg
diff --git a/...d-container.select-vault-type-stack/one-click-yield-container.select-vault-type-stack.tsx b/...d-container.select-vault-type-stack/one-click-yield-container.select-vault-type-stack.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, HStack, Text, VStack } from '@chakra-ui/react';
+import { Text, VStack } from '@chakra-ui/react';
 
 import { SelectVaultTypeStackLayout } from './one-click-yield-container.select-vault-type-stack.layout';
 import {
@@ -12,6 +12,16 @@ const mockVaultTypes: OneClickYieldVaultInformation[] = [
     vaultTypeLabel: 'Enzyme Curve Vault',
     vaultTypeLogoUrl: '/images/logos/enzyme-logo.svg',
   },
+  {
+    vaultType: 'symbiotic',
+    vaultTypeLabel: 'Symbiotic Vault',
+    vaultTypeLogoUrl: '/images/logos/symbiotic-comp-logo.svg',
+  },
+  {
+    vaultType: 'uniswap',
+    vaultTypeLabel: 'Uniswap Vault',
+    vaultTypeLogoUrl: '/images/logos/uniswap-comp-logo.svg',
+  },
 ];
 
 interface SelectVaultTypeStackProps {

diff --git a/...stack.vault-type-box/one-click-yield-container.select-vault-type-stack.vault-type-box.tsx b/...stack.vault-type-box/one-click-yield-container.select-vault-type-stack.vault-type-box.tsx
@@ -1,9 +1,30 @@
 import { InfoOutlineIcon } from '@chakra-ui/icons';
 import { Button, HStack, Image, Text, VStack } from '@chakra-ui/react';
 
-import { VaultTypeBoxPointChip } from './components/one-click-yield-container.select-vault-type-stack.vault-type-box.point-chip';
+import {
+  VaultTypeBoxPointChip,
+  VaultTypeBoxPointChipProps,
+} from './components/one-click-yield-container.select-vault-type-stack.vault-type-box.point-chip';
 import { VaultTypeBoxLayout } from './one-click-yield-container.select-vault-type-stack.vault-type-box.layout';
 
+const mockPointChips: VaultTypeBoxPointChipProps[] = [
+  {
+    bgColor: 'purple.01',
+    imgPath: '/images/deposit-img.png',
+    multiplier: 5,
+  },
+  {
+    bgColor: 'white.03',
+    imgPath: '/images/logos/symbiotic-logo.svg',
+    multiplier: 20,
+  },
+  {
+    bgColor: 'white.03',
+    imgPath: '/images/logos/mellow-logo.svg',
+    multiplier: 47,
+  },
+];
+
 export interface OneClickYieldVaultInformation {
   vaultType: string;
   vaultTypeLabel: string;
@@ -54,21 +75,14 @@ export function VaultTypeBox({
             Points
           </Text>
           <HStack>
-            <VaultTypeBoxPointChip
-              bgColor={'purple.01'}
-              imgPath={'/images/deposit-img.png'}
-              multiplier={5}
-            />
-            <VaultTypeBoxPointChip
-              bgColor={'white.03'}
-              imgPath={'/images/logos/symbiotic-logo.svg'}
-              multiplier={20}
-            />
-            <VaultTypeBoxPointChip
-              bgColor={'white.03'}
-              imgPath={'/images/logos/mellow-logo.svg'}
-              multiplier={47}
-            />
+            {mockPointChips.map(pointChip => (
+              <VaultTypeBoxPointChip
+                key={pointChip.multiplier}
+                bgColor={pointChip.bgColor}
+                imgPath={pointChip.imgPath}
+                multiplier={pointChip.multiplier}
+              />
+            ))}
           </HStack>
         </VStack>
       </HStack>