54 lines
1.6 KiB
TypeScript
54 lines
1.6 KiB
TypeScript
|
import { useState } from 'react'
|
||
|
|
|
||
|
|
import { Image, Window, Button, Downloader } from './components'
|
||
|
|
import { fetchGameData } from './utils/fetchGameData'
|
||
|
|
import {
|
||
|
|
GameAssetsDownloader,
|
||
|
|
GameDataDownloader
|
||
|
|
} from './config/GameDownloader'
|
||
|
|
|
||
|
|
const Main: React.FC = () => {
|
||
|
|
const [error, setError] = useState('')
|
||
|
|
const [response, setResponse] = useState('')
|
||
|
|
const [loading, setLoading] = useState(false)
|
||
|
|
|
||
|
|
const callback = (message: string, error = false): void => {
|
||
|
|
if (error) return setError(message)
|
||
|
|
if (message === 'COMPLETED') setLoading(false)
|
||
|
|
else setResponse(message)
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Window>
|
||
|
|
<span className='mb-20 text-white'>I would like to:</span>
|
||
|
|
|
||
|
|
<ul className='flex gap-x-8'>
|
||
|
|
<Downloader content={GameDataDownloader}>
|
||
|
|
<Image src='/images/Gamedata.png' className='w-[400px]' />
|
||
|
|
|
||
|
|
<Button
|
||
|
|
value='Download Gamedata'
|
||
|
|
icon={<Image src='/icons/game.png' size={22} />}
|
||
|
|
className='download-button border-gamedata-secondary bg-gamedata-primary shadow-gamedata-primary/20'
|
||
|
|
handler={async () => {
|
||
|
|
return await fetchGameData('com', callback)
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Downloader>
|
||
|
|
|
||
|
|
<Downloader content={GameAssetsDownloader}>
|
||
|
|
<Image src='/images/GameAssets.png' className='w-[400px]' />
|
||
|
|
|
||
|
|
<Button
|
||
|
|
value='Download GameAssets'
|
||
|
|
icon={<Image src='/icons/picture.png' icon />}
|
||
|
|
className='download-button border-gameAssets-secondary bg-gameAssets-primary shadow-gameAssets-primary/40'
|
||
|
|
/>
|
||
|
|
</Downloader>
|
||
|
|
</ul>
|
||
|
|
</Window>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Main
|