push: code changes

frontend/src/components/NFProxy/AddEditService.tsx

@@ -26,7 +26,7 @@ function AddEditService({ opened, onClose, edit }:{ opened:boolean, onClose:()=>
         validate:{
             name: (value) => edit? null : value !== "" ? null : "Service name is required",
             port: (value) => (value>0 && value<65536) ? null : "Invalid port",
-            proto: (value) => ["tcp","udp"].includes(value) ? null : "Invalid protocol",
+            proto: (value) => ["tcp","http"].includes(value) ? null : "Invalid protocol",
             ip_int: (value) => (value.match(regex_ipv6) || value.match(regex_ipv4)) ? null : "Invalid IP address",
         }
     })
@@ -50,7 +50,7 @@ function AddEditService({ opened, onClose, edit }:{ opened:boolean, onClose:()=>
     const submitRequest = ({ name, port, autostart, proto, ip_int, fail_open }:ServiceAddForm) =>{
         setSubmitLoading(true)
         if (edit){
-            nfproxy.settings(edit.service_id, { port, proto, ip_int, fail_open }).then( res => {
+            nfproxy.settings(edit.service_id, { port, ip_int, fail_open }).then( res => {
                 if (!res){
                     setSubmitLoading(false)
                     close();
@@ -111,13 +111,13 @@ function AddEditService({ opened, onClose, edit }:{ opened:boolean, onClose:()=>
                     />
                 </Box>
                 <Box className="flex-spacer"></Box>
-                <SegmentedControl
+                {edit?null:<SegmentedControl
                     data={[
                         { label: 'TCP', value: 'tcp' },
-                        { label: 'UDP', value: 'udp' },
+                        { label: 'HTTP', value: 'http' },
                     ]}
                     {...form.getInputProps('proto')}
-                />
+                />}
             </Box>      
 
             <Group justify='flex-end' mt="md" mb="sm">

frontend/src/components/NFProxy/UploadFilterModal.tsx

@@ -0,0 +1,54 @@
+import { Button, FileButton, Group, Modal, Notification, Space } from "@mantine/core";
+import { nfproxy, Service } from "./utils";
+import { useEffect, useState } from "react";
+import { ImCross } from "react-icons/im";
+import { okNotify } from "../../js/utils";
+
+export const UploadFilterModal = ({ opened, onClose, service }: { opened: boolean, onClose: () => void, service?: Service }) => {
+    const close = () =>{
+        onClose()
+        setError(null)
+    }
+
+    const [submitLoading, setSubmitLoading] = useState(false)
+    const [error, setError] = useState<string|null>(null)
+    const [file, setFile] = useState<File | null>(null);
+    
+    useEffect(() => {
+        if (opened && file){
+            file.bytes().then( code => {
+                console.log(code.toString())
+                setSubmitLoading(true)
+                nfproxy.setpyfilterscode(service?.service_id??"",code.toString()).then( res => {
+                    if (!res){
+                        setSubmitLoading(false)
+                        close();
+                        okNotify(`Service ${name} code updated`, `Successfully updated code for service ${name}`)
+                    }
+                }).catch( err => {
+                    setSubmitLoading(false)
+                    setError("Error: "+err)
+                })
+            })
+        }
+    }, [opened, file])
+    
+    return <Modal opened={opened && service != null} onClose={onClose} title="Upload filter Code" size="xl" closeOnClickOutside={false} centered>
+            <Space h="md" />
+            <Group justify="center">
+                <FileButton onChange={setFile} accept=".py" multiple={false}>
+                {(props) => <Button {...props}>Upload filter python code</Button>}
+                </FileButton>
+            </Group>
+
+            {error?<>
+                <Space h="md" />
+                <Notification icon={<ImCross size={14} />} color="red" onClose={()=>{setError(null)}}>
+                    Error: {error}
+                </Notification>
+            </>:null}
+            <Space h="md" />
+
+    </Modal>
+
+}

frontend/src/components/NFProxy/utils.ts

@@ -25,7 +25,6 @@ export type ServiceAddForm = {
 
 export type ServiceSettings = {
     port?:number,
-    proto?:string,
     ip_int?:string,
     fail_open?: boolean,
 }
@@ -55,12 +54,12 @@ export const nfproxy = {
     serviceinfo: async (service_id:string) => {
         return await getapi(`nfproxy/services/${service_id}`) as Service;
     },
-    pyfilterenable: async (regex_id:number) => {
-        const { status } = await postapi(`nfproxy/pyfilters/${regex_id}/enable`) as ServerResponse;
+    pyfilterenable: async (filter_name:string) => {
+        const { status } = await postapi(`nfproxy/pyfilters/${filter_name}/enable`) as ServerResponse;
         return status === "ok"?undefined:status
     },
-    pyfilterdisable: async (regex_id:number) => {
-        const { status } = await postapi(`nfproxy/pyfilters/${regex_id}/disable`) as ServerResponse;
+    pyfilterdisable: async (filter_name:string) => {
+        const { status } = await postapi(`nfproxy/pyfilters/${filter_name}/disable`) as ServerResponse;
         return status === "ok"?undefined:status
     },
     servicestart: async (service_id:string) => {