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

mantine update + passed to vite

Browse Source
This commit is contained in:
Domingo Dirutigliano
2023-06-05 00:55:38 +02:00
parent cef573b537
commit 0430cb3773
37 changed files with 740 additions and 8234 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.gitignore vendored
View File

@@ -16,6 +16,8 @@
/backend/db/** /backend/db/**
/frontend/build/ /frontend/build/
/frontend/build/** /frontend/build/**
/frontend/dist/
/frontend/dist/**
/backend/modules/cppqueue /backend/modules/cppqueue
/backend/modules/proxy /backend/modules/proxy
docker-compose.yml docker-compose.yml
@@ -39,4 +41,4 @@ docker-compose.yml
**/*.rs.bk **/*.rs.bk
# MSVC Windows builds of rustc generate these, which store debugging information # MSVC Windows builds of rustc generate these, which store debugging information
**/*.pdb **/*.pdb

2
Dockerfile
View File

@@ -33,7 +33,7 @@ RUN g++ binsrc/nfqueue.cpp -o modules/cppqueue -O3 -lnetfilter_queue -pthread -l
RUN g++ binsrc/proxy.cpp -o modules/proxy -O3 -pthread -lboost_system -lboost_thread -lpcre2-8 RUN g++ binsrc/proxy.cpp -o modules/proxy -O3 -pthread -lboost_system -lboost_thread -lpcre2-8
COPY ./backend/ /execute/ COPY ./backend/ /execute/
COPY --from=frontend /app/build/ ./frontend/ COPY --from=frontend /app/dist/ ./frontend/
CMD ["/bin/sh", "/execute/docker-entrypoint.sh"] CMD ["/bin/sh", "/execute/docker-entrypoint.sh"]

2
README.md
View File

@@ -1,4 +1,6 @@
# 2.2.0 VERSION NEW TO IMPLEMENT # 2.2.0 VERSION NEW TO IMPLEMENT
- TODO: Need to fix mantine form validation
- TODO: Merge edits in the main branch to this branch
1. PCRE2 ---> HyperScan Streams (VectorScan for arm64 compatibility using debian Bookworm) 1. PCRE2 ---> HyperScan Streams (VectorScan for arm64 compatibility using debian Bookworm)
2. nfregex from c++ to rust 2. nfregex from c++ to rust
- https://crates.io/crates/hyperscan - https://crates.io/crates/hyperscan

5
frontend/globals.d.ts vendored
View File

@@ -1,5 +0,0 @@
// declaration.d.ts
declare module '*.scss' {
const content: Record<string, string>;
export default content;
}

1
frontend/public/index.html → frontend/index.html
View File

@@ -18,5 +18,6 @@
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body> </body>
</html> </html>

34
frontend/package.json
View File

@@ -3,18 +3,20 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@mantine/core": "^4.2.8", "@emotion/react": "^11.11.0",
"@mantine/form": "^4.2.8", "@mantine/core": "^6.0.13",
"@mantine/hooks": "^4.2.8", "@mantine/form": "^6.0.13",
"@mantine/modals": "^4.2.8", "@mantine/hooks": "^6.0.13",
"@mantine/notifications": "^4.2.8", "@mantine/modals": "^6.0.13",
"@mantine/prism": "^4.2.8", "@mantine/notifications": "^6.0.13",
"@mantine/spotlight": "^4.2.8", "@mantine/prism": "^6.0.13",
"@mantine/spotlight": "^6.0.13",
"@testing-library/dom": "^9.3.0",
"@testing-library/jest-dom": "^5.16.4", "@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0", "@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/node": "^16.11.39", "@types/node": "^20.2.5",
"@types/react": "^18.0.12", "@types/react": "^18.0.12",
"@types/react-dom": "^18.0.5", "@types/react-dom": "^18.0.5",
"buffer": "^6.0.3", "buffer": "^6.0.3",
@@ -22,17 +24,15 @@
"react-dom": "^18.1.0", "react-dom": "^18.1.0",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"react-scripts": "5.0.1", "sass": "^1.62.1",
"sass": "^1.52.3",
"socket.io-client": "^4.5.1", "socket.io-client": "^4.5.1",
"typescript": "^4.7.3", "typescript": "^4.7.3",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
"start": "BROWSER=none react-scripts start", "start": "vite",
"build": "react-scripts build", "build": "tsc && vite build",
"test": "react-scripts test", "serve": "vite preview"
"eject": "react-scripts eject"
}, },
"eslintConfig": { "eslintConfig": {
"extends": [ "extends": [
@@ -51,5 +51,11 @@
"last 1 firefox version", "last 1 firefox version",
"last 1 safari version" "last 1 safari version"
] ]
},
"devDependencies": {
"@vitejs/plugin-react": "^4.0.0",
"vite": "^4.3.9",
"vite-plugin-svgr": "^3.2.0",
"vite-tsconfig-paths": "^4.2.0"
} }
} }

4
frontend/src/App.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Loader, LoadingOverlay, Notification, Space, PasswordInput, Title } from '@mantine/core'; import { Button, Group, Loader, LoadingOverlay, Notification, Space, PasswordInput, Title } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { ImCross } from 'react-icons/im'; import { ImCross } from 'react-icons/im';
import { Outlet, Route, Routes } from 'react-router-dom'; import { Outlet, Route, Routes } from 'react-router-dom';
@@ -59,7 +59,7 @@ function App() {
initialValues: { initialValues: {
password:"", password:"",
}, },
validationRules:{ validate:{
password: (value) => value !== "" password: (value) => value !== ""
} }
}) })

4
frontend/src/components/AddNewRegex.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Switch, NativeSelect, Modal } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Switch, NativeSelect, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { RegexAddForm } from '../js/models'; import { RegexAddForm } from '../js/models';
import { b64decode, b64encode, getapiobject, okNotify } from '../js/utils'; import { b64decode, b64encode, getapiobject, okNotify } from '../js/utils';
@@ -24,7 +24,7 @@ function AddNewRegex({ opened, onClose, service }:{ opened:boolean, onClose:()=>
is_case_insensitive:false, is_case_insensitive:false,
deactive:false deactive:false
}, },
validationRules:{ validate:{
regex: (value) => value !== "", regex: (value) => value !== "",
type: (value) => ["blacklist","whitelist"].includes(value), type: (value) => ["blacklist","whitelist"].includes(value),
mode: (value) => ['C -> S', 'S -> C', 'C <-> S'].includes(value) mode: (value) => ['C -> S', 'S -> C', 'C <-> S'].includes(value)

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

@@ -1,5 +1,5 @@
import { Button, Group, Modal, Notification, Space, Switch, Text } from "@mantine/core"; import { Button, Group, Modal, Notification, Space, Switch, Text } from "@mantine/core";
import { useForm } from "@mantine/hooks"; import { useForm } from "@mantine/form";
import React, { useState } from "react" import React, { useState } from "react"
import { ImCross } from "react-icons/im"; import { ImCross } from "react-icons/im";
import { okNotify, resetfiregex } from "../../js/utils"; import { okNotify, resetfiregex } from "../../js/utils";
@@ -61,4 +61,4 @@ function ResetModal({ opened, onClose }:{ opened: boolean, onClose: () => void }
} }
export default ResetModal; export default ResetModal;

6
frontend/src/components/Header/ResetPasswordModal.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Modal, Notification, PasswordInput, Space, Switch } from "@mantine/core"; import { Button, Group, Modal, Notification, PasswordInput, Space, Switch } from "@mantine/core";
import { useForm } from "@mantine/hooks"; import { useForm } from "@mantine/form";
import React, { useState } from "react" import React, { useState } from "react"
import { ImCross } from "react-icons/im"; import { ImCross } from "react-icons/im";
import { ChangePassword } from "../../js/models"; import { ChangePassword } from "../../js/models";
@@ -11,7 +11,7 @@ function ResetPasswordModal({ opened, onClose }:{ opened: boolean, onClose: () =
password:"", password:"",
expire:true expire:true
}, },
validationRules:{ validate:{
password: (value) => value !== "" password: (value) => value !== ""
} }
}) })
@@ -59,4 +59,4 @@ function ResetPasswordModal({ opened, onClose }:{ opened: boolean, onClose: () =
} }
export default ResetPasswordModal; export default ResetPasswordModal;

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

@@ -1,5 +1,5 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { ActionIcon, Divider, Image, Menu, Tooltip, FloatingTooltip, MediaQuery, Burger, Space, Header } from '@mantine/core'; import { ActionIcon, Divider, Image, Menu, Tooltip, MediaQuery, Burger, Space, Header } from '@mantine/core';
import style from "./index.module.scss"; import style from "./index.module.scss";
import { errorNotify, getmainpath, logout } from '../../js/utils'; import { errorNotify, getmainpath, logout } from '../../js/utils';
import { AiFillHome } from "react-icons/ai" import { AiFillHome } from "react-icons/ai"
@@ -44,9 +44,9 @@ function HeaderPage({navOpen, setNav, ...other}: { navOpen: boolean, setNav:Reac
/> />
</div></MediaQuery> </div></MediaQuery>
<div className={style.divlogo}> <div className={style.divlogo}>
<FloatingTooltip zIndex={0} label="Home" transition="pop" transitionDuration={200} openDelay={1000} transitionTimingFunction="ease" color="dark" position="right" > <Tooltip zIndex={0} label="Home" openDelay={1000}color="dark" position="right" >
<Image src="/header-logo.png" alt="Firegex logo" onClick={()=>navigator("/")}/> <Image src="/header-logo.png" alt="Firegex logo" onClick={()=>navigator("/")}/>
</FloatingTooltip> </Tooltip>
</div> </div>
<div className="flex-spacer" /> <div className="flex-spacer" />
@@ -61,7 +61,7 @@ function HeaderPage({navOpen, setNav, ...other}: { navOpen: boolean, setNav:Reac
</Menu> </Menu>
<Space w="md" /> <Space w="md" />
<Tooltip label="Home" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="teal" opened={tooltipHomeOpened} tooltipId="tooltip-home-id"> <Tooltip label="Home" position='bottom' color="teal" opened={tooltipHomeOpened}>
<ActionIcon color="teal" style={{marginRight:"10px"}} <ActionIcon color="teal" style={{marginRight:"10px"}}
size="xl" radius="md" variant="filled" size="xl" radius="md" variant="filled"
onClick={go_to_home} onClick={go_to_home}
@@ -70,7 +70,7 @@ function HeaderPage({navOpen, setNav, ...other}: { navOpen: boolean, setNav:Reac
<AiFillHome size="25px" /> <AiFillHome size="25px" />
</ActionIcon> </ActionIcon>
</Tooltip> </Tooltip>
<Tooltip label="Logout" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipLogoutOpened} tooltipId="tooltip-add-id"> <Tooltip label="Logout" position='bottom' color="blue" opened={tooltipLogoutOpened}>
<ActionIcon color="blue" onClick={logout_action} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={logout_action} size="xl" radius="md" variant="filled"
onFocus={() => setTooltipLogoutOpened(false)} onBlur={() => setTooltipLogoutOpened(false)} onFocus={() => setTooltipLogoutOpened(false)} onBlur={() => setTooltipLogoutOpened(false)}
onMouseEnter={() => setTooltipLogoutOpened(true)} onMouseLeave={() => setTooltipLogoutOpened(false)}><ImExit size={23} style={{marginTop:"3px", marginLeft:"2px"}}/></ActionIcon> onMouseEnter={() => setTooltipLogoutOpened(true)} onMouseLeave={() => setTooltipLogoutOpened(false)}><ImExit size={23} style={{marginTop:"3px", marginLeft:"2px"}}/></ActionIcon>

4
frontend/src/components/NFRegex/AddNewService.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { okNotify, regex_ipv4, regex_ipv6 } from '../../js/utils'; import { okNotify, regex_ipv4, regex_ipv6 } from '../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -24,7 +24,7 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
proto:"tcp", proto:"tcp",
autostart: true autostart: true
}, },
validationRules:{ validate:{
name: (value) => value !== ""?true:false, name: (value) => value !== ""?true:false,
port: (value) => value>0 && value<65536, port: (value) => value>0 && value<65536,
proto: (value) => ["tcp","udp"].includes(value), proto: (value) => ["tcp","udp"].includes(value),

4
frontend/src/components/NFRegex/ServiceRow/RenameForm.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { okNotify } from '../../../js/utils'; import { okNotify } from '../../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -9,7 +9,7 @@ function RenameForm({ opened, onClose, service }:{ opened:boolean, onClose:()=>v
const form = useForm({ const form = useForm({
initialValues: { name:service.name }, initialValues: { name:service.name },
validationRules:{ name: (value) => value !== "" } validate:{ name: (value) => value !== "" }
}) })
const close = () =>{ const close = () =>{

4
frontend/src/components/NFRegex/ServiceRow/index.tsx
View File

@@ -116,7 +116,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
<Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item> <Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item>
</Menu> </Menu>
<Space w="md"/> <Space w="md"/>
<Tooltip label="Stop service" zIndex={0} transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="red" opened={tooltipStopOpened} tooltipId="tooltip-stop-id"> <Tooltip label="Stop service" zIndex={0} color="red" opened={tooltipStopOpened}>
<ActionIcon color="red" loading={buttonLoading} <ActionIcon color="red" loading={buttonLoading}
onClick={stopService} size="xl" radius="md" variant="filled" onClick={stopService} size="xl" radius="md" variant="filled"
disabled={service.status === "stop"} disabled={service.status === "stop"}
@@ -127,7 +127,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
</ActionIcon> </ActionIcon>
</Tooltip> </Tooltip>
<Space w="md"/> <Space w="md"/>
<Tooltip label="Start service" transition="pop" zIndex={0} transitionDuration={200} transitionTimingFunction="ease" color="teal"> <Tooltip label="Start service" zIndex={0} color="teal">
<ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading} <ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading}
variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}> variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}>
<FaPlay size="20px" /> <FaPlay size="20px" />

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

@@ -46,4 +46,4 @@ export default function NavBar({ closeNav, opened }: {closeNav: () => void, open
</Navbar.Section> </Navbar.Section>
</Navbar> </Navbar>
} }

5
frontend/src/components/PortAndInterface.tsx
View File

@@ -1,9 +1,8 @@
import { Autocomplete, AutocompleteItem, Space, Title } from "@mantine/core" import { Autocomplete, AutocompleteItem, Space, Title } from "@mantine/core"
import { UseForm } from "@mantine/hooks/lib/use-form/use-form";
import React, { useEffect, useState } from "react" import React, { useEffect, useState } from "react"
import { getipinterfaces } from "../js/utils"; import { getipinterfaces } from "../js/utils";
import PortInput from "./PortInput"; import PortInput from "./PortInput";
import { UseFormReturnType } from "@mantine/form/lib/types";
interface ItemProps extends AutocompleteItem { interface ItemProps extends AutocompleteItem {
label: string; label: string;
@@ -16,7 +15,7 @@ const AutoCompleteItem = React.forwardRef<HTMLDivElement, ItemProps>(
); );
export default function PortAndInterface({ form, int_name, port_name, label }:{ form:UseForm<any>, int_name:string, port_name:string, label?:string }) { export default function PortAndInterface({ form, int_name, port_name, label }:{ form:UseFormReturnType<any>, int_name:string, port_name:string, label?:string }) {
const [ipInterfaces, setIpInterfaces] = useState<AutocompleteItem[]>([]); const [ipInterfaces, setIpInterfaces] = useState<AutocompleteItem[]>([]);

4
frontend/src/components/PortHijack/AddNewService.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal, Switch, SegmentedControl } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { okNotify, regex_ipv6_no_cidr, regex_ipv4_no_cidr } from '../../js/utils'; import { okNotify, regex_ipv6_no_cidr, regex_ipv4_no_cidr } from '../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -28,7 +28,7 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
ip_dst:"127.0.0.1", ip_dst:"127.0.0.1",
autostart: false, autostart: false,
}, },
validationRules:{ validate:{
name: (value) => value !== ""?true:false, name: (value) => value !== ""?true:false,
public_port: (value) => value>0 && value<65536, public_port: (value) => value>0 && value<65536,
proxy_port: (value) => value>0 && value<65536, proxy_port: (value) => value>0 && value<65536,

4
frontend/src/components/PortHijack/ServiceRow/ChangeDestination.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, Notification, Modal } from '@mantine/core'; import { Button, Group, Space, Notification, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { okNotify, regex_ipv4_no_cidr, regex_ipv6_no_cidr } from '../../../js/utils'; import { okNotify, regex_ipv4_no_cidr, regex_ipv6_no_cidr } from '../../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -13,7 +13,7 @@ function ChangeDestination({ opened, onClose, service }:{ opened:boolean, onClos
ip_dst:service.ip_dst, ip_dst:service.ip_dst,
proxy_port:service.proxy_port proxy_port:service.proxy_port
}, },
validationRules:{ validate:{
proxy_port: (value) => value>0 && value<65536, proxy_port: (value) => value>0 && value<65536,
ip_dst: (value) => value.match(regex_ipv6_no_cidr)?true:false || value.match(regex_ipv4_no_cidr)?true:false ip_dst: (value) => value.match(regex_ipv6_no_cidr)?true:false || value.match(regex_ipv4_no_cidr)?true:false
} }

4
frontend/src/components/PortHijack/ServiceRow/RenameForm.tsx
View File

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { okNotify } from '../../../js/utils'; import { okNotify } from '../../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -9,7 +9,7 @@ function RenameForm({ opened, onClose, service }:{ opened:boolean, onClose:()=>v
const form = useForm({ const form = useForm({
initialValues: { name:service.name }, initialValues: { name:service.name },
validationRules:{ name: (value) => value !== "" } validate:{ name: (value) => value !== "" }
}) })
const close = () =>{ const close = () =>{

8
frontend/src/components/PortHijack/ServiceRow/index.tsx
View File

@@ -10,7 +10,7 @@ import { BiRename } from 'react-icons/bi'
import RenameForm from './RenameForm'; import RenameForm from './RenameForm';
import ChangeDestination from './ChangeDestination'; import ChangeDestination from './ChangeDestination';
import PortInput from '../../PortInput'; import PortInput from '../../PortInput';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
function ServiceRow({ service }:{ service:Service }) { function ServiceRow({ service }:{ service:Service }) {
@@ -25,7 +25,7 @@ function ServiceRow({ service }:{ service:Service }) {
const form = useForm({ const form = useForm({
initialValues: { proxy_port:service.proxy_port }, initialValues: { proxy_port:service.proxy_port },
validationRules:{ proxy_port: (value) => value > 0 && value < 65536 } validate:{ proxy_port: (value) => value > 0 && value < 65536 }
}) })
const onChangeProxyPort = ({proxy_port}:{proxy_port:number}) => { const onChangeProxyPort = ({proxy_port}:{proxy_port:number}) => {
@@ -142,7 +142,7 @@ function ServiceRow({ service }:{ service:Service }) {
<Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item> <Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item>
</Menu> </Menu>
<Space w="md"/> <Space w="md"/>
<Tooltip label="Stop service" zIndex={0} transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="red" opened={tooltipStopOpened} tooltipId="tooltip-stop-id"> <Tooltip label="Stop service" zIndex={0} color="red" opened={tooltipStopOpened}>
<ActionIcon color="red" loading={buttonLoading} <ActionIcon color="red" loading={buttonLoading}
onClick={stopService} size="xl" radius="md" variant="filled" onClick={stopService} size="xl" radius="md" variant="filled"
disabled={!service.active} disabled={!service.active}
@@ -153,7 +153,7 @@ function ServiceRow({ service }:{ service:Service }) {
</ActionIcon> </ActionIcon>
</Tooltip> </Tooltip>
<Space w="md"/> <Space w="md"/>
<Tooltip label="Start service" transition="pop" zIndex={0} transitionDuration={200} transitionTimingFunction="ease" color="teal"> <Tooltip label="Start service" zIndex={0} color="teal">
<ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading} <ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading}
variant="filled" disabled={service.active}> variant="filled" disabled={service.active}>
<FaPlay size="20px" /> <FaPlay size="20px" />

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

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal, Switch } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal, Switch } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { okNotify } from '../../js/utils'; import { okNotify } from '../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -24,7 +24,7 @@ function AddNewService({ opened, onClose }:{ opened:boolean, onClose:()=>void })
chosenInternalPort:false, chosenInternalPort:false,
autostart: true autostart: true
}, },
validationRules:{ validate:{
name: (value) => value !== ""?true:false, name: (value) => value !== ""?true:false,
port: (value) => value>0 && value<65536, port: (value) => value>0 && value<65536,
internalPort: (value) => value>0 && value<65536, internalPort: (value) => value>0 && value<65536,

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

@@ -1,5 +1,5 @@
import { Button, Group, Space, Notification, Modal, Center, Title } from '@mantine/core'; import { Button, Group, Space, Notification, Modal, Center, Title } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
import { FaLongArrowAltDown } from 'react-icons/fa'; import { FaLongArrowAltDown } from 'react-icons/fa';
@@ -19,7 +19,7 @@ function ChangePortModal({ service, opened, onClose }:{ service:Service, opened:
internalPort: service.internal_port, internalPort: service.internal_port,
port: service.public_port port: service.public_port
}, },
validationRules:{ validate:{
internalPort: (value) => value>0 && value<65536, internalPort: (value) => value>0 && value<65536,
port: (value) => value>0 && value<65536 port: (value) => value>0 && value<65536
} }

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

@@ -1,5 +1,5 @@
import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core'; import { Button, Group, Space, TextInput, Notification, Modal } from '@mantine/core';
import { useForm } from '@mantine/hooks'; import { useForm } from '@mantine/form';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { okNotify } from '../../../js/utils'; import { okNotify } from '../../../js/utils';
import { ImCross } from "react-icons/im" import { ImCross } from "react-icons/im"
@@ -9,7 +9,7 @@ function RenameForm({ opened, onClose, service }:{ opened:boolean, onClose:()=>v
const form = useForm({ const form = useForm({
initialValues: { name:service.name }, initialValues: { name:service.name },
validationRules:{ name: (value) => value !== "" } validate:{ name: (value) => value !== "" }
}) })
const close = () =>{ const close = () =>{
@@ -65,4 +65,4 @@ function RenameForm({ opened, onClose, service }:{ opened:boolean, onClose:()=>v
} }
export default RenameForm; export default RenameForm;

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

@@ -153,7 +153,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
<Space w="md"/> <Space w="md"/>
{["pause","wait"].includes(service.status)? {["pause","wait"].includes(service.status)?
<Tooltip label="Stop service" zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="orange" opened={tooltipStopOpened} tooltipId="tooltip-stop-id"> <Tooltip label="Stop service" zIndex={0} color="orange" opened={tooltipStopOpened}>
<ActionIcon color="yellow" loading={buttonLoading} <ActionIcon color="yellow" loading={buttonLoading}
onClick={()=>setStopModal(true)} size="xl" radius="md" variant="filled" onClick={()=>setStopModal(true)} size="xl" radius="md" variant="filled"
disabled={service.status === "stop"} disabled={service.status === "stop"}
@@ -163,7 +163,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
<FaStop size="20px" /> <FaStop size="20px" />
</ActionIcon> </ActionIcon>
</Tooltip>: </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"}> <Tooltip label={service.status === "stop"?"Start in pause mode":"Pause service"} zIndex={0} color={service.status === "stop"?"cyan":"red"}>
<ActionIcon color={service.status === "stop"?"cyan":"red"} loading={buttonLoading} <ActionIcon color={service.status === "stop"?"cyan":"red"} loading={buttonLoading}
onClick={pauseService} size="xl" radius="md" variant="filled"> onClick={pauseService} size="xl" radius="md" variant="filled">
<FaPause size="20px" /> <FaPause size="20px" />
@@ -172,7 +172,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
} }
<Space w="md"/> <Space w="md"/>
<Tooltip label="Start service" transition="pop" zIndex={0} transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="teal"> <Tooltip label="Start service" zIndex={0} color="teal">
<ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading} <ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading}
variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}> variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}>
<FaPlay size="20px" /> <FaPlay size="20px" />

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

@@ -51,14 +51,14 @@ function RegexView({ regexInfo }:{ regexInfo:RegexFilter }) {
</Grid.Col> </Grid.Col>
<Grid.Col span={2} className='center-flex'> <Grid.Col span={2} className='center-flex'>
<Space w="xs" /> <Space w="xs" />
<Tooltip label={regexInfo.active?"Deactivate":"Activate"} zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color={regexInfo.active?"orange":"teal"} opened={statusTooltipOpened}> <Tooltip label={regexInfo.active?"Deactivate":"Activate"} zIndex={0} color={regexInfo.active?"orange":"teal"} opened={statusTooltipOpened}>
<ActionIcon color={regexInfo.active?"orange":"teal"} onClick={changeRegexStatus} size="xl" radius="md" variant="filled" <ActionIcon color={regexInfo.active?"orange":"teal"} onClick={changeRegexStatus} size="xl" radius="md" variant="filled"
onFocus={() => setStatusTooltipOpened(false)} onBlur={() => setStatusTooltipOpened(false)} onFocus={() => setStatusTooltipOpened(false)} onBlur={() => setStatusTooltipOpened(false)}
onMouseEnter={() => setStatusTooltipOpened(true)} onMouseLeave={() => setStatusTooltipOpened(false)} onMouseEnter={() => setStatusTooltipOpened(true)} onMouseLeave={() => setStatusTooltipOpened(false)}
>{regexInfo.active?<FaPause size="20px" />:<FaPlay size="20px" />}</ActionIcon> >{regexInfo.active?<FaPause size="20px" />:<FaPlay size="20px" />}</ActionIcon>
</Tooltip> </Tooltip>
<Space w="xs" /> <Space w="xs" />
<Tooltip label="Delete regex" zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="red" opened={deleteTooltipOpened} > <Tooltip label="Delete regex" zIndex={0} color="red" opened={deleteTooltipOpened} >
<ActionIcon color="red" onClick={()=>setDeleteModal(true)} size="xl" radius="md" variant="filled" <ActionIcon color="red" onClick={()=>setDeleteModal(true)} size="xl" radius="md" variant="filled"
onFocus={() => setDeleteTooltipOpened(false)} onBlur={() => setDeleteTooltipOpened(false)} onFocus={() => setDeleteTooltipOpened(false)} onBlur={() => setDeleteTooltipOpened(false)}
onMouseEnter={() => setDeleteTooltipOpened(true)} onMouseLeave={() => setDeleteTooltipOpened(false)} onMouseEnter={() => setDeleteTooltipOpened(true)} onMouseLeave={() => setDeleteTooltipOpened(false)}

9
frontend/src/index.tsx
View File

@@ -4,17 +4,16 @@ import { BrowserRouter } from "react-router-dom"
import './index.scss'; import './index.scss';
import App from './App'; import App from './App';
import { MantineProvider } from '@mantine/core'; import { MantineProvider } from '@mantine/core';
import { NotificationsProvider } from '@mantine/notifications'; import { Notifications } from '@mantine/notifications';
const root = ReactDOM.createRoot( const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement document.getElementById('root') as HTMLElement
); );
root.render( root.render(
<MantineProvider theme={{ colorScheme: 'dark' }} withGlobalStyles withNormalizeCSS> <MantineProvider theme={{ colorScheme: 'dark' }} withGlobalStyles withNormalizeCSS>
<NotificationsProvider> <Notifications />
<BrowserRouter> <BrowserRouter>
<App /> <App />
</BrowserRouter> </BrowserRouter>
</NotificationsProvider>
</MantineProvider> </MantineProvider>
); );

4
frontend/src/js/utils.tsx
View File

@@ -5,7 +5,7 @@ import { Navigate } from "react-router-dom";
import { nfregex } from "../components/NFRegex/utils"; import { nfregex } from "../components/NFRegex/utils";
import { regexproxy } from "../components/RegexProxy/utils"; import { regexproxy } from "../components/RegexProxy/utils";
import { ChangePassword, IpInterface, LoginResponse, PasswordSend, ServerResponse, ServerResponseToken, ServerStatusResponse } from "./models"; import { ChangePassword, IpInterface, LoginResponse, PasswordSend, ServerResponse, ServerResponseToken, ServerStatusResponse } from "./models";
var Buffer = require('buffer').Buffer import { Buffer } from "buffer"
export const eventUpdateName = "update-info" export const eventUpdateName = "update-info"
@@ -146,4 +146,4 @@ export function b64encode(data:number[]|string){
export function b64decode(regexB64:string){ export function b64decode(regexB64:string){
return Buffer.from(regexB64, "base64").toString() return Buffer.from(regexB64, "base64").toString()
} }

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

@@ -64,7 +64,7 @@ function ServiceDetailsNFRegex() {
<Title className='center-flex' align='center' order={3}>No regex found for this service! Add one by clicking the "+" buttons</Title> <Title className='center-flex' align='center' order={3}>No regex found for this service! Add one by clicking the "+" buttons</Title>
<Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'> <div className='center-flex'>
<Tooltip label="Add a new regex" zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="blue" opened={tooltipAddRegexOpened} tooltipId="tooltip-AddRegex-id"> <Tooltip label="Add a new regex" zIndex={0} color="blue" opened={tooltipAddRegexOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
aria-describedby="tooltip-AddRegex-id" aria-describedby="tooltip-AddRegex-id"
onFocus={() => setTooltipAddRegexOpened(false)} onBlur={() => setTooltipAddRegexOpened(false)} onFocus={() => setTooltipAddRegexOpened(false)} onBlur={() => setTooltipAddRegexOpened(false)}

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

@@ -55,12 +55,12 @@ function NFRegex({ children }: { children: any }) {
<Badge size="sm" color="violet" variant="filled">Regexes: {generalStats.regexes}</Badge> <Badge size="sm" color="violet" variant="filled">Regexes: {generalStats.regexes}</Badge>
<Space w="xs" /> <Space w="xs" />
{ srv? { srv?
<Tooltip label="Add a new regex" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}> <Tooltip label="Add a new regex" position='bottom' color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)} onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon> onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
</Tooltip> </Tooltip>
: <Tooltip label="Add a new service" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}> : <Tooltip label="Add a new service" position='bottom' color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)} onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon> onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
@@ -75,7 +75,7 @@ function NFRegex({ children }: { children: any }) {
}} />):<><Space h="xl"/> <Title className='center-flex' align='center' order={3}>No services found! Add one clicking the "+" buttons</Title> }} />):<><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" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'> <div className='center-flex'>
<Tooltip label="Add a new service" transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddServOpened}> <Tooltip label="Add a new service" color="blue" opened={tooltipAddServOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)} onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)}
onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon> onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon>

4
frontend/src/pages/PortHijack/index.tsx
View File

@@ -46,7 +46,7 @@ function PortHijack() {
<div className='flex-spacer' /> <div className='flex-spacer' />
<Badge size="sm" color="yellow" variant="filled">Services: {generalStats.services}</Badge> <Badge size="sm" color="yellow" variant="filled">Services: {generalStats.services}</Badge>
<Space w="xs" /> <Space w="xs" />
<Tooltip label="Add a new service" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}> <Tooltip label="Add a new service" position='bottom' color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)} onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon> onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
@@ -57,7 +57,7 @@ function PortHijack() {
{services.length > 0?services.map( srv => <ServiceRow service={srv} key={srv.service_id} />):<><Space h="xl"/> <Title className='center-flex' align='center' order={3}>No services found! Add one clicking the "+" buttons</Title> {services.length > 0?services.map( srv => <ServiceRow service={srv} key={srv.service_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" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'> <div className='center-flex'>
<Tooltip label="Add a new service" transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddServOpened}> <Tooltip label="Add a new service" color="blue" opened={tooltipAddServOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)} onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)}
onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon> onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon>

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

@@ -63,7 +63,7 @@ function ServiceDetailsProxyRegex() {
<Title className='center-flex' align='center' order={3}>No regex found for this service! Add one by clicking the "+" buttons</Title> <Title className='center-flex' align='center' order={3}>No regex found for this service! Add one by clicking the "+" buttons</Title>
<Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'> <div className='center-flex'>
<Tooltip label="Add a new regex" zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="blue" opened={tooltipAddRegexOpened} tooltipId="tooltip-AddRegex-id"> <Tooltip label="Add a new regex" zIndex={0} color="blue" opened={tooltipAddRegexOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
aria-describedby="tooltip-AddRegex-id" aria-describedby="tooltip-AddRegex-id"
onFocus={() => setTooltipAddRegexOpened(false)} onBlur={() => setTooltipAddRegexOpened(false)} onFocus={() => setTooltipAddRegexOpened(false)} onBlur={() => setTooltipAddRegexOpened(false)}

6
frontend/src/pages/RegexProxy/index.tsx
View File

@@ -56,12 +56,12 @@ function RegexProxy({ children }: { children: any }) {
<Badge size="sm" color="violet" variant="filled">Regexes: {generalStats.regexes}</Badge> <Badge size="sm" color="violet" variant="filled">Regexes: {generalStats.regexes}</Badge>
<Space w="xs" /> <Space w="xs" />
{ srv? { srv?
<Tooltip label="Add a new regex" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}> <Tooltip label="Add a new regex" position='bottom' color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)} onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon> onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
</Tooltip> </Tooltip>
: <Tooltip label="Add a new service" position='bottom' transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddOpened}> : <Tooltip label="Add a new service" position='bottom' color="blue" opened={tooltipAddOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="lg" radius="md" variant="filled"
onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)} onFocus={() => setTooltipAddOpened(false)} onBlur={() => setTooltipAddOpened(false)}
onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon> onMouseEnter={() => setTooltipAddOpened(true)} onMouseLeave={() => setTooltipAddOpened(false)}><BsPlusLg size={18} /></ActionIcon>
@@ -76,7 +76,7 @@ function RegexProxy({ children }: { children: any }) {
}} />):<><Space h="xl"/> <Title className='center-flex' align='center' order={3}>No services found! Add one clicking the "+" buttons</Title> }} />):<><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" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" /> <Space h="xl" />
<div className='center-flex'> <div className='center-flex'>
<Tooltip label="Add a new service" transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="blue" opened={tooltipAddServOpened}> <Tooltip label="Add a new service" color="blue" opened={tooltipAddServOpened}>
<ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled" <ActionIcon color="blue" onClick={()=>setOpen(true)} size="xl" radius="md" variant="filled"
onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)} onFocus={() => setTooltipAddServOpened(false)} onBlur={() => setTooltipAddServOpened(false)}
onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon> onMouseEnter={() => setTooltipAddServOpened(true)} onMouseLeave={() => setTooltipAddServOpened(false)}><BsPlusLg size="20px" /></ActionIcon>

1
frontend/src/react-app-env.d.ts vendored
View File

@@ -1 +0,0 @@
/// <reference types="react-scripts" />

2
frontend/src/vite-env.d.ts vendored Normal file
View File

@@ -0,0 +1,2 @@
/// <reference types="vite/client" />

23
frontend/tsconfig.json
View File

@@ -1,27 +1,22 @@
{ {
"compilerOptions": { "compilerOptions": {
"target": "es5", "target": "ESNext",
"lib": [ "lib": ["dom", "dom.iterable", "esnext"],
"dom", "types": ["vite/client", "vite-plugin-svgr/client", "node"],
"dom.iterable", "allowJs": false,
"esnext" "skipLibCheck": false,
], "esModuleInterop": false,
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true, "allowSyntheticDefaultImports": true,
"strict": true, "strict": true,
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true, "noFallthroughCasesInSwitch": true,
"module": "esnext", "module": "ESNext",
"moduleResolution": "node", "moduleResolution": "node",
"resolveJsonModule": true, "resolveJsonModule": true,
"isolatedModules": true, "isolatedModules": true,
"noEmit": true, "noEmit": true,
"jsx": "react-jsx" "jsx": "react-jsx"
}, },
"include": [ "include": ["src"]
"src",
"globals.d.ts" //configured .d.ts file
]
} }

10
frontend/vite.config.ts Normal file
View File

@@ -0,0 +1,10 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import viteTsconfigPaths from 'vite-tsconfig-paths';
import svgrPlugin from 'vite-plugin-svgr';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react(), viteTsconfigPaths(), svgrPlugin()],
});

8766
frontend/yarn.lock
View File

File diff suppressed because it is too large Load Diff