Skynet/misc_pterodactyl-panel
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Always show the resource graph boxes

Browse source
This commit is contained in:
Dane Everitt 2019-12-07 11:11:40 -08:00
parent 976ad7497f
commit ae3f05b8f7
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
2 changed files with 20 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/scripts/components/server/ServerConsole.tsx
View file

@ -73,7 +73,7 @@ export default () => {
return () => {
instance.removeListener('stats', statsListener);
};
}, [ connected ]);
}, [ instance, connected ]);
return (
<div className={'my-10 flex'}>
@ -135,7 +135,7 @@ export default () => {
<div className={'flex-1 mx-4 mr-4'}>
<SuspenseSpinner>
<ChunkedConsole/>
{status !== 'offline' && <ChunkedStatGraphs/>}
<ChunkedStatGraphs/>
</SuspenseSpinner>
</div>
</div>

18
resources/scripts/components/server/StatGraphs.tsx
View file

@ -72,7 +72,8 @@ const createDefaultChart = (ctx: CanvasRenderingContext2D, options?: ChartConfig
});
export default () => {
const { limits } = ServerContext.useStoreState(state => state.server.data!);
const status = ServerContext.useStoreState(state => state.status.value);
const limits = ServerContext.useStoreState(state => state.server.data!.limits);
const { connected, instance } = ServerContext.useStoreState(state => state.socket);
const [ memory, setMemory ] = useState<Chart>();
@ -152,15 +153,28 @@ export default () => {
return () => {
instance.removeListener('stats', statsListener);
};
}, [ connected, memory, cpu ]);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [ instance, connected, memory, cpu ]);
return (
<div className={'flex mt-4'}>
<TitledGreyBox title={'Memory usage'} icon={faMemory} className={'flex-1 mr-2'}>
{status !== 'offline' ?
<canvas id={'memory_chart'} ref={memoryRef} aria-label={'Server Memory Usage Graph'} role={'img'}/>
:
<p className={'text-xs text-neutral-400 text-center p-3'}>
Server is offline.
</p>
}
</TitledGreyBox>
<TitledGreyBox title={'CPU usage'} icon={faMicrochip} className={'flex-1 ml-2'}>
{status !== 'offline' ?
<canvas id={'cpu_chart'} ref={cpuRef} aria-label={'Server CPU Usage Graph'} role={'img'}/>
:
<p className={'text-xs text-neutral-400 text-center p-3'}>
Server is offline.
</p>
}
</TitledGreyBox>
</div>
);