Skip to content

Commit c43bf39

Browse files
DaneEverittDaneEveritt
committed
Fix login screen 404
1 parent d426887 commit c43bf39

File tree

8 files changed

+115
-94
lines changed

8 files changed

+115
-94
lines changed

‎resources/scripts/components/auth/LoginFormContainer.tsx‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,5 +43,16 @@ export default forwardRef<HTMLFormElement, Props>(({ title, ...props }, ref) =>
4343
</div>
4444
</div>
4545
</Form>
46+
<p className={'text-center text-neutral-500 text-xs mt-4'}>
47+
&copy; 2015 - 2020&nbsp;
48+
<a
49+
rel={'noopener nofollow'}
50+
href={'https://pterodactyl.io'}
51+
target={'_blank'}
52+
className={'no-underline text-neutral-500 hover:text-neutral-300'}
53+
>
54+
Pterodactyl Software
55+
</a>
56+
</p>
4657
</Container>
4758
));

‎resources/scripts/components/elements/PageContentBlock.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default ({ className, children }: Props) => (
1414
{children}
1515
</ContentContainer>
1616
<ContentContainer className={'mb-4'}>
17-
<p className={'text-right text-neutral-500 text-xs'}>
17+
<p className={'text-center text-neutral-500 text-xs'}>
1818
&copy; 2015 - 2020&nbsp;
1919
<a
2020
rel={'noopener nofollow'}

‎resources/scripts/components/screens/NotFound.tsx‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,17 @@
11
import React from 'react';
2-
import PageContentBlock from '@/components/elements/PageContentBlock';
2+
import ScreenBlock from '@/components/screens/ScreenBlock';
33

44
interface Props {
55
title?: string;
6-
message: string;
6+
message?: string;
7+
onBack?: () => void;
78
}
89

9-
export default ({ title, message }: Props) => (
10-
<PageContentBlock>
11-
<div className={'flex justify-center'}>
12-
<div className={'w-full sm:w-3/4 md:w-1/2 p-12 md:p-20 bg-neutral-100 rounded-lg shadow-lg text-center'}>
13-
<img src={'/assets/svgs/not_found.svg'} className={'w-2/3 h-auto select-none'}/>
14-
<h2 className={'mt-6 text-neutral-900 font-bold'}>404</h2>
15-
<p className={'text-sm text-neutral-700 mt-2'}>
16-
The requested resource was not found.
17-
</p>
18-
</div>
19-
</div>
20-
</PageContentBlock>
10+
export default ({ title, message, onBack }: Props) => (
11+
<ScreenBlock
12+
title={title || '404'}
13+
image={'/assets/svgs/not_found.svg'}
14+
message={message || 'The requested resource was not found.'}
15+
onBack={onBack}
16+
/>
2117
);

‎resources/scripts/components/screens/ScreenBlock.tsx‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import React from 'react';
2+
import PageContentBlock from '@/components/elements/PageContentBlock';
3+
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
4+
import { faArrowLeft } from '@fortawesome/free-solid-svg-icons/faArrowLeft';
5+
import { faSyncAlt } from '@fortawesome/free-solid-svg-icons/faSyncAlt';
6+
import classNames from 'classnames';
7+
import styled from 'styled-components';
8+
9+
interface BaseProps {
10+
title: string;
11+
image: string;
12+
message: string;
13+
onRetry?: () => void;
14+
onBack?: () => void;
15+
}
16+
17+
interface PropsWithRetry extends BaseProps {
18+
onRetry?: () => void;
19+
onBack?: never | undefined;
20+
}
21+
22+
interface PropsWithBack extends BaseProps {
23+
onBack?: () => void;
24+
onRetry?: never | undefined;
25+
}
26+
27+
type Props = PropsWithBack | PropsWithRetry;
28+
29+
const ActionButton = styled.button`
30+
${tw`rounded-full w-8 h-8 flex items-center justify-center`};
31+
32+
&.hover\\:spin:hover {
33+
animation: spin 2s linear infinite;
34+
}
35+
36+
@keyframes spin {
37+
to {
38+
transform: rotate(360deg);
39+
}
40+
}
41+
`;
42+
43+
export default ({ title, image, message, onBack, onRetry }: Props) => (
44+
<PageContentBlock>
45+
<div className={'flex justify-center'}>
46+
<div className={'w-full sm:w-3/4 md:w-1/2 p-12 md:p-20 bg-neutral-100 rounded-lg shadow-lg text-center relative'}>
47+
{(typeof onBack === 'function' || typeof onRetry === 'function') &&
48+
<div className={'absolute pin-l pin-t ml-4 mt-4'}>
49+
<ActionButton
50+
onClick={() => onRetry ? onRetry() : (onBack ? onBack() : null)}
51+
className={classNames('btn btn-primary', { 'hover:spin': !!onRetry })}
52+
>
53+
<FontAwesomeIcon icon={onRetry ? faSyncAlt : faArrowLeft}/>
54+
</ActionButton>
55+
</div>
56+
}
57+
<img src={image} className={'w-2/3 h-auto select-none'}/>
58+
<h2 className={'mt-6 text-neutral-900 font-bold'}>{title}</h2>
59+
<p className={'text-sm text-neutral-700 mt-2'}>
60+
{message}
61+
</p>
62+
</div>
63+
</div>
64+
</PageContentBlock>
65+
);

‎resources/scripts/components/screens/ServerError.tsx‎

Lines changed: 10 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,21 @@
11
import React from 'react';
2-
import PageContentBlock from '@/components/elements/PageContentBlock';
3-
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
4-
import { faArrowLeft } from '@fortawesome/free-solid-svg-icons/faArrowLeft';
5-
import { faSyncAlt } from '@fortawesome/free-solid-svg-icons/faSyncAlt';
6-
import classNames from 'classnames';
72
import styled from 'styled-components';
3+
import ScreenBlock from '@/components/screens/ScreenBlock';
84

9-
interface BaseProps {
5+
interface Props {
106
title?: string;
117
message: string;
128
onRetry?: () => void;
139
onBack?: () => void;
1410
}
1511

16-
interface PropsWithRetry extends BaseProps {
17-
onRetry?: () => void;
18-
onBack?: never | undefined;
19-
}
20-
21-
interface PropsWithBack extends BaseProps {
22-
onBack?: () => void;
23-
onRetry?: never | undefined;
24-
}
25-
26-
type Props = PropsWithBack | PropsWithRetry;
27-
28-
const ActionButton = styled.button`
29-
${tw`rounded-full w-8 h-8 flex items-center justify-center`};
30-
31-
&.hover\\:spin:hover {
32-
animation: spin 2s linear infinite;
33-
}
34-
35-
@keyframes spin {
36-
to {
37-
transform: rotate(360deg);
38-
}
39-
}
40-
`;
41-
4212
export default ({ title, message, onBack, onRetry }: Props) => (
43-
<PageContentBlock>
44-
<div className={'flex justify-center'}>
45-
<div className={'w-full sm:w-3/4 md:w-1/2 p-12 md:p-20 bg-neutral-100 rounded-lg shadow-lg text-center relative'}>
46-
{(typeof onBack === 'function' || typeof onRetry === 'function') &&
47-
<div className={'absolute pin-l pin-t ml-4 mt-4'}>
48-
<ActionButton
49-
onClick={() => onRetry ? onRetry() : (onBack ? onBack() : null)}
50-
className={classNames('btn btn-primary', { 'hover:spin': !!onRetry })}
51-
>
52-
<FontAwesomeIcon icon={onRetry ? faSyncAlt : faArrowLeft}/>
53-
</ActionButton>
54-
</div>
55-
}
56-
<img src={'/assets/svgs/server_error.svg'} className={'w-2/3 h-auto select-none'}/>
57-
<h2 className={'mt-6 text-neutral-900 font-bold'}>{title || 'Something went wrong!'}</h2>
58-
<p className={'text-sm text-neutral-700 mt-2'}>
59-
{message}
60-
</p>
61-
</div>
62-
</div>
63-
</PageContentBlock>
13+
// @ts-ignore
14+
<ScreenBlock
15+
title={title || 'Something went wrong'}
16+
image={'/assets/svgs/server_error.svg'}
17+
message={message}
18+
onBack={onBack}
19+
onRetry={onRetry}
20+
/>
6421
);

‎resources/scripts/components/screens/ServerInstalling.tsx‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎resources/scripts/routers/AuthenticationRouter.tsx‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,22 @@
11
import React from 'react';
2-
import { Route, RouteComponentProps } from 'react-router-dom';
2+
import { Route, RouteComponentProps, Switch } from 'react-router-dom';
33
import LoginContainer from '@/components/auth/LoginContainer';
44
import ForgotPasswordContainer from '@/components/auth/ForgotPasswordContainer';
55
import ResetPasswordContainer from '@/components/auth/ResetPasswordContainer';
66
import LoginCheckpointContainer from '@/components/auth/LoginCheckpointContainer';
77
import NotFound from '@/components/screens/NotFound';
88

9-
export default ({ match }: RouteComponentProps) => (
9+
export default ({ location, history, match }: RouteComponentProps) => (
1010
<div className={'mt-8 xl:mt-32'}>
11-
<Route path={`${match.path}/login`} component={LoginContainer} exact/>
12-
<Route path={`${match.path}/login/checkpoint`} component={LoginCheckpointContainer}/>
13-
<Route path={`${match.path}/password`} component={ForgotPasswordContainer} exact/>
14-
<Route path={`${match.path}/password/reset/:token`} component={ResetPasswordContainer}/>
15-
<Route path={`${match.path}/checkpoint`}/>
16-
<Route path={'*'} component={NotFound}/>
11+
<Switch location={location}>
12+
<Route path={`${match.path}/login`} component={LoginContainer} exact/>
13+
<Route path={`${match.path}/login/checkpoint`} component={LoginCheckpointContainer}/>
14+
<Route path={`${match.path}/password`} component={ForgotPasswordContainer} exact/>
15+
<Route path={`${match.path}/password/reset/:token`} component={ResetPasswordContainer}/>
16+
<Route path={`${match.path}/checkpoint`}/>
17+
<Route path={'*'}>
18+
<NotFound onBack={() => history.push('/auth/login')}/>
19+
</Route>
20+
</Switch>
1721
</div>
1822
);

‎resources/scripts/routers/ServerRouter.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,10 @@ import UsersContainer from '@/components/server/users/UsersContainer';
1717
import Can from '@/components/elements/Can';
1818
import BackupContainer from '@/components/server/backups/BackupContainer';
1919
import Spinner from '@/components/elements/Spinner';
20-
import ServerInstalling from '@/components/screens/ServerInstalling';
2120
import ServerError from '@/components/screens/ServerError';
2221
import { httpErrorToHuman } from '@/api/http';
2322
import NotFound from '@/components/screens/NotFound';
23+
import ScreenBlock from '@/components/screens/ScreenBlock';
2424

2525
const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>) => {
2626
const [ error, setError ] = useState('');
@@ -63,7 +63,11 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
6363
<Spinner size={'large'}/>
6464
</div>
6565
:
66-
<ServerInstalling/>
66+
<ScreenBlock
67+
title={'Your server is installing.'}
68+
image={'/assets/svgs/server_installing.svg'}
69+
message={'Please check back in a few minutes.'}
70+
/>
6771
:
6872
<>
6973
<CSSTransition timeout={250} classNames={'fade'} appear={true} in={true}>

0 commit comments

Comments
 (0)