Merge pull request #2781 from pterodactyl/matthewpi/server-details-patch-1

Show installing status instead of offline when a server is installing
This commit is contained in:
Dane Everitt 2020-12-06 15:27:03 -08:00 committed by GitHub
commit fcff9085b8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 6 deletions

View file

@ -2,8 +2,6 @@
namespace Pterodactyl\Http\Requests\Api\Client\Servers\Network; namespace Pterodactyl\Http\Requests\Api\Client\Servers\Network;
use Illuminate\Support\Collection;
use Pterodactyl\Models\Allocation;
use Pterodactyl\Models\Permission; use Pterodactyl\Models\Permission;
use Pterodactyl\Http\Requests\Api\Client\ClientApiRequest; use Pterodactyl\Http\Requests\Api\Client\ClientApiRequest;
@ -16,5 +14,4 @@ class NewAllocationRequest extends ClientApiRequest
{ {
return Permission::ACTION_ALLOCATION_CREATE; return Permission::ACTION_ALLOCATION_CREATE;
} }
} }

View file

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import tw from 'twin.macro'; import tw, { TwStyle } from 'twin.macro';
import { faCircle, faEthernet, faHdd, faMemory, faMicrochip, faServer } from '@fortawesome/free-solid-svg-icons'; import { faCircle, faEthernet, faHdd, faMemory, faMicrochip, faServer } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { bytesToHuman, megabytesToHuman } from '@/helpers'; import { bytesToHuman, megabytesToHuman } from '@/helpers';
@ -13,6 +13,21 @@ interface Stats {
disk: number; disk: number;
} }
function statusToColor (status: string|null, installing: boolean): TwStyle {
if (installing) {
status = '';
}
switch (status) {
case 'offline':
return tw`text-red-500`;
case 'running':
return tw`text-green-500`;
default:
return tw`text-yellow-500`;
}
}
const ServerDetailsBlock = () => { const ServerDetailsBlock = () => {
const [ stats, setStats ] = useState<Stats>({ memory: 0, cpu: 0, disk: 0 }); const [ stats, setStats ] = useState<Stats>({ memory: 0, cpu: 0, disk: 0 });
@ -49,6 +64,7 @@ const ServerDetailsBlock = () => {
}, [ instance, connected ]); }, [ instance, connected ]);
const name = ServerContext.useStoreState(state => state.server.data!.name); const name = ServerContext.useStoreState(state => state.server.data!.name);
const isInstalling = ServerContext.useStoreState(state => state.server.data!.isInstalling);
const limits = ServerContext.useStoreState(state => state.server.data!.limits); const limits = ServerContext.useStoreState(state => state.server.data!.limits);
const primaryAllocation = ServerContext.useStoreState(state => state.server.data!.allocations.filter(alloc => alloc.isDefault).map( const primaryAllocation = ServerContext.useStoreState(state => state.server.data!.allocations.filter(alloc => alloc.isDefault).map(
allocation => (allocation.alias || allocation.ip) + ':' + allocation.port allocation => (allocation.alias || allocation.ip) + ':' + allocation.port
@ -65,10 +81,10 @@ const ServerDetailsBlock = () => {
fixedWidth fixedWidth
css={[ css={[
tw`mr-1`, tw`mr-1`,
status === 'offline' ? tw`text-red-500` : (status === 'running' ? tw`text-green-500` : tw`text-yellow-500`), statusToColor(status, isInstalling),
]} ]}
/> />
&nbsp;{!status ? 'Connecting...' : status} &nbsp;{!status ? 'Connecting...' : (isInstalling ? 'Installing' : status)}
</p> </p>
<CopyOnClick text={primaryAllocation}> <CopyOnClick text={primaryAllocation}>
<p css={tw`text-xs mt-2`}> <p css={tw`text-xs mt-2`}>