Adding a server status dialog.

diff --git a/src/app/views/VPN/VPN.jsx b/src/app/views/VPN/VPN.jsx
index c1a0c9e996f142153e24db980a96a7fa96b4ec0b..1fa88d8d3690e44cdd5d3d4a38719fd5bb064ff6 100644 (file)
--- a/src/app/views/VPN/VPN.jsx
+++ b/src/app/views/VPN/VPN.jsx
@@ -1,6 +1,7 @@
-import { Container, Typography, Button, Grid } from '@mui/material';
+import { Container, Typography, Button, Grid, IconButton } from '@mui/material';
 import { MaterialReactTable, useMaterialReactTable } from 'material-react-table';
 import { useVPN } from '../../components';
+import { RemoveCircleOutlined, AccessTimeOutlined } from '@mui/icons-material/';
 
 const VPN = () => {
   const { setRevokeOpen,
@@ -30,32 +31,14 @@ const VPN = () => {
         header: 'Banning',
         Cell: ({ row }) => (
           <Grid container spacing={1} alignItems='center'>
-            <Grid item xs={6}>
-              <Button
-                size='small'
-                variant='contained'
-                color='secondary'
-                onClick={() => {
-                  setRevokeClientName( row.original.clientName );
-                  setRevokeOpen( true );
-                }}
-              >
-                Revoke
-              </Button>
-            </Grid>
-            <Grid item xs={6}>
-              <Button
-                size='small'
-                variant='contained'
-                color='secondary'
-                onClick={() => {
-                  setRevokeClientName( row.original.clientName );
-                  setRevokeOpen( true );
-                }}
-              >
-                Suspend
-              </Button>
-            </Grid>
+            <IconButton size='small' color='secondary' title='Revoke' onClick={() => {
+              setRevokeClientName( row.original.clientName );
+              setRevokeOpen( true );
+            }}><RemoveCircleOutlined/></IconButton>
+            <IconButton size='small' color='secondary' title='Suspend' onClick={() => {
+              setRevokeClientName( row.original.clientName );
+              setRevokeOpen( true );
+            }}><AccessTimeOutlined/></IconButton>
           </Grid>
         ),
       },