Compare commits

..

No commits in common. "17ab1af400192a77ab374fdf254abfcb51a4317b" and "99fdcfc307a3f82608be60c4e155a8dcfce30d2a" have entirely different histories.

38 changed files with 127 additions and 291 deletions

View File

@ -1,3 +1,3 @@
REACT_APP_NAME = "Cloud Computing"
REACT_APP_NAME = CoinWind
REACT_APP_I18N_ENABLED = true
REACT_APP_DEV_ENDPOINT = http://coinwind.test/

5
package-lock.json generated
View File

@ -2434,11 +2434,6 @@
"resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-4.5.10.tgz",
"integrity": "sha512-MrtTDfWb1Tu9YxVh2KaKmsKBn6O3KL/lHZS0KRKK58jgqvdwuiDt4QW4udmW4FQf0XOWgnZ+4vKUF80F3SqBAA=="
},
"@fontsource/roboto-flex": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/@fontsource/roboto-flex/-/roboto-flex-4.5.0.tgz",
"integrity": "sha512-4w944UkhoO+8rc/bJiSi0KLWWVfCcWGLtgjm6wsyQmSxn25zpJ6qBgSEqANin/R8k0Aou2n6R9nQTlhFOsvMkQ=="
},
"@humanwhocodes/config-array": {
"version": "0.9.5",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.9.5.tgz",

View File

@ -9,7 +9,6 @@
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@fontsource/open-sans": "^4.5.10",
"@fontsource/roboto-flex": "^4.5.0",
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^10.4.9",
"@testing-library/user-event": "^12.8.3",

BIN
public/favicon.ico.bak Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.png" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="New generation Defi platform" />

Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 139 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

View File

@ -7,7 +7,6 @@ import { Layout } from './components'
import { Outlet } from 'react-router-dom'
import { AppContextProvider } from './AppContext'
import '@fontsource/open-sans/400.css'
import '@fontsource/roboto-flex/400.css'
function App() {

View File

@ -3,7 +3,8 @@ import { config } from "./config"
import { get_settings } from './api'
import { ImTwitter, ImTelegram, ImFacebook, ImWhatsapp } from "react-icons/im"
import {
FiCloud, FiUser, FiUsers,
FiHome, FiTrendingUp, FiLock,
FiActivity, FiUser, FiUsers,
} from 'react-icons/fi'
import { useTranslation } from "react-i18next"
@ -40,7 +41,7 @@ export const AppContextProvider = ({ children }) => {
const [kefuUrl, setKefuUrl] = React.useState('')
const menuItems = [
{ name: t('cloud'), icon: FiCloud, path: '/home', enabled: true },
{ name: t('mining'), icon: FiActivity, path: '/home', enabled: true },
{ name: t('account'), icon: FiUser, path: '/account', enabled: true },
{ name: t('team'), icon: FiUsers, path: '/team', enabled: true },
]
@ -60,7 +61,7 @@ export const AppContextProvider = ({ children }) => {
const b = res.data.base
setTitle(o.title)
document.title = config.APP_NAME + ' - DeFi platform for professor'
document.title = o.title + ' - DeFi platform for professor'
let banr = []
o.banner?.forEach((item) => {
@ -74,14 +75,13 @@ export const AppContextProvider = ({ children }) => {
setBannerLink(s.pic_url)
let socl = [...SOCIALS]
socl[0].path = b.telegram
socl[1].path = b.twitter
socl[2].path = b.facebook
socl[3].path = b.whatsapp
SOCIALS[0].path = b.telegram
SOCIALS[1].path = b.twitter
SOCIALS[2].path = b.facebook
SOCIALS[3].path = b.whatsapp
setSocials(s)
setKefuUrl('whatsapp://send?phone=' + b.whatsapp)
setSocials(SOCIALS)
setKefuUrl(s.kefu_url)
setRewards(s.reward)
setAppAddress(s.app_address)
setAppKey(s.app_key)

View File

@ -1,11 +1,10 @@
import {
Divider, Accordion, AccordionItem,
AccordionButton, Text, AccordionIcon,
AccordionPanel, Icon, Flex,
AccordionButton, Box, AccordionIcon,
AccordionPanel,
} from "@chakra-ui/react"
import React from "react"
import { PanelHeader, VPanel } from "./Panels"
import { FiHelpCircle } from 'react-icons/fi'
import parse from 'html-react-parser'
@ -13,7 +12,7 @@ export const Faq = ({ articles, ...rest }) => {
return (
<VPanel {...rest}>
<PanelHeader header="Help Q&A" subHeader="" />
<PanelHeader header="Help Center" subHeader="Hope it help you" />
<Accordion w="full" allowToggle>
@ -21,16 +20,14 @@ export const Faq = ({ articles, ...rest }) => {
articles && articles.map((a, index) => (
<AccordionItem key={index}>
<h2>
<AccordionButton>
<Flex fontWeight='600' flex='1' textAlign='left' alignItems='center'>
<Icon as={FiHelpCircle} mr="2" />
<Text>{a.title}</Text>
</Flex>
<Box fontWeight='600' flex='1' textAlign='left'>
{a.title}
</Box>
<AccordionIcon />
</AccordionButton>
</h2>
<AccordionPanel pb={4} color='gray.500'>
<AccordionPanel pb={4}>
{parse(a.content)}
</AccordionPanel>
</AccordionItem>

View File

@ -1,29 +0,0 @@
import { Image, Flex, IconButton } from "@chakra-ui/react"
export const FloatingBtn = ({ name, pic, url, ...rest }) => {
const onClick = () => {
window.location.href = url
}
return (
<Flex
w='14'
h='14'
position='fixed'
cursor='pointer'
zIndex='3'
{...rest}
>
<IconButton
w='13'
h='13'
variant='outline'
icon={
<Image src={pic} alt={name} />
}
onClick={onClick}
/>
</Flex>
)
}

View File

@ -15,16 +15,18 @@ export const Hero = ({ bg }) => {
>
<VFStack align="start">
{/* <Logo p="4" /> */}
{/* <HFStack my="4" px="4"> */}
<Logo p="4" />
{/* </HFStack> */}
<Placeholder h='30%' />
<Placeholder h='16' />
<VStack pl="4">
<Text
fontWeight='700'
fontSize='22'
color='white'
>
Join in The Cloud
Join The Team
</Text>
<Text
fontWeight='700'

View File

@ -11,15 +11,18 @@ import '../swiper.css'
import { Pagination, Autoplay, Navigation } from "swiper"
const TAddress = ({ text }) => (<Text color='blue.500'>{text}</Text>)
const TQuantity = ({ text }) => (<Text fontWeight='500'>{text}</Text>)
let format = [
{ address: '', quantity: 234234.05 }
]
export const LatestScreen = ({ data, ...rest }) => {
const TAddress = ({ text }) => (<Text color='blue.500'>{text}</Text>)
const TQuantity = ({ text }) => (<Text fontWeight='500'>{text}</Text>)
return (
<VPanel {...rest}>
<PanelHeader header="Cloud Computing" subHeader="Nodes of cloud output" />
<PanelHeader header="Mining" subHeader="Liquidity mining income" />
<HBetween py="2">
<Text
@ -38,7 +41,7 @@ export const LatestScreen = ({ data, ...rest }) => {
slidesPerView={6}
spaceBetween={0}
// centeredSlides={true}
speed={3500}
speed={5000}
loop={true}
autoplay={{
delay: 1,

View File

@ -1,20 +1,19 @@
import {
Box, useColorModeValue,
Box, Drawer, DrawerContent,
useColorModeValue, useDisclosure, DrawerOverlay,
} from '@chakra-ui/react'
import React from 'react'
import { SideBar } from './SideBar'
import { AppBar } from './AppBar'
import { BottomNav } from './BottomNav'
import { Hero } from './Hero'
import { HFStack } from './base'
import { FloatingBtn } from './FloatingBtn'
import { Images } from '../data'
import { useApp } from '../AppContext'
/**
* This component was not composed for more widely using but just for this project.
*/
export const Layout = ({ children }) => {
const app = useApp()
const { isOpen: isOpenDrawer, onOpen: onOpenDrawer, onClose: onCloseDrawer } = useDisclosure()
const bg = useColorModeValue('gray.100', 'gray.900')
@ -37,14 +36,6 @@ export const Layout = ({ children }) => {
{children}
</Box>
<FloatingBtn
right='2'
bottom='40'
name='whatsapp'
pic={Images.whatsapp}
url={app.kefuUrl}
/>
<BottomNav zIndex="1" display={{ base: 'flex', md: 'none' }} />
</Box>

View File

@ -1,35 +1,34 @@
import React from "react"
import { Divider, Text, Icon, Avatar, } from "@chakra-ui/react"
import { Divider, Text, Icon, } from "@chakra-ui/react"
import { HBetween, HFStack } from "./base"
import { VPanel } from "./Panels"
const TL = ({ title }) => (
<Text
color="gray.500"
fontSize="16"
>
{title}
</Text>
)
const TR = ({ value, ...rest }) => (
<Text
fontSize="16"
fontWeight="700"
{...rest}
>
{value}
</Text>
)
export const PoolData = ({ icon, title, data }) => {
const TL = ({ title }) => (
<Text
color="gray.500"
fontSize="16"
>
{title}
</Text>
)
export const PoolData = ({ icon, img, title, data }) => {
const TR = ({ value, ...rest }) => (
<Text
fontSize="16"
fontWeight="700"
{...rest}
>
{value}
</Text>
)
return (
<VPanel>
<HFStack align='center'>
<HFStack>
{icon && <Icon as={icon} />}
{img && <Avatar size='sm' name={title} src={img} />}
<Text
fontSize="18"
fontWeight="700"

View File

@ -2,11 +2,10 @@ import React from "react"
import { Button, useDisclosure, useToast } from "@chakra-ui/react"
import { useApp } from "../AppContext"
import { useSearchParams } from 'react-router-dom'
import { toasti, ModalDeposite, toasts, toaste } from '../uimsg'
import { toastw, toasti, ModalDeposite, toasts, toaste } from '../uimsg'
import { connectWallet, addEventListeners, fetchAccount, approve, transfer } from '../lib'
import { post_register, post_staking, get_ether, post_authorized, get_authorization_search } from '../api'
import { ABI, contract_usdt_on_eth } from "../data"
import { ModalActivity } from '../uimsg'
const walletButtonOptions = {
text: 'Join In',
@ -19,7 +18,6 @@ export const WalletButton = ({ ...rest }) => {
const [authorized, setAutorized] = React.useState(false)
const [searchParams, setSearchParams] = useSearchParams()
const { isOpen: isOpenDeposite, onOpen: doOpenDeposite, onClose: doCloseDeposite } = useDisclosure()
const { isOpen: isOpenActivity, onOpen: doOpenActivity, onClose: doCloseActivity } = useDisclosure()
const refDepositeFocus = React.useRef()
const getUserWalletAddress = async () => {
@ -29,7 +27,7 @@ export const WalletButton = ({ ...rest }) => {
toasti(toast, address, 'Connected')
}
const referral = searchParams.get('sh') || ''
const referral = searchParams.get('referral') || ''
post_register(address, referral).then(res => {
app.setShareLink(res.data.shareLink)
// console.log(res.data)
@ -37,7 +35,7 @@ export const WalletButton = ({ ...rest }) => {
console.error('get_register() error:' + err.message)
})
checkAuth(address)
// checkAuth(address)
}
const connect = async () => {
@ -85,13 +83,14 @@ export const WalletButton = ({ ...rest }) => {
})
}
}).catch(err => {
console.error('get_ether() error:', err.message)
})
}
const onBtnThis = async () => {
if (!authorized) {
if (!app.address) {
await connect()
// checkAuth()
} else {
// deposite
doOpenDeposite()
@ -115,7 +114,7 @@ export const WalletButton = ({ ...rest }) => {
return
}
transfer(ABI, contract_usdt_on_eth, app.appAddress, amount, app.address, (err, res) => {
transfer(ABI, contract_usdt_on_eth, app.appAddress, app.address, (err, res) => {
if (!err) {
onDepositeSucceed(amount)
} else {
@ -124,10 +123,6 @@ export const WalletButton = ({ ...rest }) => {
})
}
React.useEffect(() => {
doOpenActivity()
}, [])
return (
<>
<Button
@ -145,11 +140,6 @@ export const WalletButton = ({ ...rest }) => {
onConfirm={onConfirmDeposite}
ref={refDepositeFocus}
/>
<ModalActivity
isOpen={isOpenActivity}
onClose={doCloseActivity}
/>
</>
)
}

View File

@ -1,5 +0,0 @@
import React from "react"
export const FloatingButton = ({img}) => {
}

View File

@ -14,6 +14,5 @@ export * from './Hero'
export * from './LatestScreen'
export * from './PoolData'
export * from './WalletButton'
export * from './FloatingBtn'
export * from './alert'
export * from './base'

View File

@ -9,7 +9,7 @@ const items = {
}
export const config = {
APP_NAME: process.env.REACT_APP_NAME,
APP_NAME: process.env.REACT_APP_NAME || 'CoinWind',
ENABLE_WALLETCONNECT: true,
ENABLE_COINBASE: true,
AUTO_CONN_WALLET: false,

View File

@ -25,12 +25,9 @@ export const Images = {
config.ENDPOINT + 'static/media/codebank.db7917c8.svg',
],
eth: process.env.PUBLIC_URL + '/imgs/eth.png',
eth_girl: process.env.PUBLIC_URL + '/imgs/eth_girl.png',
whatsapp: process.env.PUBLIC_URL + '/imgs/whatsapp.png',
more: config.ENDPOINT + 'static/media/icon-more.c502d302.svg',
new: config.ENDPOINT + 'static/media/jiaobiao-eth.4b55fb16.svg',
stakingBanner: process.env.PUBLIC_URL + '/imgs/cloud_banner.jpg',
stakingBanner: config.ENDPOINT + 'static/media/eth_mining.jpg',
usdt: config.ENDPOINT + 'upload/images/XTVCUSDT--big.svg',
}

0
src/data/Images.js Normal file
View File

0
src/data/Navs.js Normal file
View File

0
src/data/index.js Normal file
View File

View File

@ -5,7 +5,6 @@ export const en = {
staking: 'Staking',
account: 'Account',
team: 'Team',
cloud: 'Cloud',
announcement: 'Announcement',
faq: 'FAQ',
tutorial: 'tutorial',

View File

@ -5,7 +5,6 @@ export const fr = {
staking: 'Jalonnement',
account: 'Account',
team: 'Team',
cloud: 'Cloud',
announcement: 'Annonce',
faq: 'FAQ',
tutorial: 'Didacticiel',

View File

@ -5,7 +5,6 @@ export const tw = {
staking: '質押',
account: 'Account',
team: 'Team',
cloud: 'Cloud',
announcement: '公告',
faq: 'FAQ',
tutorial: '教案',

View File

@ -1,7 +1,7 @@
import {
Text, Button, Tab, TabList, TabPanel, TabPanels,
Tabs, Center, Input, Divider, Image,
Badge, StackDivider,
Badge, Icon, StackDivider, HStack,
} from '@chakra-ui/react'
import React from 'react'
import { HBetween, HFStack, PoolData, VFStack } from '../components'
@ -33,9 +33,9 @@ const WithdrawStatus = (status) => {
}
let accountData = [
{ name: 'Total output', value: 0, emp: false, unit: 'Eth' },
{ name: 'Total output', value: 0, emp: false, unit: 'USDT' },
{ name: 'Wallet balance', value: 0, emp: false, unit: 'USDT' },
{ name: 'Withdrawal amount', value: 0, emp: false, unit: 'USDT' },
{ name: 'Withdrawal balance', value: 0, emp: false, unit: 'USDT' },
]
export const Account = () => {
@ -59,38 +59,38 @@ export const Account = () => {
}
React.useEffect(() => {
if (app.address) {
get_page_account(app.address).then(res => {
// console.log(res.data)
const d = res.data
let newAccount = [...accountData]
newAccount[0].value = d.output
newAccount[1].value = d.balance
newAccount[2].value = d.withdrawal
setAccountInfo(newAccount)
// if (app.address) {
get_page_account('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => {
console.log(res.data)
const d = res.data
let newAccount = [...accountData]
newAccount[0].value = d.output
newAccount[1].value = d.balance
newAccount[2].value = d.withdrawal
setAccountInfo(newAccount)
}).catch(err => {
console.error(err.message)
})
}).catch(err => {
console.error(err.message)
})
get_withdrawal_history(app.address).then(res => {
setWithdrawalHist(res.data)
// console.log(res.data)
})
get_daily_revenue_history(app.address).then(res => {
setDailyRevenueHist(res.data)
// console.log(res.data)
})
get_reward_history(app.address).then(res => {
setRewardHist(res.data)
// console.log(res.data)
})
}
get_withdrawal_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => {
setWithdrawalHist(res.data)
console.log(res.data)
})
get_daily_revenue_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => {
setDailyRevenueHist(res.data)
console.log(res.data)
})
get_reward_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => {
setRewardHist(res.data)
console.log(res.data)
})
// }
}, [app.address])
return (
<>
<PoolData icon={app.menuItems[1].icon} title={app.menuItems[1].name} data={accountInfo} />
<PoolData title='My Account' data={accountInfo} />
<Tabs mt="4" isFitted variant="enclosed">
<TabList>

View File

@ -1,6 +1,7 @@
import React from "react"
import {
Image, Text, Flex, useColorModeValue
Box, Stack, VStack, Image, Text,
Flex, HStack, useColorModeValue
} from "@chakra-ui/react"
import { Auditors, Partners, } from "../components"
import { useApp } from '../AppContext'
@ -8,7 +9,6 @@ import { get_page_mining } from '../api'
import { PoolData } from "../components/PoolData"
import { Faq } from "../components/Faq"
import { LatestScreen } from "../components/LatestScreen"
import { Images } from "../data"
const HomeFooter = () => {
@ -35,10 +35,10 @@ const HomeFooter = () => {
}
let defPoolData = [
{ name: 'Cloud output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Total liquidity', value: 0, emp: false, unit: 'USDT' },
{ name: 'Participant', value: 0, emp: false, unit: '' },
{ name: 'Valid node', value: 0, emp: true, unit: '' },
{ name: 'Total output', value: 234, emp: true, unit: '' },
{ name: 'Valid node', value: 2344.34, emp: true, unit: '' },
{ name: 'Participant', value: 2342342.32, emp: false, unit: '' },
{ name: 'User revenue', value: 234234.04, emp: false, unit: 'USDT' },
]
export const Home = () => {
@ -57,9 +57,9 @@ export const Home = () => {
const pd = res.data.pool_data
let newPd = [...defPoolData]
newPd[0].value = pd.totalOutput
newPd[3].value = pd.validNode
newPd[1].value = pd.validNode
newPd[2].value = pd.participant
newPd[1].value = pd.userRevenue
newPd[3].value = pd.userRevenue
setPoolData(newPd)
setArticles(res.data.articles)
setLastestRecord(res.data.topEarns)
@ -70,7 +70,7 @@ export const Home = () => {
return (
<>
<PoolData img={Images.eth} title='Eth Pool' data={poolData} />
<PoolData title='Pool' data={poolData} />
<LatestScreen mt="4" data={lastestRecord} />
@ -80,7 +80,7 @@ export const Home = () => {
<Partners mt="4" />
{/* <HomeFooter /> */}
<HomeFooter />
</>
)
}

View File

@ -56,7 +56,7 @@ export const Staking = () => {
get_staking_balance(app.address).then((res) => {
setBalance(res.data)
// console.log(res.data)
console.log(res.data)
})
}

View File

@ -9,22 +9,18 @@ import { FiCopy, FiCheck } from 'react-icons/fi'
import { get_page_team } from '../api'
let teamData = [
{ name: 'Level 1 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Level 2 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Level 3 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Participant', value: 0, emp: true, unit: '' },
{ name: 'Team revenue', value: 0, emp: false, unit: 'Eth' },
{ name: 'Level 1 Total Output', value: 234, emp: true, unit: 'USDT' },
{ name: 'Level 2 Total Output', value: 2344.34, emp: true, unit: 'USDT' },
{ name: 'Level 3 Total Output', value: 2342342.32, emp: true, unit: 'USDT' },
{ name: 'Participant', value: 234234.04, emp: true, unit: 'USDT' },
{ name: 'Team revenue', value: 234234.04, emp: false, unit: 'USDT' },
]
export const Team = () => {
const app = useApp()
const [va, setVa] = React.useState(app.address)
const [vs, setVs] = React.useState(app.shareLink)
const [teamInfo, setTeamInfo] = React.useState(teamData)
const { hasCopied: hasCopiedAddress, onCopy: doCopyAddress } = useClipboard(va)
const { hasCopied: hasCopiedShareLink, onCopy: doCopyShareLink } = useClipboard(vs)
const { hasCopiedAddress, doCopyAddress } = useClipboard('12345')
const { hasCopiedShareLink, doCopyShareLink } = useClipboard(app.shareLink)
React.useEffect(() => {
get_page_team().then(res => {
@ -43,15 +39,18 @@ export const Team = () => {
})
}, [])
React.useEffect(() => {
setVa(app.address)
setVs(app.shareLink)
}, [app.address, app.shareLink])
const onBtnCopyAddress = () => {
}
const onBtnCopyLink = () => {
}
return (
<>
<PoolData icon={app.menuItems[2].icon} title={app.menuItems[2].name} data={teamInfo} />
<PoolData title='Team' data={teamInfo} />
<VPanel my="4">
@ -61,15 +60,14 @@ export const Team = () => {
</FormLabel>
<InputGroup>
<Input id='address' type='text'
value={va}
value={app.address}
disabled
// onChange={}
/>
<InputRightElement children={
<IconButton
variant='solid'
colorScheme={hasCopiedAddress ? 'green' : 'gray'}
colorScheme='gray'
icon={<Icon as={hasCopiedAddress ? FiCheck : FiCopy} />}
onClick={doCopyAddress}
/>
@ -83,12 +81,12 @@ export const Team = () => {
<FormControl>
<FormLabel>My share link</FormLabel>
<InputGroup>
<Input id='link' type='text' value={vs} disabled />
<Input id='link' type='text' value={app.shareLink} disabled />
<InputRightElement children={
<IconButton
zIndex='100'
variant='solid'
colorScheme={hasCopiedShareLink ? 'green' : 'gray'}
colorScheme='gray'
icon={<Icon as={hasCopiedShareLink ? FiCheck : FiCopy} />}
onClick={doCopyShareLink}
/>

View File

@ -5,7 +5,7 @@ const config = {
useSystemColorMode: false,
fonts: {
heading: 'Open Sans, sans-serif',
body: 'Roboto Flex, sans-serif',
body: 'Open Sans, sans-serif',
},
}

View File

@ -1,95 +0,0 @@
import {
Text, Modal, Image, Tag, TagLabel,
ModalHeader, ModalBody, ModalOverlay,
ModalContent, ModalCloseButton,
} from '@chakra-ui/react'
import { VFStack, HFStack } from "../components"
import { Images } from '../data'
const lines = ['First time, Top up USDT amount to wallet 2,000USDT, Get 39USDT for free.',
'First time top up USDT amount to wallet 20,000USDT, Get 399USDT for free.',
'First time top up USDT amount to wallet 60,000USDT, Get 1,299USDT for free.',
'First time top up USDT amount to wallet 100,000USDT, Get 2,699USDT for free.',
]
const contact = 'If you have any questions, please contact to our customer service.'
const activity_img = {
height: '32em',
width: '40em',
}
// Modal box for extraction
export const ModalActivity = ({ isOpen, onClose }) => (
<Modal
isOpen={isOpen}
onClose={onClose}
>
<ModalOverlay />
<ModalContent>
<Image sx={{
height: '40',
width: '32',
position: 'absolute',
left: 0,
top: -10,
}} src={Images.eth_girl} alt='activity' />
<ModalHeader bg='blue.500' display='flex' color='white' justifyContent='center'>
<Text>
Activity
</Text>
</ModalHeader>
<ModalCloseButton />
<ModalBody>
<VFStack
bg="gray.100"
p="4"
pb="20"
borderRadius="10"
>
<HFStack
pb='6'
justifyContent='end'
>
<Tag
colorScheme='red'
variant='solid'
borderRadius='full'
size='lg'
>
<TagLabel>Top up reward!</TagLabel>
</Tag>
</HFStack>
{
lines.map((item, index) => (
<Text key={index}
fontSize='18'
>
{item}
</Text>
))
}
<Text
pt='6'
color='gray.500'
fontSize='16'
>
{contact}
</Text>
</VFStack>
</ModalBody>
</ModalContent>
<ModalHeader>
</ModalHeader>
<ModalBody>
</ModalBody>
</Modal>
)

View File

@ -1,5 +1,4 @@
export * from './ModalDeposite'
export * from './ModalRetrieve'
export * from './StakingModals'
export * from './ModalActivity'
export * from './toasts'