2022-09-27 03:32:43 +00:00
import { Grid } from '@mui/material' ;
2022-11-23 04:28:13 +00:00
import { FC , useMemo , useRef , useState } from 'react' ;
2022-09-27 03:32:43 +00:00
import API_BASE_URL from '../../lib/consts/API_BASE_URL' ;
import NETWORK_TYPES from '../../lib/consts/NETWORK_TYPES' ;
2022-11-24 04:22:20 +00:00
import AddPeerDialog from './AddPeerDialog' ;
2022-11-23 04:28:13 +00:00
import api from '../../lib/api' ;
import ConfirmDialog from '../ConfirmDialog' ;
2022-09-27 03:32:43 +00:00
import FlexBox from '../FlexBox' ;
2022-11-23 04:28:13 +00:00
import handleAPIError from '../../lib/handleAPIError' ;
2022-09-27 03:32:43 +00:00
import List from '../List' ;
2022-11-23 04:28:13 +00:00
import MessageBox , { Message } from '../MessageBox' ;
2022-09-27 03:32:43 +00:00
import { ExpandablePanel } from '../Panels' ;
import periodicFetch from '../../lib/fetchers/periodicFetch' ;
import State from '../State' ;
import { BodyText , MonoText , SmallText } from '../Text' ;
2022-11-23 04:28:13 +00:00
const ConfigPeersForm : FC < ConfigPeerFormProps > = ( {
2022-11-23 18:32:15 +00:00
refreshInterval = 60000 ,
2022-11-23 04:28:13 +00:00
} ) = > {
2022-11-24 04:22:20 +00:00
const addPeerDialogRef = useRef < ConfirmDialogForwardedRefContent > ( { } ) ;
2022-11-23 04:28:13 +00:00
const confirmDialogRef = useRef < ConfirmDialogForwardedRefContent > ( { } ) ;
2024-01-04 21:17:05 +00:00
const [ apiMessage , setApiMessage ] = useState < Message | undefined > ( undefined ) ;
2022-11-23 04:28:13 +00:00
const [ confirmDialogProps , setConfirmDialogProps ] =
useState < ConfirmDialogProps > ( {
actionProceedText : '' ,
content : '' ,
titleText : '' ,
} ) ;
2022-09-27 03:32:43 +00:00
const [ inboundConnections , setInboundConnections ] =
2024-01-04 21:17:05 +00:00
useState < InboundConnectionList > ( { } ) ;
2022-09-27 03:32:43 +00:00
const [ isEditPeerConnections , setIsEditPeerConnections ] =
useState < boolean > ( false ) ;
2024-01-04 21:17:05 +00:00
const [ peerConnections , setPeerConnections ] = useState < PeerConnectionList > (
{ } ,
) ;
2022-11-23 04:28:13 +00:00
const apiMessageElement = useMemo (
( ) = >
2022-11-23 21:49:34 +00:00
apiMessage && (
2022-11-23 04:28:13 +00:00
< Grid item sm = { 2 } xs = { 1 } >
< MessageBox { ...apiMessage } / >
< / Grid >
2022-11-23 21:49:34 +00:00
) ,
2022-11-23 04:28:13 +00:00
[ apiMessage ] ,
) ;
2022-09-27 03:32:43 +00:00
2022-11-23 04:28:13 +00:00
const { isLoading } = periodicFetch < APIHostConnectionOverviewList > (
` ${ API_BASE_URL } /host/connection ` ,
{
refreshInterval ,
onError : ( error ) = > {
2024-01-04 21:17:05 +00:00
setApiMessage ( {
2022-11-23 05:45:56 +00:00
children : ` Failed to get connection data. Error: ${ error } ` ,
2022-11-23 04:28:13 +00:00
type : 'error' ,
} ) ;
} ,
onSuccess : ( {
local : {
inbound : { ipAddress : ipAddressList , port : dbPort , user : dbUser } ,
peer ,
} ,
} ) = > {
2022-11-23 21:49:34 +00:00
setInboundConnections ( ( previous ) = >
2022-11-23 04:28:13 +00:00
Object . entries ( ipAddressList ) . reduce < InboundConnectionList > (
(
2022-11-23 21:49:34 +00:00
nyu ,
2022-11-23 04:28:13 +00:00
[ ipAddress , { networkLinkNumber , networkNumber , networkType } ] ,
) = > {
2022-11-23 21:49:34 +00:00
nyu [ ipAddress ] = {
. . . previous [ ipAddress ] ,
2022-11-23 04:28:13 +00:00
dbPort ,
dbUser ,
ipAddress ,
networkLinkNumber ,
networkNumber ,
networkType ,
} ;
2022-11-23 21:49:34 +00:00
return nyu ;
2022-11-23 04:28:13 +00:00
} ,
{ } ,
) ,
) ;
2022-11-23 21:49:34 +00:00
setPeerConnections ( ( previous ) = >
2022-11-23 04:28:13 +00:00
Object . entries ( peer ) . reduce < PeerConnectionList > (
(
2022-11-23 21:49:34 +00:00
nyu ,
2022-11-23 04:28:13 +00:00
[
peerIPAddress ,
{
hostUUID ,
isPing : isPingTest ,
port : peerDBPort ,
user : peerDBUser ,
} ,
] ,
) = > {
2022-11-23 21:49:34 +00:00
const peerKey = ` ${ peerDBUser } @ ${ peerIPAddress } : ${ peerDBPort } ` ;
nyu [ peerKey ] = {
. . . previous [ peerKey ] ,
2022-11-23 04:28:13 +00:00
dbPort : peerDBPort ,
dbUser : peerDBUser ,
hostUUID ,
ipAddress : peerIPAddress ,
isPingTest ,
} ;
2022-11-23 21:49:34 +00:00
return nyu ;
2022-11-23 04:28:13 +00:00
} ,
{ } ,
) ,
) ;
2022-10-18 02:56:01 +00:00
} ,
2022-09-27 03:32:43 +00:00
} ,
2022-11-23 04:28:13 +00:00
) ;
2022-09-27 03:32:43 +00:00
return (
2022-11-23 04:28:13 +00:00
< >
2023-02-15 21:55:47 +00:00
< ExpandablePanel header = "Configure striker peers" loading = { isLoading } >
2022-11-23 04:28:13 +00:00
< Grid columns = { { xs : 1 , sm : 2 } } container spacing = "1em" >
< Grid item xs = { 1 } >
< List
header = "Inbound connections"
listEmpty = {
< BodyText align = "center" >
No inbound connections found .
< / BodyText >
}
listItemKeyPrefix = "config-peers-inbound-connection"
listItems = { inboundConnections }
renderListItem = { (
ipAddress ,
{ dbPort , dbUser , networkNumber , networkType } ,
) = > (
< FlexBox spacing = { 0 } sx = { { width : '100%' } } >
< MonoText > { ` ${ dbUser } @ ${ ipAddress } : ${ dbPort } ` } < / MonoText >
< SmallText > { ` ${ NETWORK_TYPES [ networkType ] } ${ networkNumber } ` } < / SmallText >
< / FlexBox >
) }
/ >
< / Grid >
< Grid item xs = { 1 } >
< List
header = "Peer connections"
allowEdit
edit = { isEditPeerConnections }
listEmpty = {
< BodyText align = "center" > No peer connections found . < / BodyText >
}
listItemKeyPrefix = "config-peers-peer-connection"
listItems = { peerConnections }
2022-11-24 04:22:20 +00:00
onAdd = { ( ) = > {
addPeerDialogRef . current . setOpen ? . call ( null , true ) ;
} }
2022-11-23 04:28:13 +00:00
onDelete = { ( ) = > {
const pairs = Object . entries ( peerConnections ) ;
2022-11-23 21:56:32 +00:00
const deleteRequestBody =
pairs . reduce < APIDeleteHostConnectionRequestBody > (
( previous , [ , { hostUUID , isChecked } ] ) = > {
if ( isChecked ) {
previous . local . push ( hostUUID ) ;
}
return previous ;
} ,
{ local : [ ] } ,
) ;
2022-11-23 04:28:13 +00:00
const deleteCount = deleteRequestBody . local . length ;
if ( deleteCount > 0 ) {
setConfirmDialogProps ( {
actionProceedText : 'Delete' ,
content : ` The peer relationship between this striker and the selected ${ deleteCount } host(s) will terminate. The removed peer(s) can be re-added later. ` ,
onProceedAppend : ( ) = > {
api
. delete ( '/host/connection' , { data : deleteRequestBody } )
. catch ( ( error ) = > {
const emsg = handleAPIError ( error ) ;
2022-11-23 05:45:56 +00:00
emsg . children = ` Failed to delete peer connection(s). ${ emsg . children } ` ;
2022-11-23 04:28:13 +00:00
2024-01-04 21:17:05 +00:00
setApiMessage ( emsg ) ;
2022-11-23 04:28:13 +00:00
} ) ;
} ,
proceedColour : 'red' ,
titleText : ` Delete ${ deleteCount } peer(s) from this striker? ` ,
} ) ;
confirmDialogRef . current . setOpen ? . call ( null , true ) ;
}
} }
onEdit = { ( ) = > {
setIsEditPeerConnections ( ( previous ) = > ! previous ) ;
} }
onItemCheckboxChange = { ( key , event , isChecked ) = > {
peerConnections [ key ] . isChecked = isChecked ;
setPeerConnections ( ( previous ) = > ( { . . . previous } ) ) ;
} }
renderListItem = { ( peer , { isPingTest = false } ) = > (
< FlexBox row spacing = { 0 } >
< FlexBox spacing = { 0 } >
< MonoText > { peer } < / MonoText >
< State label = "Ping" state = { isPingTest } / >
< / FlexBox >
2022-09-27 03:32:43 +00:00
< / FlexBox >
2022-11-23 04:28:13 +00:00
) }
/ >
< / Grid >
{ apiMessageElement }
2022-09-27 03:32:43 +00:00
< / Grid >
2022-11-23 04:28:13 +00:00
< / ExpandablePanel >
2022-11-24 04:22:20 +00:00
< AddPeerDialog ref = { addPeerDialogRef } / >
2022-11-25 21:16:41 +00:00
< ConfirmDialog
closeOnProceed
{ . . . confirmDialogProps }
ref = { confirmDialogRef }
/ >
2022-11-23 04:28:13 +00:00
< / >
2022-09-27 03:32:43 +00:00
) ;
} ;
export default ConfigPeersForm ;