vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-09 20:29:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add animated page

Browse Source
This commit is contained in:
jeffvli
2022-10-30 20:19:11 -07:00
parent eb73c87933
commit bc9e6a9a73
2 changed files with 19 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/features/action-required/routes/action-required-route.tsx
+4 -4
View File
@@ -9,7 +9,7 @@ import { MpvRequired } from '@/renderer/features/action-required/components/mpv-
import { ServerCredentialRequired } from '@/renderer/features/action-required/components/server-credential-required'; import { ServerCredentialRequired } from '@/renderer/features/action-required/components/server-credential-required';
import { ServerRequired } from '@/renderer/features/action-required/components/server-required'; import { ServerRequired } from '@/renderer/features/action-required/components/server-required';
import { settings } from '@/renderer/features/settings'; import { settings } from '@/renderer/features/settings';
import { useServerCredential } from '@/renderer/features/shared'; import { AnimatedPage, useServerCredential } from '@/renderer/features/shared';
import { AppRoute } from '@/renderer/router/routes'; import { AppRoute } from '@/renderer/router/routes';
import { useAuthStore } from '@/renderer/store'; import { useAuthStore } from '@/renderer/store';
@@ -52,8 +52,8 @@ export const ActionRequiredRoute = () => {
const displayedCheck = checks.find((c) => !c.valid); const displayedCheck = checks.find((c) => !c.valid);
return ( return (
<> <AnimatedPage>
<Center sx={{ width: '100vw' }}> <Center sx={{ height: '100%', width: '100vw' }}>
<Stack spacing="xl" sx={{ maxWidth: '50%' }}> <Stack spacing="xl" sx={{ maxWidth: '50%' }}>
<Group noWrap> <Group noWrap>
{displayedCheck && ( {displayedCheck && (
@@ -82,6 +82,6 @@ export const ActionRequiredRoute = () => {
</Stack> </Stack>
</Stack> </Stack>
</Center> </Center>
</> </AnimatedPage>
); );
}; };
src/renderer/features/action-required/routes/invalid-route.tsx
+15 -12
View File
@@ -2,23 +2,26 @@ import { Center, Group, Stack } from '@mantine/core';
import { RiQuestionLine } from 'react-icons/ri'; import { RiQuestionLine } from 'react-icons/ri';
import { useLocation, useNavigate } from 'react-router-dom'; import { useLocation, useNavigate } from 'react-router-dom';
import { Button, Text } from '@/renderer/components'; import { Button, Text } from '@/renderer/components';
import { AnimatedPage } from '@/renderer/features/shared';
export const InvalidRoute = () => { export const InvalidRoute = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const location = useLocation(); const location = useLocation();
return ( return (
<Center sx={{ width: '100%' }}> <AnimatedPage>
<Stack> <Center sx={{ height: '100%', width: '100%' }}>
<Group noWrap position="center"> <Stack>
<RiQuestionLine color="var(--warning-color)" size={30} /> <Group noWrap position="center">
<Text size="xl">Page not found</Text> <RiQuestionLine color="var(--warning-color)" size={30} />
</Group> <Text size="xl">Page not found</Text>
<Text>{location.pathname}</Text> </Group>
<Button variant="filled" onClick={() => navigate(-1)}> <Text>{location.pathname}</Text>
Go back <Button variant="filled" onClick={() => navigate(-1)}>
</Button> Go back
</Stack> </Button>
</Center> </Stack>
</Center>
</AnimatedPage>
); );
}; };