Added case-insensitve regex

frontend/src/components/AddNewRegex.tsx

@@ -11,6 +11,7 @@ type RegexAddInfo = {
     regex:string,
     type:string,
     mode:string,
+    is_case_sensitive:boolean,
     regex_exact:boolean,
     percentage_encoding:boolean
 }
@@ -22,6 +23,7 @@ function AddNewRegex({ opened, onClose, service }:{ opened:boolean, onClose:()=>
             regex:"",
             type:"blacklist",
             mode:"C <-> S",
+            is_case_sensitive:true,
             regex_exact:false,
             percentage_encoding:false
         },
@@ -55,6 +57,7 @@ function AddNewRegex({ opened, onClose, service }:{ opened:boolean, onClose:()=>
 
         const request:RegexAddForm = {
             is_blacklist:values.type !== "whitelist",
+            is_case_sensitive: values.is_case_sensitive,
             service_id: service,
             mode: filter_mode?filter_mode:"B",
             regex: b64encode(final_regex)
@@ -65,7 +68,7 @@ function AddNewRegex({ opened, onClose, service }:{ opened:boolean, onClose:()=>
                 setSubmitLoading(false)
                 close();
                 fireUpdateRequest();
-                okNotify(`Regex ${getHumanReadableRegex(request.regex)} has been added`, `Successfully added ${request.is_blacklist?"blacklist":"whitelist"} regex to ${request.service_id} service`)
+                okNotify(`Regex ${getHumanReadableRegex(request.regex)} has been added`, `Successfully added  ${request.is_case_sensitive?"case sensitive":"case insensitive"} ${request.is_blacklist?"blacklist":"whitelist"} regex to ${request.service_id} service`)
             }else if (res.toLowerCase() === "invalid regex"){
                 setSubmitLoading(false)
                 form.setFieldError("regex", "Invalid Regex")
@@ -97,6 +100,11 @@ function AddNewRegex({ opened, onClose, service }:{ opened:boolean, onClose:()=>
                 />
             </Tooltip>
             <Space h="md" />
+            <Switch
+                label="Case sensitive"
+                {...form.getInputProps('is_case_sensitive', { type: 'checkbox' })}
+            />
+            <Space h="md" />
             <Switch
                 label="Match exactly the regex"
                 {...form.getInputProps('regex_exact', { type: 'checkbox' })}

frontend/src/components/RegexView/index.tsx

@@ -74,6 +74,8 @@ function RegexView({ regexInfo }:{ regexInfo:RegexFilter }) {
             <div className='center-flex-row'>
               <Badge size="md" color={exact_regex?"grape":"pink"} variant="filled">Match: {exact_regex?"EXACT":"FIND"}</Badge>
               <Space h="xs" />
+              <Badge size="md" color={regexInfo.is_case_sensitive?"red":"green"} variant="filled">Case: {regexInfo.is_case_sensitive?"SENSIIVE":"INSENSITIVE"}</Badge>
+              <Space h="xs" />
               <Badge size="md" color="yellow" variant="filled">Packets filtered: {regexInfo.n_packets}</Badge>
               <Space h="xs" />
               <Badge size="md" color="blue" variant="filled">Mode: {mode_string}</Badge>

frontend/src/js/models.ts

@@ -42,6 +42,7 @@ export type RegexFilter = {
     service_id:string,
     regex:string
     is_blacklist:boolean,
+    is_case_sensitive:boolean,
     mode:string //C S B => C->S S->C BOTH
     n_packets:number
 }
@@ -49,6 +50,7 @@ export type RegexFilter = {
 export type RegexAddForm = {
     service_id:string,
     regex:string,
+    is_case_sensitive:boolean,
     is_blacklist:boolean,
     mode:string // C->S S->C BOTH
 }