diff --git a/striker-ui/pages/config/index.tsx b/striker-ui/pages/config/index.tsx index 0513b3d0..2e92d3cc 100644 --- a/striker-ui/pages/config/index.tsx +++ b/striker-ui/pages/config/index.tsx @@ -1,4 +1,5 @@ -import { Box, Grid } from '@mui/material'; +import { Grid } from '@mui/material'; +import Head from 'next/head'; import { FC, useState } from 'react'; import API_BASE_URL from '../../lib/consts/API_BASE_URL'; @@ -42,45 +43,51 @@ const Config: FC<{ refreshInterval?: number }> = ({ const [simpleOpsPanelHeader, setSimpleOpsPanelHeader] = useProtectedState('', protect); - periodicFetch(`${API_BASE_URL}/host/local`, { - onError: () => { - setSimpleOpsPanelHeader('Unknown'); - }, - onSuccess: ({ installTarget, shortHostName }) => { - setSimpleOpsInstallTarget(installTarget); - setSimpleOpsPanelHeader(shortHostName); - }, - refreshInterval, - }); + const { data: hostDetail, isLoading: loadingHostDetail } = + periodicFetch(`${API_BASE_URL}/host/local`, { + onError: () => { + setSimpleOpsPanelHeader('Unknown'); + }, + onSuccess: ({ installTarget, shortHostName }) => { + setSimpleOpsInstallTarget(installTarget); + setSimpleOpsPanelHeader(shortHostName); + }, + refreshInterval, + }); return ( <> - -
- - - { - setConfirmDialogProps((previous) => ({ - ...previous, - ...restConfirmDialogProps, - onProceedAppend: (...args) => { - onProceedAppend?.call(null, ...args); - setIsOpenConfirmDialog(false); - }, - })); + + + {loadingHostDetail + ? 'Loading...' + : `${hostDetail?.shortHostName} Config`} + + +
+ + + { + setConfirmDialogProps((previous) => ({ + ...previous, + ...restConfirmDialogProps, + onProceedAppend: (...args) => { + onProceedAppend?.call(null, ...args); + setIsOpenConfirmDialog(false); + }, + })); - setIsOpenConfirmDialog(true); - }} - title={simpleOpsPanelHeader} - /> - - - - + setIsOpenConfirmDialog(true); + }} + title={simpleOpsPanelHeader} + /> + + + - +