add: frontend update

frontend/src/components/PortHijack/AddNewService.tsx

@@ -1,4 +1,4 @@
-import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl } from '@mantine/core';
+import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl, Box } from '@mantine/core';
 import { useForm } from '@mantine/form';
 import { useState } from 'react';
 import { okNotify, regex_ipv6_no_cidr, regex_ipv4_no_cidr } from '../../js/utils';
@@ -79,12 +79,12 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
             <PortAndInterface form={form} int_name="ip_dst" port_name="proxy_port" label="Proxy/Internal IP Address and port (ipv4/ipv6)" />
             <Space h="md" />
 
-            <div className='center-flex'>
+            <Box className='center-flex'>
                 <Switch
                     label="Auto-Start Service"
                     {...form.getInputProps('autostart', { type: 'checkbox' })}
                 />  
-                <div className="flex-spacer"></div>
+                <Box className="flex-spacer" />
                 <SegmentedControl
                     data={[
                         { label: 'TCP', value: 'tcp' },
@@ -92,9 +92,9 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
                     ]}
                     {...form.getInputProps('proto')}
                 />
-            </div>      
+            </Box>      
 
-            <Group position="right" mt="md">
+            <Group align="right" mt="md">
                 <Button loading={submitLoading} type="submit">Add Service</Button>
             </Group>