add v3.6.0-beta

ConvoyPanel · Feb 2, 2023 · eb55677 · eb55677
1 parent 9cf203b
commit eb55677
Show file tree

Hide file tree

Showing 5 changed files with 72 additions and 19 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,17 @@ This file is a running track of new features and fixes to each version of the pa
 
 This project follows [Semantic Versioning](http://semver.org) guidelines.
 
+## v3.6.0-beta
+
+### Fixed
+
+- IPv6 addresses wouldn't display in client area settings
+- Confusing "account password" placeholder when creating a server in the admin area
+
+### Added
+
+- Ability to view IP addresses of a server on the dashboard in the client area
+
 ## v3.5.1-beta
 
 ### Added

diff --git a/resources/scripts/components/admin/servers/CreateServerModal.tsx b/resources/scripts/components/admin/servers/CreateServerModal.tsx
@@ -173,7 +173,6 @@ const CreateServerModal = ({ nodeId, userId, open, onClose }: Props) => {
                         <TextInputFormik
                             name={'accountPassword'}
                             label={'Account Password'}
-                            placeholder={'Leave blank for no change'}
                             type={'password'}
                         />
                         <CheckboxFormik

diff --git a/resources/scripts/components/servers/overview/ServerNetworkBlock.tsx b/resources/scripts/components/servers/overview/ServerNetworkBlock.tsx
@@ -0,0 +1,51 @@
+import { Dd, Dt } from '@/components/dashboard/ServerCard'
+import Card from '@/components/elements/Card'
+import Display from '@/components/elements/displays/DisplayRow'
+import { ServerContext } from '@/state/server'
+import { useMemo } from 'react'
+
+const ServerNetworkBlock = () => {
+    const server = ServerContext.useStoreState(state => state.server.data!)
+
+    const addresses = useMemo(
+        () => [...server.limits.addresses.ipv4, ...server.limits.addresses.ipv6],
+        [server.limits.addresses]
+    )
+
+    return (
+        <Card className='flex flex-col col-span-10 md:col-span-5 relative'>
+            <h5 className='h5'>Network</h5>
+            <div className='flex flex-col space-y-3 mt-3'>
+                <dl>
+                    <Dt>IP Addresses</Dt>
+                    {addresses.length === 0 ? (
+                        <Dd>There are no addresses associated with this server.</Dd>
+                    ) : (
+                        <Display.Group className='mt-3'>
+                            {addresses.map(ip => (
+                                <Display.Row key={ip.id} className='grid-cols-1 md:grid-cols-3 text-sm'>
+                                    <div>
+                                        <p className='description-small !text-xs'>Address</p>
+                                        <p className='font-semibold text-foreground'>
+                                            {ip.address}/{ip.cidr}
+                                        </p>
+                                    </div>
+                                    <div>
+                                        <p className='description-small !text-xs'>Gateway</p>
+                                        <p className='text-foreground font-semibold'>{ip.gateway}</p>
+                                    </div>
+                                    <div>
+                                        <p className='description-small !text-xs'>Mac Address</p>
+                                        <p className='text-foreground font-semibold'>{ip.macAddress || 'None'}</p>
+                                    </div>
+                                </Display.Row>
+                            ))}
+                        </Display.Group>
+                    )}
+                </dl>
+            </div>
+        </Card>
+    )
+}
+
+export default ServerNetworkBlock
diff --git a/resources/scripts/components/servers/overview/ServerOverviewContainer.tsx b/resources/scripts/components/servers/overview/ServerOverviewContainer.tsx
@@ -1,5 +1,6 @@
 import ServerAdminBlock from '@/components/servers/overview/ServerAdminBlock'
 import ServerDetailsBlock from '@/components/servers/overview/ServerDetailsBlock'
+import ServerNetworkBlock from '@/components/servers/overview/ServerNetworkBlock'
 import ServerPowerBlock from '@/components/servers/overview/ServerPowerBlock'
 import ServerTerminalBlock from '@/components/servers/overview/ServerTerminalBlock'
 import ServerContentBlock from '@/components/servers/ServerContentBlock'
@@ -13,6 +14,7 @@ const ServerOverviewContainer = () => {
       <div className='grid grid-cols-10 gap-6'>
         <ServerDetailsBlock />
         <ServerTerminalBlock />
+        <ServerNetworkBlock />
         {rootAdmin && <ServerAdminBlock />}
       </div>
     </ServerContentBlock>

diff --git a/resources/scripts/components/servers/settings/HardwareContainer.tsx b/resources/scripts/components/servers/settings/HardwareContainer.tsx
@@ -9,24 +9,10 @@ import { bytesToString } from '@/util/helpers'
 import useFlash from '@/util/useFlash'
 import useNotify from '@/util/useNotify'
 import { useFormik } from 'formik'
-import { useEffect, useMemo, useState } from 'react'
-import useSWR from 'swr'
 import * as yup from 'yup'
-import { DndContext, DragEndEvent } from '@dnd-kit/core'
-import { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'
-import SortableItem, { ChildrenPropsWithHandle } from '@/components/elements/dnd/SortableItem'
-//@ts-ignore
-import DragVerticalIcon from '@/assets/images/icons/drag-vertical.svg'
-
-import { restrictToVerticalAxis, restrictToWindowEdges } from '@dnd-kit/modifiers'
-import MessageBox from '@/components/elements/MessageBox'
-import { PlusIcon, XMarkIcon } from '@heroicons/react/20/solid'
-import FlashMessageRender from '@/components/elements/FlashMessageRenderer'
-import updateBootOrder from '@/api/server/settings/updateBootOrder'
-import { Disk } from '@/api/server/useServerDetails'
-import { Badge } from '@mantine/core'
 import MediaContainer from '@/components/servers/settings/MediaContainer'
 import BootOrderContainer from '@/components/servers/settings/BootOrderContainer'
+import { useMemo } from 'react'
 
 const HardwareContainer = () => {
     const server = ServerContext.useStoreState(state => state.server.data!)
@@ -52,6 +38,11 @@ const HardwareContainer = () => {
         },
     })
 
+    const addresses = useMemo(() => [
+        ...server.limits.addresses.ipv4,
+        ...server.limits.addresses.ipv6,
+    ], [server.limits.addresses])
+
     return (
         <>
             <FormCard className='w-full'>
@@ -88,12 +79,11 @@ const HardwareContainer = () => {
 
                             <dl>
                                 <Dt>IP Addresses</Dt>
-                                {server.limits.addresses.ipv4.length === 0 &&
-                                server.limits.addresses.ipv6.length === 0 ? (
+                                {addresses.length === 0 ? (
                                     <Dd>There are no addresses associated with this server.</Dd>
                                 ) : (
                                     <Display.Group className='mt-3'>
-                                        {server.limits.addresses.ipv4.map(ip => (
+                                        {addresses.map(ip => (
                                             <Display.Row key={ip.id} className='grid-cols-1 md:grid-cols-3 text-sm'>
                                                 <div>
                                                     <p className='description-small !text-xs'>Address</p>