50 lines
2.3 KiB
TypeScript
50 lines
2.3 KiB
TypeScript
import { Button, Group, Space, Modal, Switch } from '@mantine/core';
|
|
import { useEffect, useState } from 'react';
|
|
import { errorNotify, okNotify } from '../../js/utils';
|
|
import { FirewallSettings, firewall } from '../../components/Firewall/utils';
|
|
|
|
export function SettingsModal({ opened, onClose }:{ opened:boolean, onClose:()=>void }) {
|
|
|
|
const [settings, setSettings] = useState<FirewallSettings>({keep_rules:false, allow_established:true, allow_loopback:true, allow_icmp:true})
|
|
|
|
useEffect(()=>{
|
|
firewall.settings().then( res => {
|
|
setSettings(res)
|
|
}).catch( err => {
|
|
errorNotify("Setting fetch failed!", err.toString())
|
|
onClose()
|
|
})
|
|
},[])
|
|
|
|
const [submitLoading, setSubmitLoading] = useState(false)
|
|
|
|
const submitRequest = () =>{
|
|
setSubmitLoading(true)
|
|
firewall.setsettings(settings).then( () => {
|
|
okNotify("Settings updated!", "Settings updated successfully")
|
|
setSubmitLoading(false)
|
|
onClose()
|
|
}).catch( err => {
|
|
errorNotify("Settings update failed!", err.toString())
|
|
setSubmitLoading(false)
|
|
})
|
|
}
|
|
|
|
|
|
return <Modal size="xl" title="Change firewall settings" opened={opened} onClose={onClose} closeOnClickOutside={false} centered>
|
|
|
|
<Switch label="Keep rules on firegex shutdown" checked={settings.keep_rules} onChange={v => setSettings({...settings, keep_rules:v.target.checked})}/>
|
|
<Space h="md" />
|
|
<Switch label="Allow loopback to communicate with itself" checked={settings.allow_loopback} onChange={v => setSettings({...settings, allow_loopback:v.target.checked})}/>
|
|
<Space h="md" />
|
|
<Switch label="Allow established connection (essential to allow opening connection) (Dangerous to disable)" checked={settings.allow_established} onChange={v => setSettings({...settings, allow_established:v.target.checked})}/>
|
|
<Space h="md" />
|
|
<Switch label="Allow icmp packets" checked={settings.allow_icmp} onChange={v => setSettings({...settings, allow_icmp:v.target.checked})}/>
|
|
|
|
<Group position="right" mt="md">
|
|
<Button loading={submitLoading} onClick={submitRequest}>Save Setting</Button>
|
|
</Group>
|
|
</Modal>
|
|
|
|
}
|