61 lines
1.9 KiB
TypeScript
61 lines
1.9 KiB
TypeScript
import React, { useEffect, useState } from 'react';
|
|
import { Box, Button, Icon, Icons, Text, config, toRem } from 'folds';
|
|
import { Page, PageHero, PageHeroSection } from '../../components/page';
|
|
import PaarrotSVG from '../../../../public/res/svg/paarrot.svg';
|
|
import { getVersion } from '@tauri-apps/api/app';
|
|
|
|
export function WelcomePage() {
|
|
const [version, setVersion] = useState<string>('');
|
|
|
|
useEffect(() => {
|
|
getVersion().then(setVersion).catch(() => setVersion(''));
|
|
}, []);
|
|
return (
|
|
<Page>
|
|
<Box
|
|
grow="Yes"
|
|
style={{ padding: config.space.S400, paddingBottom: config.space.S700 }}
|
|
alignItems="Center"
|
|
justifyContent="Center"
|
|
>
|
|
<PageHeroSection>
|
|
<PageHero
|
|
icon={<img width="70" height="70" src={PaarrotSVG} alt="Paarrot Logo" />}
|
|
title="Welcome to Paarrot"
|
|
subTitle={
|
|
<span>
|
|
Squawk to yer mateys! {' '}
|
|
{version && (
|
|
<a
|
|
href="https://github.com/Paarrot/Paarrot-Desktop/releases/latest"
|
|
target="_blank"
|
|
rel="noreferrer noopener"
|
|
>
|
|
v{version}
|
|
</a>
|
|
)}
|
|
</span>
|
|
}
|
|
>
|
|
<Box justifyContent="Center">
|
|
<Box grow="Yes" style={{ maxWidth: toRem(300) }} direction="Column" gap="300">
|
|
<Button
|
|
as="a"
|
|
href="https://github.com/Paarrot/Paarrot-Desktop"
|
|
target="_blank"
|
|
rel="noreferrer noopener"
|
|
before={<Icon size="200" src={Icons.Code} />}
|
|
>
|
|
<Text as="span" size="B400" truncate>
|
|
Source Code
|
|
</Text>
|
|
</Button>
|
|
</Box>
|
|
</Box>
|
|
</PageHero>
|
|
</PageHeroSection>
|
|
</Box>
|
|
</Page>
|
|
);
|
|
}
|