89 lines
3.7 KiB
TypeScript
89 lines
3.7 KiB
TypeScript
import TransferListener from '@/components/server/TransferListener';
|
|
import React, { useEffect, useState } from 'react';
|
|
import { useRouteMatch } from 'react-router-dom';
|
|
import NavigationBar from '@/components/NavigationBar';
|
|
import WebsocketHandler from '@/components/server/WebsocketHandler';
|
|
import { ServerContext } from '@/state/server';
|
|
import { CSSTransition } from 'react-transition-group';
|
|
import Spinner from '@/components/elements/Spinner';
|
|
import { ServerError } from '@/components/elements/ScreenBlock';
|
|
import { httpErrorToHuman } from '@/api/http';
|
|
import { useStoreState } from 'easy-peasy';
|
|
import SubNavigation from '@/components/elements/SubNavigation';
|
|
import InstallListener from '@/components/server/InstallListener';
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
import { faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
|
|
|
|
import { NavigationLinks, NavigationRouter } from '@/blueprint/extends/routers/ServerRouter';
|
|
import BeforeSubNavigation from '@/blueprint/components/Navigation/SubNavigation/BeforeSubNavigation';
|
|
import AdditionalServerItems from '@/blueprint/components/Navigation/SubNavigation/AdditionalServerItems';
|
|
import AfterSubNavigation from '@/blueprint/components/Navigation/SubNavigation/AfterSubNavigation';
|
|
|
|
export default () => {
|
|
const match = useRouteMatch<{ id: string }>();
|
|
|
|
const rootAdmin = useStoreState((state) => state.user.data!.rootAdmin);
|
|
const [error, setError] = useState('');
|
|
|
|
const id = ServerContext.useStoreState((state) => state.server.data?.id);
|
|
const uuid = ServerContext.useStoreState((state) => state.server.data?.uuid);
|
|
const serverId = ServerContext.useStoreState((state) => state.server.data?.internalId);
|
|
const getServer = ServerContext.useStoreActions((actions) => actions.server.getServer);
|
|
const clearServerState = ServerContext.useStoreActions((actions) => actions.clearServerState);
|
|
|
|
useEffect(
|
|
() => () => {
|
|
clearServerState();
|
|
},
|
|
[]
|
|
);
|
|
|
|
useEffect(() => {
|
|
setError('');
|
|
|
|
getServer(match.params.id).catch((error) => {
|
|
console.error(error);
|
|
setError(httpErrorToHuman(error));
|
|
});
|
|
|
|
return () => {
|
|
clearServerState();
|
|
};
|
|
}, [match.params.id]);
|
|
|
|
return (
|
|
<React.Fragment key={'server-router'}>
|
|
<NavigationBar />
|
|
{!uuid || !id ? (
|
|
error ? (
|
|
<ServerError message={error} />
|
|
) : (
|
|
<Spinner size={'large'} centered />
|
|
)
|
|
) : (
|
|
<>
|
|
<CSSTransition timeout={150} classNames={'fade'} appear in>
|
|
<SubNavigation>
|
|
<BeforeSubNavigation />
|
|
<div>
|
|
<NavigationLinks />
|
|
<AdditionalServerItems />
|
|
{rootAdmin && (
|
|
// eslint-disable-next-line react/jsx-no-target-blank
|
|
<a href={`/admin/servers/view/${serverId}`} target={'_blank'}>
|
|
<FontAwesomeIcon icon={faExternalLinkAlt} />
|
|
</a>
|
|
)}
|
|
</div>
|
|
<AfterSubNavigation />
|
|
</SubNavigation>
|
|
</CSSTransition>
|
|
<InstallListener />
|
|
<TransferListener />
|
|
<WebsocketHandler />
|
|
<NavigationRouter />
|
|
</>
|
|
)}
|
|
</React.Fragment>
|
|
);
|
|
};
|