Skip to content

Commit

Permalink
Merge branch 'main' of https://github.com/paltalabs/defindex into fea…
Browse files Browse the repository at this point in the history 
…t/workflow
  • Loading branch information
@MattPoblete
MattPoblete committed Nov 4, 2024
2 parents 8d4ac72 + 181c5ac commit b5e9fb6
Show file tree
Hide file tree
Showing 28 changed files with 3,625 additions and 903 deletions.
15 changes: 6 additions & 9 deletions apps/dapp/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,8 @@
"test": "jest apps/dapp"
},
"dependencies": {
"@chakra-ui/icons": "^2.1.1",
"@chakra-ui/next-js": "^2.2.0",
"@chakra-ui/react": "^2.8.2",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
"@mui/material": "^5.16.4",
"@mui/x-charts": "^7.11.0",
"@chakra-ui/react": "^3.0.2",
"@emotion/react": "^11.13.3",
"@reduxjs/toolkit": "^2.2.6",
"@repo/ui": "*",
"@soroban-react/chains": "^9.1.13",
Expand All @@ -30,14 +25,16 @@
"@soroban-react/xbull": "^9.1.3",
"@stellar/stellar-sdk": "12.2.0",
"axios": "^1.7.7",
"framer-motion": "^11.3.0",
"next": "15.0.0-rc.0",
"next-themes": "^0.3.0",
"react": "19.0.0-rc-f994737d14-20240522",
"react-dom": "19.0.0-rc-f994737d14-20240522",
"react-icons": "^5.3.0",
"react-redux": "^9.1.2"
},
"devDependencies": {
"@jest/globals": "^29.7.0",
"@chakra-ui/cli": "^3.0.0",
"@repo/eslint-config": "*",
"@repo/typescript-config": "*",
"@testing-library/jest-dom": "6.1.5",
Expand All @@ -53,4 +50,4 @@
"ts-jest": "^29.2.5",
"typescript": "5.3.3"
}
}
}
109 changes: 57 additions & 52 deletions apps/dapp/src/components/DeployVault/AddNewStrategyButton.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,33 +1,36 @@
'use client'
import React from 'react'
import { useEffect, useState } from 'react'
import {
Button,
Modal,
ModalOverlay,
ModalContent,
ModalHeader,
ModalFooter,
ModalBody,
ModalCloseButton,
useDisclosure,
IconButton,
Select,
NativeSelectField,
} from '@chakra-ui/react'
import { AddIcon } from '@chakra-ui/icons'
import { MdAdd } from 'react-icons/md'
import {
DialogBackdrop,
DialogBody,
DialogContent,
DialogFooter,
DialogRoot,
DialogTrigger,
} from '@/components/ui/dialog'
import { useAppDispatch, useAppSelector } from '@/store/lib/storeHooks'
import { pushStrategy, getDefaultStrategies } from '@/store/lib/features/vaultStore'
import { useSorobanReact } from '@soroban-react/core'
import { Strategy } from '@/store/lib/features/walletStore'
import { NativeSelectRoot } from '../ui/native-select'

function AddNewStrategyButton() {
const [open, setOpen] = useState<boolean>(false)
const strategies = useAppSelector(state => state.newVault.strategies)
const dispatch = useAppDispatch();
const { activeChain } = useSorobanReact()
const [defaultStrategies, setDefaultStrategies] = useState<Strategy[]>([])
const [newStrategy, setNewStrategy] = useState<Strategy>()
const [newStrategy, setNewStrategy] = useState<Strategy>({ address: '', name: '', share: 0, index: '0' })
const [newAddress, setNewAddress] = useState<string>()
const [newName, setNewName] = useState<string>()
const [selectValue, setSelectValue] = useState<string>('')
const [selectValue, setSelectValue] = useState<string[]>([''])


useEffect(() => {
Expand All @@ -38,21 +41,18 @@ function AddNewStrategyButton() {
fetchStragegies()
}, [activeChain?.networkPassphrase])

const { isOpen, onOpen, onClose } = useDisclosure()
const handleOpenModal = () => {
isOpen ? onClose() : onOpen()
}

const resetForm = () => {
setNewStrategy({ address: '', name: '', share: 0, index: '0' })
setNewAddress('')
setNewName('')
setSelectValue('')
setSelectValue([''])
setOpen(false)
}

const handleInputSelect = async (e: any) => {
const value = e.target.value
setSelectValue(value)
await setSelectValue(value)
const isDefaultStrategy = await defaultStrategies.find(strategy => strategy.address === value)
if (!!isDefaultStrategy) {
setNewStrategy(isDefaultStrategy)
Expand All @@ -61,7 +61,7 @@ function AddNewStrategyButton() {

const addStrategy = async () => {
const isDefaultStrategy = await defaultStrategies.find(strategy => strategy.address === newStrategy?.address)
const hasEmptyFields = newStrategy?.address === '' || newStrategy?.name === '' || newName === '' || newAddress === ''
const hasEmptyFields = newStrategy?.address === '' || newStrategy?.name === ''
const strategyExists = strategies.find((strategy: Strategy) => strategy.address === newStrategy?.address)
if (strategyExists) {
console.error('Strategy already exists')
Expand All @@ -73,41 +73,46 @@ function AddNewStrategyButton() {
}
await dispatch(pushStrategy(newStrategy!))
resetForm()
isOpen ? onClose() : onOpen()
}
return (
<>
<Button colorScheme="green" size="md" onClick={handleOpenModal} textAlign={'end'} isDisabled={defaultStrategies.length === 0}>
Add new strategy
</Button>
<Modal isOpen={isOpen} onClose={onClose} isCentered>
<ModalOverlay backdropFilter='blur(5px)' />
<ModalContent >
<ModalHeader>Add new strategy</ModalHeader>
<ModalCloseButton />
<ModalBody>

<Select placeholder='Select option' onChange={handleInputSelect} value={selectValue}>
{defaultStrategies.map((strategy, index) => (
<option key={strategy.name} value={strategy.address}>{(strategy.name != '') ? strategy.name : strategy.address}</option>
))}
</Select>
</ModalBody>

<ModalFooter>
<Button variant='ghost' mr={3} onClick={onClose}>
Close
</Button>
<IconButton
aria-label='add_strategy'
colorScheme='green'
icon={<AddIcon />}
onClick={addStrategy}
/>
</ModalFooter>
</ModalContent>
</Modal>
</>
<DialogRoot open={open} onOpenChange={(e) => { setOpen(e.open) }} placement={'center'}>
<DialogBackdrop backdropFilter='blur(1px)' />
<DialogTrigger asChild>
<Button
size="md"
textAlign={'end'}
disabled={defaultStrategies.length === 0}>
Add new strategy
</Button>
</DialogTrigger>
<DialogContent>
<DialogBody>
<NativeSelectRoot>
<NativeSelectField
placeholder='Select a strategy'
onChange={(e) => { handleInputSelect(e) }}>
{defaultStrategies.map((strategy) => {
return (
<option key={strategy.address} value={strategy.address}>{strategy.name}</option>
)
})}
</NativeSelectField>
</NativeSelectRoot>
</DialogBody>
<DialogFooter>
<Button variant='ghost' mr={3} onClick={() => setOpen(false)}>
Close
</Button>
<IconButton
aria-label='add_strategy'
colorScheme='green'
onClick={addStrategy}
>
<MdAdd />
</IconButton>
</DialogFooter>
</DialogContent>
</DialogRoot>
)
}

Expand Down
66 changes: 32 additions & 34 deletions apps/dapp/src/components/DeployVault/ConfirmDelpoyModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,9 @@ import { useAppDispatch, useAppSelector } from "@/store/lib/storeHooks"
import {
Box,
Button,
CircularProgress,
Link,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
ProgressCircleRoot,
Text,
useSteps,
} from "@chakra-ui/react"
import {
Address,
Expand All @@ -26,12 +18,16 @@ import { useFactoryCallback, FactoryMethod } from '@/hooks/useFactory'
import { VaultPreview } from "./VaultPreview";
import { DeploySteps } from "./DeploySteps";
import { useEffect, useState } from "react";
import { WarningIcon, CheckCircleIcon, ExternalLinkIcon } from '@chakra-ui/icons'
import { PiWarningCircleFill } from "react-icons/pi";
import { FaCheckCircle } from "react-icons/fa";
import { NewVaultState } from "@/store/lib/features/vaultStore";
import { useSorobanReact } from "@soroban-react/core";

import { randomBytes } from "crypto";
import { StrategyMethod, useStrategyCallback } from "@/hooks/useStrategy";
import { LuExternalLink } from "react-icons/lu";
import { ProgressCircleRing } from "../ui/progress-circle";
import { DialogBody, DialogCloseTrigger, DialogFooter, DialogHeader, DialogTitle } from "../ui/dialog";

interface Status {
isSuccess: boolean,
Expand All @@ -50,9 +46,6 @@ export interface ChartData {
}

export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClose: () => void }) => {
const { goToNext, setActiveStep, activeStep } = useSteps({
index: 0
});
const sorobanContext = useSorobanReact();
const { activeChain } = sorobanContext;
const factory = useFactoryCallback();
Expand Down Expand Up @@ -172,7 +165,7 @@ export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClo
];


goToNext();
//goToNext();
let result: any;
try {
result = await factory(
Expand All @@ -183,7 +176,7 @@ export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClo
}
catch (e: any) {
console.error(e)
setActiveStep(3)
//setActiveStep(3)
setStatus({
...status,
hasError: true,
Expand All @@ -199,7 +192,7 @@ export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClo
address: parsedResult
}
dispatch(pushVault(tempVault));
setActiveStep(3);
//setActiveStep(3);
setStatus({
...status,
isSuccess: true,
Expand All @@ -218,7 +211,7 @@ export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClo
message: undefined,
txHash: undefined
});
setActiveStep(0);
//setActiveStep(0);
//await dispatch(resetStrategies())
onClose();
}
Expand Down Expand Up @@ -259,59 +252,64 @@ export const ConfirmDelpoyModal = ({ isOpen, onClose }: { isOpen: boolean, onClo
autoCloseModal();
}
}, [status.isSuccess, status.hasError])
const activeStep: number = 0;

//to-do Use chakra-ui stepper component
return (

<>
<Modal isOpen={isOpen} onClose={handleCloseModal} isCentered>
<ModalOverlay />
<ModalContent minW={'40vw'}>
<ModalHeader>Deploying {indexName === "" ? 'new index' : indexName}</ModalHeader>
<ModalCloseButton />
<ModalBody>
<DialogHeader>
<DialogTitle>
Deploying {indexName === "" ? 'new index' : indexName}
</DialogTitle>
</DialogHeader>
<DialogCloseTrigger />
<DialogBody>
<DeploySteps activeStep={activeStep} hasError={status.hasError} />
{activeStep == 0 && (
<VaultPreview data={chartData} />
)}
{activeStep == 1 && (
<Box textAlign={'center'}>
<Text mt={8}>Please, sign the transaction in your wallet.</Text>
<CircularProgress mt={8} isIndeterminate color='green.500' />
<ProgressCircleRoot>
<ProgressCircleRing />
</ProgressCircleRoot>
</Box>
)}
{(activeStep == 3 && status.hasError) && (
<Box mt={8} textAlign={'center'}>
<WarningIcon boxSize={'4em'} color={'red'} />
<PiWarningCircleFill />
<Text mt={4}>{`${status.message}`}</Text>
</Box>
)}
{(activeStep == 3 && status.isSuccess === true && status.txHash != undefined) && (
<>
<Box mt={8} textAlign={'center'}>
<CheckCircleIcon boxSize={'4em'} color={'green'} />
<FaCheckCircle />
<Text mt={4}>{`${status.message}`}</Text>
</Box>
<Box mt={8} textAlign={'center'}>
<Link mt={4} href={`https://stellar.expert/explorer/${activeChain?.name?.toLowerCase()}/tx/${status.txHash}`} isExternal>
View on explorer <ExternalLinkIcon mx='2px' />
<Link mt={4} href={`https://stellar.expert/explorer/${activeChain?.name?.toLowerCase()}/tx/${status.txHash}`}>
View on explorer <LuExternalLink />
</Link>
</Box>
</>
)}
</ModalBody>
</DialogBody>

<ModalFooter>
<DialogFooter>
{(activeStep == 0 && !status.hasError) && (
<Button
isDisabled={deployDisabled}
disabled={deployDisabled}
aria-label='add_strategy'
colorScheme='green'
onClick={deployDefindex}>
Deploy
</Button>
)}
</ModalFooter>
</ModalContent>
</Modal>
</DialogFooter>
</>

)
}
Loading

0 comments on commit b5e9fb6

Please sign in to comment.