diff --git a/resources/scripts/components/dashboard/ServerRow.tsx b/resources/scripts/components/dashboard/ServerRow.tsx index 99e9fec42..08637bfc2 100644 --- a/resources/scripts/components/dashboard/ServerRow.tsx +++ b/resources/scripts/components/dashboard/ServerRow.tsx @@ -1,10 +1,10 @@ import React, { memo, useEffect, useRef, useState } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faHdd, faMemory, faMicrochip, faServer } from '@fortawesome/free-solid-svg-icons'; +import { faEthernet, faHdd, faMemory, faMicrochip, faServer } from '@fortawesome/free-solid-svg-icons'; import { Link } from 'react-router-dom'; import { Server } from '@/api/server/getServer'; import getServerResourceUsage, { ServerPowerState, ServerStats } from '@/api/server/getServerResourceUsage'; -import { bytesToString, mbToBytes } from '@/lib/formatters'; +import { bytesToString, ip, mbToBytes } from '@/lib/formatters'; import tw from 'twin.macro'; import GreyRowBox from '@/components/elements/GreyRowBox'; import Spinner from '@/components/elements/Spinner'; @@ -90,7 +90,7 @@ export default ({ server, className }: { server: Server; className?: string }) = return ( -
+
@@ -101,6 +101,20 @@ export default ({ server, className }: { server: Server; className?: string }) = )}
+
+
+ +

+ {server.allocations + .filter((alloc) => alloc.isDefault) + .map((allocation) => ( + + {allocation.alias || ip(allocation.ip)}:{allocation.port} + + ))} +

+
+
{!stats || isSuspended ? ( isSuspended ? ( diff --git a/resources/scripts/components/server/console/ServerDetailsBlock.tsx b/resources/scripts/components/server/console/ServerDetailsBlock.tsx index 66831a782..a3a009612 100644 --- a/resources/scripts/components/server/console/ServerDetailsBlock.tsx +++ b/resources/scripts/components/server/console/ServerDetailsBlock.tsx @@ -6,8 +6,9 @@ import { faHdd, faMemory, faMicrochip, + faWifi, } from '@fortawesome/free-solid-svg-icons'; -import { bytesToString, mbToBytes } from '@/lib/formatters'; +import { bytesToString, ip, mbToBytes } from '@/lib/formatters'; import { ServerContext } from '@/state/server'; import { SocketEvent, SocketRequest } from '@/components/server/events'; import UptimeDuration from '@/components/server/UptimeDuration'; @@ -55,6 +56,12 @@ const ServerDetailsBlock = ({ className }: { className?: string }) => { [limits] ); + const allocation = ServerContext.useStoreState((state) => { + const match = state.server.data!.allocations.find((allocation) => allocation.isDefault); + + return !match ? 'n/a' : `${match.alias || ip(match.ip)}:${match.port}`; + }); + useEffect(() => { if (!connected || !instance) { return; @@ -83,6 +90,9 @@ const ServerDetailsBlock = ({ className }: { className?: string }) => { return (
+ + {allocation} +