0xb00b5/firegex-traffic-viewer
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Moduled Firegex, Merging pt2 (to finish and test)

Browse Source
This commit is contained in:
DomySh
2022-07-21 21:17:06 +02:00
parent 63ba0e94e7
commit 1399d0e22d
23 changed files with 177 additions and 391 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/pages/NFRegex.tsx/ServiceDetails.tsx
View File

@@ -1,13 +1,14 @@
import { ActionIcon, Grid, LoadingOverlay, Space, Title, Tooltip } from '@mantine/core';
import React, { useEffect, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import RegexView from '../../components/NFRegex/RegexView';
import RegexView from '../../components/RegexView';
import ServiceRow from '../../components/NFRegex/ServiceRow';
import AddNewRegex from '../../components/NFRegex/AddNewRegex';
import AddNewRegex from '../../components/AddNewRegex';
import { BsPlusLg } from "react-icons/bs";
import { nfregex, RegexFilter, Service } from '../../components/NFRegex/utils';
import { nfregex, Service } from '../../components/NFRegex/utils';
import { errorNotify, eventUpdateName, fireUpdateRequest } from '../../js/utils';
import { useWindowEvent } from '@mantine/hooks';
import { RegexFilter } from '../../js/models';
function ServiceDetails() {
const {srv} = useParams()

2
frontend/src/pages/NFRegex.tsx/index.tsx
View File

@@ -7,7 +7,7 @@ import { GeneralStats, nfregex, Service } from '../../components/NFRegex/utils';
import { errorNotify, eventUpdateName, fireUpdateRequest } from '../../js/utils';
import AddNewService from '../../components/NFRegex/AddNewService';
import { useWindowEvent } from '@mantine/hooks';
import AddNewRegex from '../../components/NFRegex/AddNewRegex';
import AddNewRegex from '../../components/AddNewRegex';
function NFRegex({ children }: { children: any }) {

53
frontend/src/pages/RegexProxy/HomePage.tsx
View File

@@ -1,53 +0,0 @@
import { ActionIcon, LoadingOverlay, Space, Title, Tooltip } from '@mantine/core';
import React, { useEffect, useState } from 'react';
import { BsPlusLg } from "react-icons/bs";
import { useNavigate } from 'react-router-dom';
import ServiceRow from '../components/ServiceRow';
import { Service } from '../js/models';
import { errorNotify, eventUpdateName, fireUpdateRequest, servicelist } from '../js/utils';
import AddNewService from '../components/AddNewService';
import { useWindowEvent } from '@mantine/hooks';
function HomePage() {
const [services, setServices] = useState<Service[]>([]);
const [loader, setLoader] = useState(true);
const navigator = useNavigate()
const [open, setOpen] = useState(false);
const [tooltipAddServOpened, setTooltipAddServOpened] = useState(false);
const updateInfo = async () => {
await servicelist().then(res => {
setServices(res)
}).catch(err => {
errorNotify("Home Page Auto-Update failed!", err.toString())
})
setLoader(false)
}
useWindowEvent(eventUpdateName, updateInfo)
useEffect(fireUpdateRequest,[])
const closeModal = () => {setOpen(false);}
return <div id="service-list" className="center-flex-row">
<LoadingOverlay visible={loader} />
{services.length > 0?services.map( srv => <ServiceRow service={srv} key={srv.id} onClick={()=>{
navigator("/"+srv.id)
}} />):<><Space h="xl"/> <Title className='center-flex' align='center' order={3}>No services found! Add one clicking the "+" buttons</Title>
<Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'>
<Tooltip label="Add a new service" transition="pop" transitionDuration={200} /*openDelay={500}*/ zIndex={0} transitionTimingFunction="ease" color="blue" opened={tooltipAddServOpened} tooltipId="tooltip-addServ-id">
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
aria-describedby="tooltip-addSrv-id"
onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)}
onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon>
</Tooltip>
</div>
</>}
<AddNewService opened={open} onClose={closeModal} />
</div>
}
export default HomePage;

15
frontend/src/pages/RegexProxy/ServiceDetails.tsx
View File

@@ -1,13 +1,14 @@
import { ActionIcon, Grid, LoadingOverlay, Space, Title, Tooltip } from '@mantine/core';
import React, { useEffect, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import RegexView from '../components/RegexView';
import ServiceRow from '../components/ServiceRow';
import AddNewRegex from '../components/AddNewRegex';
import { BsPlusLg } from "react-icons/bs";
import { RegexFilter, Service } from '../js/models';
import { errorNotify, eventUpdateName, fireUpdateRequest, serviceinfo, serviceregexlist } from '../js/utils';
import { useWindowEvent } from '@mantine/hooks';
import { regexproxy, Service } from '../../components/RegexProxy/utils';
import { RegexFilter } from '../../js/models';
import { errorNotify, eventUpdateName, fireUpdateRequest } from '../../js/utils';
import ServiceRow from '../../components/RegexProxy/ServiceRow';
import AddNewRegex from '../../components/AddNewRegex';
import RegexView from '../../components/RegexView';
function ServiceDetails() {
const {srv_id} = useParams()
@@ -30,7 +31,7 @@ function ServiceDetails() {
const updateInfo = async () => {
if (!srv_id) return
let error = false;
await serviceinfo(srv_id).then(res => {
await regexproxy.serviceinfo(srv_id).then(res => {
setServiceInfo(res)
}).catch(
err =>{
@@ -38,7 +39,7 @@ function ServiceDetails() {
navigator("/")
})
if (error) return
await serviceregexlist(srv_id).then(res => {
await regexproxy.serviceregexes(srv_id).then(res => {
setRegexesList(res)
}).catch(
err => errorNotify(`Updater for ${srv_id} service failed [Regex list]!`, err.toString())

97
frontend/src/pages/RegexProxy/index.tsx Executable file
View File

@@ -0,0 +1,97 @@
import { ActionIcon, Badge, LoadingOverlay, Space, Title, Tooltip } from '@mantine/core';
import React, { useEffect, useState } from 'react';
import { BsPlusLg } from "react-icons/bs";
import { useNavigate, useParams } from 'react-router-dom';
import ServiceRow from '../../components/RegexProxy/ServiceRow';
import { GeneralStats, regexproxy, Service } from '../../components/RegexProxy/utils';
import { errorNotify, eventUpdateName, fireUpdateRequest } from '../../js/utils';
import AddNewService from '../../components/RegexProxy/AddNewService';
import { useWindowEvent } from '@mantine/hooks';
import AddNewRegex from '../../components/AddNewRegex';
function RegexProxy({ children }: { children: any }) {
const [services, setServices] = useState<Service[]>([]);
const [loader, setLoader] = useState(true);
const navigator = useNavigate()
const [open, setOpen] = useState(false);
const {srv} = useParams()
const [tooltipAddServOpened, setTooltipAddServOpened] = useState(false);
const [tooltipAddOpened, setTooltipAddOpened] = useState(false);
const [generalStats, setGeneralStats] = useState<GeneralStats>({closed:0, regexes:0, services:0});
const updateInfo = async () => {
await Promise.all([
regexproxy.stats().then(res => {
setGeneralStats(res)
}).catch(
err => errorNotify("General Info Auto-Update failed!", err.toString())
),
regexproxy.services().then(res => {
setServices(res)
}).catch(err => {
errorNotify("Home Page Auto-Update failed!", err.toString())
})
])
setLoader(false)
}
useWindowEvent(eventUpdateName, updateInfo)
useEffect(fireUpdateRequest,[])
const closeModal = () => {setOpen(false);}
return <>
<Space h="sm" />
<div className='center-flex'>
<Title order={4}>Netfilter Regex</Title>
<div className='flex-spacer' />
<Badge size="sm" color="green" variant="filled">Services: {generalStats.services}</Badge>
<Space w="xs" />
<Badge size="sm" color="yellow" variant="filled">Filtered Connections: {generalStats.closed}</Badge>
<Space w="xs" />
<Badge size="sm" color="violet" variant="filled">Regexes: {generalStats.regexes}</Badge>
<Space w="xs" />
{ srv?
<Tooltip label="Add a new regex" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
</Tooltip>
: <Tooltip label="Add a new service" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
</Tooltip>
}
</div>
<div id="service-list" className="center-flex-row">
{srv?null:<>
<LoadingOverlay visible={loader} />
{services.length > 0?services.map( srv => <ServiceRow service={srv} key={srv.id} onClick={()=>{
navigator("/regexproxy/"+srv.id)
}} />):<><Space h="xl"/> <Title className='center-flex' align='center' order={3}>No services found! Add one clicking the "+" buttons</Title>
<Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'>
<Tooltip label="Add a new service" transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddServOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)}
onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon>
</Tooltip>
</div>
</>}
<AddNewService opened={open} onClose={closeModal} />
</>}
</div>
{srv?children:null}
{srv?
<AddNewRegex opened={open} onClose={closeModal} service={srv} />:
<AddNewService opened={open} onClose={closeModal} />
}
</>
}
export default RegexProxy;