mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-01 02:13:33 +00:00
Add files
This commit is contained in:
commit
e87c814068
266 changed files with 63938 additions and 0 deletions
|
|
@ -0,0 +1,26 @@
|
|||
import { Stack, Group } from '@mantine/core';
|
||||
import { RiAlertFill } from 'react-icons/ri';
|
||||
import { Text } from '/@/renderer/components';
|
||||
|
||||
interface ActionRequiredContainerProps {
|
||||
children: React.ReactNode;
|
||||
title: string;
|
||||
}
|
||||
|
||||
export const ActionRequiredContainer = ({ title, children }: ActionRequiredContainerProps) => (
|
||||
<Stack sx={{ cursor: 'default', maxWidth: '700px' }}>
|
||||
<Group>
|
||||
<RiAlertFill
|
||||
color="var(--warning-color)"
|
||||
size={30}
|
||||
/>
|
||||
<Text
|
||||
size="xl"
|
||||
sx={{ textTransform: 'uppercase' }}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
</Group>
|
||||
<Stack>{children}</Stack>
|
||||
</Stack>
|
||||
);
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
import { Box, Center, Divider, Group, Stack } from '@mantine/core';
|
||||
import type { FallbackProps } from 'react-error-boundary';
|
||||
import { RiErrorWarningLine, RiArrowLeftLine } from 'react-icons/ri';
|
||||
import { useNavigate, useRouteError } from 'react-router';
|
||||
import styled from 'styled-components';
|
||||
import { Button, Text } from '/@/renderer/components';
|
||||
|
||||
const Container = styled(Box)`
|
||||
background: var(--main-bg);
|
||||
`;
|
||||
|
||||
export const ErrorFallback = ({ error, resetErrorBoundary }: FallbackProps) => {
|
||||
return (
|
||||
<Container>
|
||||
<Center sx={{ height: '100vh' }}>
|
||||
<Stack sx={{ maxWidth: '50%' }}>
|
||||
<Group spacing="xs">
|
||||
<RiErrorWarningLine
|
||||
color="var(--danger-color)"
|
||||
size={30}
|
||||
/>
|
||||
<Text size="lg">Something went wrong</Text>
|
||||
</Group>
|
||||
<Text>{error.message}</Text>
|
||||
<Button
|
||||
variant="filled"
|
||||
onClick={resetErrorBoundary}
|
||||
>
|
||||
Reload
|
||||
</Button>
|
||||
</Stack>
|
||||
</Center>
|
||||
</Container>
|
||||
);
|
||||
};
|
||||
|
||||
export const RouteErrorBoundary = () => {
|
||||
const navigate = useNavigate();
|
||||
const error = useRouteError() as any;
|
||||
console.log('error', error);
|
||||
|
||||
const handleReload = () => {
|
||||
navigate(0);
|
||||
};
|
||||
|
||||
const handleReturn = () => {
|
||||
navigate(-1);
|
||||
};
|
||||
|
||||
return (
|
||||
<Container>
|
||||
<Center sx={{ height: '100vh' }}>
|
||||
<Stack sx={{ maxWidth: '50%' }}>
|
||||
<Group>
|
||||
<RiErrorWarningLine
|
||||
color="var(--danger-color)"
|
||||
size={30}
|
||||
/>
|
||||
<Text size="lg">Something went wrong</Text>
|
||||
</Group>
|
||||
<Divider my={5} />
|
||||
<Text size="sm">{error?.message}</Text>
|
||||
<Group grow>
|
||||
<Button
|
||||
leftIcon={<RiArrowLeftLine />}
|
||||
sx={{ flex: 0.5 }}
|
||||
variant="default"
|
||||
onClick={handleReturn}
|
||||
>
|
||||
Go back
|
||||
</Button>
|
||||
<Button
|
||||
variant="filled"
|
||||
onClick={handleReload}
|
||||
>
|
||||
Reload
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Center>
|
||||
</Container>
|
||||
);
|
||||
};
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
import { useEffect, useState } from 'react';
|
||||
import isElectron from 'is-electron';
|
||||
import { FileInput, Text, Button } from '/@/renderer/components';
|
||||
|
||||
const localSettings = window.electron.localSettings;
|
||||
|
||||
export const MpvRequired = () => {
|
||||
const [mpvPath, setMpvPath] = useState('');
|
||||
const handleSetMpvPath = (e: File) => {
|
||||
localSettings.set('mpv_path', e.path);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const getMpvPath = async () => {
|
||||
if (!isElectron()) return setMpvPath('');
|
||||
const mpvPath = localSettings.get('mpv_path') as string;
|
||||
return setMpvPath(mpvPath);
|
||||
};
|
||||
|
||||
getMpvPath();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Text size="lg">Set your MPV executable location below and restart the application.</Text>
|
||||
<Text>
|
||||
MPV is available at the following:{' '}
|
||||
<a
|
||||
href="https://mpv.io/installation/"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
https://mpv.io/
|
||||
</a>
|
||||
</Text>
|
||||
<FileInput
|
||||
placeholder={mpvPath}
|
||||
onChange={handleSetMpvPath}
|
||||
/>
|
||||
<Button onClick={() => localSettings.restart()}>Restart</Button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
import { Text } from '/@/renderer/components';
|
||||
import { useCurrentServer } from '/@/renderer/store';
|
||||
|
||||
export const ServerCredentialRequired = () => {
|
||||
const currentServer = useCurrentServer();
|
||||
|
||||
return (
|
||||
<>
|
||||
<Text size="lg">
|
||||
The selected server '{currentServer?.name}' requires an additional login to
|
||||
access.
|
||||
</Text>
|
||||
<Text size="lg">
|
||||
Add your credentials in the 'manage servers' menu or switch to a different server.
|
||||
</Text>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { Text } from '/@/renderer/components';
|
||||
|
||||
export const ServerRequired = () => {
|
||||
return (
|
||||
<>
|
||||
<Text size="xl">No server selected.</Text>
|
||||
<Text>Add or select a server in the file menu.</Text>
|
||||
</>
|
||||
);
|
||||
};
|
||||
1
src/renderer/features/action-required/index.ts
Normal file
1
src/renderer/features/action-required/index.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export * from './components/error-fallback';
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
import { useState, useEffect } from 'react';
|
||||
import { Center, Group, Stack } from '@mantine/core';
|
||||
import isElectron from 'is-electron';
|
||||
import { RiCheckFill } from 'react-icons/ri';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Button, Text } from '/@/renderer/components';
|
||||
import { ActionRequiredContainer } from '/@/renderer/features/action-required/components/action-required-container';
|
||||
import { MpvRequired } from '/@/renderer/features/action-required/components/mpv-required';
|
||||
import { ServerCredentialRequired } from '/@/renderer/features/action-required/components/server-credential-required';
|
||||
import { ServerRequired } from '/@/renderer/features/action-required/components/server-required';
|
||||
import { AnimatedPage } from '/@/renderer/features/shared';
|
||||
import { AppRoute } from '/@/renderer/router/routes';
|
||||
import { useCurrentServer } from '/@/renderer/store';
|
||||
|
||||
const localSettings = window.electron.localSettings;
|
||||
|
||||
const ActionRequiredRoute = () => {
|
||||
const currentServer = useCurrentServer();
|
||||
const [isMpvRequired, setIsMpvRequired] = useState(false);
|
||||
const isServerRequired = !currentServer;
|
||||
// const isCredentialRequired = currentServer?.noCredential && !serverToken;
|
||||
const isCredentialRequired = false;
|
||||
|
||||
useEffect(() => {
|
||||
const getMpvPath = async () => {
|
||||
if (!isElectron()) return setIsMpvRequired(false);
|
||||
const mpvPath = await localSettings.get('mpv_path');
|
||||
return setIsMpvRequired(!mpvPath);
|
||||
};
|
||||
|
||||
getMpvPath();
|
||||
}, []);
|
||||
|
||||
const checks = [
|
||||
{
|
||||
component: <MpvRequired />,
|
||||
title: 'MPV required',
|
||||
valid: !isMpvRequired,
|
||||
},
|
||||
{
|
||||
component: <ServerCredentialRequired />,
|
||||
title: 'Credentials required',
|
||||
valid: !isCredentialRequired,
|
||||
},
|
||||
{
|
||||
component: <ServerRequired />,
|
||||
title: 'Server required',
|
||||
valid: !isServerRequired,
|
||||
},
|
||||
];
|
||||
|
||||
const canReturnHome = checks.every((c) => c.valid);
|
||||
const displayedCheck = checks.find((c) => !c.valid);
|
||||
|
||||
return (
|
||||
<AnimatedPage>
|
||||
<Center sx={{ height: '100%', width: '100vw' }}>
|
||||
<Stack
|
||||
spacing="xl"
|
||||
sx={{ maxWidth: '50%' }}
|
||||
>
|
||||
<Group noWrap>
|
||||
{displayedCheck && (
|
||||
<ActionRequiredContainer title={displayedCheck.title}>
|
||||
{displayedCheck?.component}
|
||||
</ActionRequiredContainer>
|
||||
)}
|
||||
</Group>
|
||||
<Stack mt="2rem">
|
||||
{canReturnHome && (
|
||||
<>
|
||||
<Group
|
||||
noWrap
|
||||
position="center"
|
||||
>
|
||||
<RiCheckFill
|
||||
color="var(--success-color)"
|
||||
size={30}
|
||||
/>
|
||||
<Text size="xl">No issues found</Text>
|
||||
</Group>
|
||||
<Button
|
||||
component={Link}
|
||||
disabled={!canReturnHome}
|
||||
to={AppRoute.HOME}
|
||||
variant="filled"
|
||||
>
|
||||
Go back
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Center>
|
||||
</AnimatedPage>
|
||||
);
|
||||
};
|
||||
|
||||
export default ActionRequiredRoute;
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
import { Center, Group, Stack } from '@mantine/core';
|
||||
import { RiQuestionLine } from 'react-icons/ri';
|
||||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { Button, Text } from '/@/renderer/components';
|
||||
import { AnimatedPage } from '/@/renderer/features/shared';
|
||||
|
||||
const InvalidRoute = () => {
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
|
||||
return (
|
||||
<AnimatedPage>
|
||||
<Center sx={{ height: '100%', width: '100%' }}>
|
||||
<Stack>
|
||||
<Group
|
||||
noWrap
|
||||
position="center"
|
||||
>
|
||||
<RiQuestionLine
|
||||
color="var(--warning-color)"
|
||||
size={30}
|
||||
/>
|
||||
<Text size="xl">Page not found</Text>
|
||||
</Group>
|
||||
<Text>{location.pathname}</Text>
|
||||
<Button
|
||||
variant="filled"
|
||||
onClick={() => navigate(-1)}
|
||||
>
|
||||
Go back
|
||||
</Button>
|
||||
</Stack>
|
||||
</Center>
|
||||
</AnimatedPage>
|
||||
);
|
||||
};
|
||||
|
||||
export default InvalidRoute;
|
||||
Loading…
Add table
Add a link
Reference in a new issue