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

Fixes

Browse Source
This commit is contained in:
DomySh
2022-07-22 00:34:57 +02:00
parent 1399d0e22d
commit d8dc5c9f8b
38 changed files with 112 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/Header/index.tsx
View File

@@ -1,7 +1,7 @@
import React, { useState } from 'react';
import { ActionIcon, Divider, Image, Menu, Tooltip, FloatingTooltip, MediaQuery, Burger, Space, Header } from '@mantine/core';
import style from "./index.module.scss";
import { errorNotify, gatmainpath, logout } from '../../js/utils';
import { errorNotify, getmainpath, logout } from '../../js/utils';
import { AiFillHome } from "react-icons/ai"
import { useNavigate } from 'react-router-dom';
import { FaLock } from 'react-icons/fa';
@@ -24,7 +24,7 @@ function HeaderPage({navOpen, setNav, ...other}: { navOpen: boolean, setNav:Reac
}
const go_to_home = () => {
navigator(`/${gatmainpath()}`)
navigator(`/${getmainpath()}`)
}
const [changePasswordModal, setChangePasswordModal] = useState(false);

11
frontend/src/components/MainLayout.tsx
View File

@@ -1,15 +1,24 @@
import React, { useState } from 'react';
import React, { useEffect, useState } from 'react';
import { Container, Space } from '@mantine/core';
import { AppShell } from '@mantine/core';
import NavBar from './NavBar';
import FooterPage from './Footer';
import HeaderPage from './Header';
import { getmainpath } from '../js/utils';
import { useLocation } from 'react-router-dom';
function MainLayout({ children }:{ children:any }) {
const [opened, setOpened] = useState(false);
const location = useLocation()
useEffect(()=>{
if (location.pathname !== "/"){
sessionStorage.setItem('home_section', getmainpath())
}
},[location.pathname])
return <>
<AppShell

4
frontend/src/components/NavBar/index.tsx
View File

@@ -3,7 +3,7 @@ import React from "react";
import { IoMdGitNetwork } from "react-icons/io";
import { MdTransform } from "react-icons/md";
import { useNavigate } from "react-router-dom";
import { gatmainpath } from "../../js/utils";
import { getmainpath } from "../../js/utils";
import { GrDirections } from "react-icons/gr";
function NavBarButton({ navigate, closeNav, name, icon, color, disabled }:
@@ -17,7 +17,7 @@ function NavBarButton({ navigate, closeNav, name, icon, color, disabled }:
borderRadius: theme.radius.sm,
opacity: disabled ? 0.4 : 1,
color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.black,
backgroundColor:(navigate===gatmainpath()?(theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0]):"transparent"),
backgroundColor:(navigate===getmainpath()?(theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0]):"transparent"),
'&:hover': {
backgroundColor:
theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],

3
frontend/src/components/RegexProxy/AddNewService.tsx
View File

@@ -1,7 +1,7 @@
import { Button, Group, NumberInput, Space, TextInput, Notification, Modal, Switch } from '@mantine/core';
import { useForm } from '@mantine/hooks';
import React, { useState } from 'react';
import { fireUpdateRequest, okNotify } from '../../js/utils';
import { okNotify } from '../../js/utils';
import { ImCross } from "react-icons/im"
import { regexproxy } from './utils';
@@ -45,7 +45,6 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
if (res.status === "ok"){
setSubmitLoading(false)
close();
fireUpdateRequest();
if (autostart) regexproxy.servicestart(res.id)
okNotify(`Service ${name} has been added`, `Successfully added ${res.id} with port ${port}`)
}else{

3
frontend/src/components/RegexProxy/ServiceRow/ChangePortModal.tsx
View File

@@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
import { ImCross } from "react-icons/im"
import { FaLongArrowAltDown } from 'react-icons/fa';
import { regexproxy, Service } from '../utils';
import { fireUpdateRequest, okNotify } from '../../../js/utils';
import { okNotify } from '../../../js/utils';
type InputForm = {
internalPort:number,
@@ -43,7 +43,6 @@ function ChangePortModal({ service, opened, onClose }:{ service:Service, opened:
if (!res){
setSubmitLoading(false)
close();
fireUpdateRequest();
okNotify(`Internal port on ${service.name} service has changed in ${data.internalPort}`, `Successfully changed internal port of service with id ${service.id}`)
}else{
setSubmitLoading(false)

3
frontend/src/components/RegexProxy/ServiceRow/RenameForm.tsx
View File

@@ -1,7 +1,7 @@
import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks';
import React, { useEffect, useState } from 'react';
import { fireUpdateRequest, okNotify } from '../../../js/utils';
import { okNotify } from '../../../js/utils';
import { ImCross } from "react-icons/im"
import { regexproxy, Service } from '../utils';
@@ -29,7 +29,6 @@ function RenameForm({ opened, onClose, service }:{ opened:boolean, onClose:()=>v
if (!res){
setSubmitLoading(false)
close();
fireUpdateRequest();
okNotify(`Service ${service.name} has been renamed in ${ name }`, `Successfully renamed service on port ${service.public_port}`)
}else{
setSubmitLoading(false)

2
frontend/src/components/RegexProxy/ServiceRow/ServiceRow.module.scss
View File

@@ -1,5 +1,5 @@
@use "../../index.scss" as *;
@use "../../../index.scss" as *;
.row{
width: 95%;

20
frontend/src/components/RegexProxy/ServiceRow/index.tsx
View File

@@ -4,7 +4,7 @@ import { FaPause, FaPlay, FaStop } from 'react-icons/fa';
import { MdOutlineArrowForwardIos } from "react-icons/md"
import style from "./ServiceRow.module.scss";
import YesNoModal from '../../YesNoModal';
import { errorNotify, fireUpdateRequest, okNotify } from '../../../js/utils';
import { errorNotify, okNotify } from '../../../js/utils';
import { BsArrowRepeat, BsTrashFill } from 'react-icons/bs';
import { TbNumbers } from 'react-icons/tb';
import { BiRename } from 'react-icons/bi'
@@ -36,7 +36,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
await regexproxy.servicestop(service.id).then(res => {
if(!res){
okNotify(`Service ${service.id} stopped successfully!`,`The service ${service.name} has been stopped!`)
fireUpdateRequest();
}else{
errorNotify(`An error as occurred during the stopping of the service ${service.id}`,`Error: ${res}`)
}
@@ -51,7 +50,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
await regexproxy.servicestart(service.id).then(res => {
if(!res){
okNotify(`Service ${service.id} started successfully!`,`The service ${service.name} has been started!`)
fireUpdateRequest();
}else{
errorNotify(`An error as occurred during the starting of the service ${service.id}`,`Error: ${res}`)
}
@@ -66,7 +64,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
await regexproxy.servicepause(service.id).then(res => {
if(!res){
okNotify(`Service ${service.id} paused successfully!`,`The service ${service.name} has been paused (Transparent mode)!`)
fireUpdateRequest();
}else{
errorNotify(`An error as occurred during the pausing of the service ${service.id}`,`Error: ${res}`)
}
@@ -81,7 +78,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
regexproxy.servicedelete(service.id).then(res => {
if (!res){
okNotify("Service delete complete!",`The service ${service.id} has been deleted!`)
fireUpdateRequest();
}else
errorNotify("An error occurred while deleting a service",`Error: ${res}`)
}).catch(err => {
@@ -94,7 +90,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
regexproxy.serviceregenport(service.id).then(res => {
if (!res){
okNotify("Service port regeneration completed!",`The service ${service.id} has changed the internal port!`)
fireUpdateRequest();
}else
errorNotify("An error occurred while changing the internal service port",`Error: ${res}`)
}).catch(err => {
@@ -108,14 +103,14 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
<MediaQuery smallerThan="md" styles={{ display: 'none' }}><div>
<div className="center-flex-row">
<div className="center-flex"><Title className={style.name}>{service.name}</Title> <Badge size="xl" gradient={{ from: 'indigo', to: 'cyan' }} variant="gradient">:{service.public_port}</Badge></div>
<Badge color={status_color} size="xl" radius="md">{service.internal_port} {"->"} {service.public_port}</Badge>
<Badge color={status_color} size="lg" radius="md">{service.internal_port} {"->"} {service.public_port}</Badge>
</div>
</div></MediaQuery>
<MediaQuery largerThan="md" styles={{ display: 'none' }}><div>
<div className="center-flex">
<div className="center-flex"><Title className={style.name}>{service.name}</Title> <Badge size="xl" gradient={{ from: 'indigo', to: 'cyan' }} variant="gradient">:{service.public_port}</Badge></div>
<Space w="xl" />
<Badge color={status_color} size="xl" radius="md">{service.internal_port} {"->"} {service.public_port}</Badge>
<Badge color={status_color} size="lg" radius="md">{service.internal_port} {"->"} {service.public_port}</Badge>
</div>
</div></MediaQuery>
@@ -133,9 +128,9 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
</MediaQuery>
<div className="center-flex-row">
<Badge style={{marginBottom:"20px"}} color={status_color} radius="sm" size="xl" variant="filled">Status: <u>{service.status}</u></Badge>
<Badge style={{marginBottom:"8px"}}color="violet" radius="sm" size="lg" variant="filled">Regex: {service.n_regex}</Badge>
<Badge color="yellow" radius="sm" size="lg" variant="filled">Connections Blocked: {service.n_packets}</Badge>
<Badge style={{marginBottom:"20px"}} color={status_color} radius="sm" size="lg" variant="filled">Status: <u>{service.status}</u></Badge>
<Badge style={{marginBottom:"8px"}}color="violet" radius="sm" size="md" variant="filled">Regex: {service.n_regex}</Badge>
<Badge color="yellow" radius="sm" size="md" variant="filled">Connections Blocked: {service.n_packets}</Badge>
</div>
<MediaQuery largerThan="md" styles={{ display: 'none' }}>
<div className='flex-spacer' />
@@ -170,8 +165,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
</Tooltip>:
<Tooltip label={service.status === "stop"?"Start in pause mode":"Pause service"} zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color={service.status === "stop"?"cyan":"red"}>
<ActionIcon color={service.status === "stop"?"cyan":"red"} loading={buttonLoading}
onClick={pauseService} size="xl" radius="md" variant="filled"
/*disabled={service.status === "stop"}*/>
onClick={pauseService} size="xl" radius="md" variant="filled">
<FaPause size="20px" />
</ActionIcon>
</Tooltip>