Workflow syncs

frontend/src/components/AppModal.jsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { memo, useCallback, useEffect, useState } from 'react';
 import { useNavigate } from 'react-router';
 
 import {
@@ -29,8 +29,15 @@ import theme from "../theme.jsx";
 import YAML from 'yaml';
 import { toast } from 'react-toastify';
 import { Link } from 'react-router-dom';
+import { InstantSearch, connectHits, connectSearchBox } from 'react-instantsearch-dom';
+import algoliasearch from "algoliasearch/lite";
 
-const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
+const searchClient = algoliasearch(
+  "JNSS5CFDZZ",
+  "db08e40265e2941b9a7d8f644b6e5240"
+);;
+
+const AppModal = ({ open, onClose, app, globalUrl, getApps}) => {
 
   const [frameworkData, setFrameworkData] = useState({})
   const [userdata, setUserdata] = useState({})
@@ -79,8 +86,7 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
       });
   }, [app]);
 
-
-  const getFramework = () => {
+    const getFramework = () => {
     fetch(globalUrl + "/api/v1/apps/frameworkConfiguration", {
       method: "GET",
       headers: {
@@ -295,8 +301,6 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
       })
   }
 
-
-
   useEffect(() => {
     setUsecaseLoading(true)
     getAvailableWorkflows()
@@ -329,6 +333,7 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
               //delete apps from local storage
               localStorage.removeItem("apps");
               getApps();
+              onClose();
             }, 1000);
           } else {
             toast("Failed deleting app. Does it still exist?");
@@ -720,18 +725,7 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
             textAlign: "start",
             flex: 1,
           }}>
-            <Typography
-              variant="h6"
-              sx={{
-                fontFamily: theme?.typography?.fontFamily,
-                fontSize: '24px',
-                fontWeight: 600,
-                mb: 0.3,
-                color: '#fff'
-              }}
-            >
-              20
-            </Typography>
+            <WorkflowCard app={app}/>
             <Typography
               variant="body2"
               sx={{
@@ -930,3 +924,55 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
 };
 
 export default AppModal;
+
+
+const WorkflowCard = memo(({ app }) => {
+  const [name, setName] = useState("");
+  const [relatedWorkflows, setRelatedWorkflows] = useState(0);
+
+  const WorkflowHits = ({ hits }) => {
+    useEffect(() => {
+      setRelatedWorkflows(hits?.length || 0);
+    }, [hits]);
+
+    return null;
+  };
+
+  const CustomWorkflowHits = connectHits(WorkflowHits);
+
+  const SearchBox = ({ refine, currentRefinement }) => {
+    useEffect(() => {
+      if (name.length > 0 && currentRefinement !== name) {
+        refine(name?.split(" ")[0]);
+      }
+    }, [name, refine, currentRefinement]);
+
+    return null;
+  };
+
+  const CustomSearchBox = connectSearchBox(SearchBox);
+
+  useEffect(() => {
+    if (app?.name && app.name.trim().length > 0 && name !== app.name) {
+      const formattedName = app.name
+        .charAt(0)
+        .toUpperCase() + app.name.substring(1)
+        .replaceAll("_", " ");
+      setName(formattedName);
+    }
+  }, [app?.name]);
+
+  return (
+    <Typography variant="h4">
+      {name.length > 0 ? (
+        <InstantSearch key={name} searchClient={searchClient} indexName="workflows">
+          <CustomSearchBox defaultRefinement={name?.split(" ")[0]}/>
+          <CustomWorkflowHits />
+          {relatedWorkflows}
+        </InstantSearch>
+      ) : (
+        relatedWorkflows
+      )}
+    </Typography>
+  );
+});

frontend/src/components/ParsedAction.jsx

@@ -1160,6 +1160,12 @@ const ParsedAction = (props) => {
 
 					selectedActionParameters[1].value = splitparsed[1]
 					selectedAction.parameters[1].value = splitparsed[1]
+
+					if (splitparsed.length > 2) {
+						toast.warn("Filter list only supports filtering at the first level. If you want multi-level filtering, please use the 'execute python' action with the 'filter a list' function in the code editor.")
+					} else if (selectedAction.parameters[1].value.includes(".#")) {
+						toast.warn("This filter may not work due to using .# indexing. Please use the 'execute python' action and try the 'filter a list' function in the code editor.")
+					}
 				} else {
 					// Remove .# and after
 					const splitparsed = parsedvalue.split(".#")

frontend/src/components/ShuffleCodeEditor1.jsx

@@ -89,6 +89,7 @@ const liquidFilters = [
 const pythonFilters = [
 	{ "name": "Hello World", "value": `print("hello world")`, "example": `` },
 	{ "name": "Using Shuffle variables", "value": `import json\nnodevalue = r\"\"\"$exec\"\"\"\nif not nodevalue:\n  nodevalue = r\"\"\"{\"sample\": \"string\", \"int\": 1}\"\"\"\n  \njsondata = json.loads(nodevalue)\nprint(jsondata)`, "example": `` },
+	{ "name": "Filter a list", "value": `import json\nnodevalue = r\"\"\"$exec\"\"\"\nif not nodevalue:\n  nodevalue = r\"\"\"[{\"sample\": \"string\", \"int\": 1, "malicious": "no"}, {\"sample\": \"string2\", \"int\": 1, "malicious": "yes"}]\"\"\"\n  \njsondata = json.loads(nodevalue)\nfiltered = []\nfor item in jsondata:\n  try:\n    if item[\"malicious\"] == \"yes\":\n      filtered.append(item)\n  except:\n    pass\nprint(json.dumps(filtered))`, "example": `` },
 	{ "name": "Print Execution ID", "value": `print(self.current_execution_id)`, "example": `` },
 	{ "name": "Get full execution details", "value": `print(self.full_execution)`, "example": `` },
 	{ "name": "Use files", "value": `# Create a sample file\nfiles = [{\n  \"filename\": \"test.txt\",\n  \"data\": \"Testdata\"\n}]\nret = self.set_files(files)\n\n# Get the content of the file from Shuffle storage\n# Originally a byte string in the \"data\" key\nfile_content = (self.get_file(ret[0])[\"data\"]).decode()\nprint(file_content)`, "example": `` },