ui fix for interactive tasking

its-a-feature · Feb 5, 2025 · 7be2931 · 7be2931
1 parent 83aa363
commit 7be2931
Show file tree

Hide file tree

Showing 9 changed files with 54 additions and 41 deletions.
diff --git a/MythicReactUI/CHANGELOG.MD b/MythicReactUI/CHANGELOG.MD
@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.3.8] - 2025-02-05
+
+### Changed
+
+- Fixed an issue with interactive tasking where up/down arrows would scroll too much
+
 ## [0.3.7] - 2025-02-04
 
 ### Changed

diff --git a/MythicReactUI/src/components/MythicComponents/MythicTextField.js b/MythicReactUI/src/components/MythicComponents/MythicTextField.js
@@ -51,15 +51,16 @@ const MythicTextField = ({
                              maxRows = 10,
                              errorText = "",
                              helperText = "",
+                            debounceDelay = 200,
                          }) => {
     const [localValue, setLocalValue] = React.useState({value: value, event: null});
-    const debouncedLocalInput = useDebounce(localValue, 500);
+    const debouncedLocalInput = useDebounce(localValue, debounceDelay);
     React.useEffect( () => {
         const error = validate ? validate(debouncedLocalInput.value) : false;
         onChange(name, debouncedLocalInput.value, error, debouncedLocalInput.event);
     }, [debouncedLocalInput]);
     React.useEffect( () => {
-        setLocalValue({...localValue, value: value});
+        setLocalValue({value: value, event: null});
     }, [value]);
     const handleChange = (evt) => {
         const newValue = evt.target.value;

diff --git a/MythicReactUI/src/components/pages/Callbacks/ResponseDisplayInteractive.js b/MythicReactUI/src/components/pages/Callbacks/ResponseDisplayInteractive.js
@@ -464,42 +464,44 @@ const InteractiveTaskingBar = ({
         setTaskOptions(newTaskOptions);
     }, [taskData]);
     const onInputChange = (name, value, error, event) => {
-        if(event === null || event === undefined){
-            return;
-        }
-        if(event.key === "ArrowUp"){
-            event.preventDefault();
-            event.stopPropagation();
-            if(taskOptions.length === 0){
-                snackActions.warning("No previous tasks")
-                return;
-            }
-            let newIndex = (taskOptionsIndex + 1);
-            if(newIndex > taskOptions.length -1){
-                newIndex = taskOptions.length -1;
-            }
-            setTaskOptionsIndex(newIndex);
-            setInputText(taskOptions[newIndex].display_params.trim());
-        }else if(event.key === "ArrowDown"){
-            event.preventDefault();
-            event.stopPropagation();
-            if(taskData.length === 0){
-                snackActions.warning("No next tasks")
-                return;
-            }
-            let newIndex = (taskOptionsIndex -1);
-            if(newIndex < 0){
-                setTaskOptionsIndex(-1);
-                setInputText("");
-            } else {
+        if(event !== null && event !== undefined){
+            if(event.key === "ArrowUp"){
+                event.preventDefault();
+                event.stopPropagation();
+                if(taskOptions.length === 0){
+                    snackActions.warning("No previous tasks")
+                    return;
+                }
+                let newIndex = (taskOptionsIndex + 1);
+                if(newIndex > taskOptions.length -1){
+                    newIndex = taskOptions.length -1;
+                }
                 setTaskOptionsIndex(newIndex);
                 setInputText(taskOptions[newIndex].display_params.trim());
-            }
+            }else if(event.key === "ArrowDown"){
+                event.preventDefault();
+                event.stopPropagation();
+                if(taskData.length === 0){
+                    snackActions.warning("No next tasks")
+                    return;
+                }
+                let newIndex = (taskOptionsIndex -1);
+                if(newIndex < 0){
+                    setTaskOptionsIndex(-1);
+                    setInputText("");
+                } else {
+                    setTaskOptionsIndex(newIndex);
+                    setInputText(taskOptions[newIndex].display_params.trim());
+                }
 
-        }else{
+            }else{
+                setInputText(value);
+            }
+        } else {
             setInputText(value);
         }
 
+
     }
     const submitTask = (event) => {
         event.stopPropagation();
@@ -512,6 +514,9 @@ const InteractiveTaskingBar = ({
             setInputText(inputText + selectedEnterOption.value);
             return;
         }
+        if(inputText === ""){
+            return;
+        }
         if(selectedControlOption.value > 0){
             let ctrlSequence = selectedControlOption.text;
             let enterOption = selectedEnterOption.value;
@@ -588,6 +593,7 @@ const InteractiveTaskingBar = ({
 
             <MythicTextField autoFocus={true} maxRows={5} multiline={true} onChange={onInputChange} onEnter={submitTask}
                              value={inputText} variant={"standard"} placeholder={">_ type here..."} inline={true}
+                             debounceDelay={50}
                              marginBottom={"0px"} InputProps={{style: { width: "100%"}}}/>
             <FormControl style={{width: "6rem"}} >
                 <Select

diff --git a/MythicReactUI/src/index.js b/MythicReactUI/src/index.js
@@ -15,7 +15,7 @@ import jwt_decode from 'jwt-decode';
 import {meState} from './cache';
 import {getSkewedNow} from "./components/utilities/Time";
 
-export const mythicUIVersion = "0.3.7";
+export const mythicUIVersion = "0.3.8";
 
 let fetchingNewToken = false;
 

diff --git a/mythic-react-docker/mythic/public/asset-manifest.json b/mythic-react-docker/mythic/public/asset-manifest.json
@@ -1,17 +1,17 @@
 {
   "files": {
     "main.css": "/new/static/css/main.602591e6.css",
-    "main.js": "/new/static/js/main.a65475bb.js",
+    "main.js": "/new/static/js/main.153cac58.js",
     "static/media/mythic-red.png": "/new/static/media/mythic-red.203468a4e5240d239aa0.png",
     "static/media/graphql.png": "/new/static/media/graphql.8f15978b39b0870a9f0e.png",
     "static/media/Mythic_Logo.svg": "/new/static/media/Mythic_Logo.6842c911bebe36d6f83fc7ced4a2cd99.svg",
     "static/media/mythic_red_small.svg": "/new/static/media/mythic_red_small.793b41cc7135cdede246661ec232976b.svg",
     "index.html": "/new/index.html",
     "main.602591e6.css.map": "/new/static/css/main.602591e6.css.map",
-    "main.a65475bb.js.map": "/new/static/js/main.a65475bb.js.map"
+    "main.153cac58.js.map": "/new/static/js/main.153cac58.js.map"
   },
   "entrypoints": [
     "static/css/main.602591e6.css",
-    "static/js/main.a65475bb.js"
+    "static/js/main.153cac58.js"
   ]
 }
diff --git a/mythic-react-docker/mythic/public/index.html b/mythic-react-docker/mythic/public/index.html
@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/new/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="apple-touch-icon" href="/new/logo192.png"/><link rel="manifest" href="/new/manifest.json"/><title>Mythic</title><script defer="defer" src="/new/static/js/main.a65475bb.js"></script><link href="/new/static/css/main.602591e6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/new/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="apple-touch-icon" href="/new/logo192.png"/><link rel="manifest" href="/new/manifest.json"/><title>Mythic</title><script defer="defer" src="/new/static/js/main.153cac58.js"></script><link href="/new/static/css/main.602591e6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
diff --git a/.../mythic/public/static/js/main.a65475bb.js → .../mythic/public/static/js/main.153cac58.js b/.../mythic/public/static/js/main.a65475bb.js → .../mythic/public/static/js/main.153cac58.js
diff --git a/...ic/static/js/main.a65475bb.js.LICENSE.txt → ...ic/static/js/main.153cac58.js.LICENSE.txt b/...ic/static/js/main.a65475bb.js.LICENSE.txt → ...ic/static/js/main.153cac58.js.LICENSE.txt
diff --git a/...hic/public/static/js/main.a65475bb.js.map → ...hic/public/static/js/main.153cac58.js.map b/...hic/public/static/js/main.a65475bb.js.map → ...hic/public/static/js/main.153cac58.js.map
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/new/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="apple-touch-icon" href="/new/logo192.png"/><link rel="manifest" href="/new/manifest.json"/><title>Mythic</title><script defer="defer" src="/new/static/js/main.a65475bb.js"></script><link href="/new/static/css/main.602591e6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
		<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/new/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="apple-touch-icon" href="/new/logo192.png"/><link rel="manifest" href="/new/manifest.json"/><title>Mythic</title><script defer="defer" src="/new/static/js/main.153cac58.js"></script><link href="/new/static/css/main.602591e6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>