[Backport 2.x] Improve form usability & autosave (#273) (#281)

* Improve form usability & autosave (#273) Signed-off-by: Tyler Ohlsen <[email protected]> * Remove leftover legacy templates Signed-off-by: Tyler Ohlsen <[email protected]> --------- Signed-off-by: Tyler Ohlsen <[email protected]>
opensearch-project · Aug 14, 2024 · cd959e0 · cd959e0
1 parent e424be1
commit cd959e0
Show file tree

Hide file tree

Showing 7 changed files with 34 additions and 39 deletions.
diff --git a/common/constants.ts b/common/constants.ts
@@ -156,6 +156,8 @@ export const FETCH_ALL_QUERY_BODY = {
   size: 1000,
 };
 export const INDEX_NOT_FOUND_EXCEPTION = 'index_not_found_exception';
+export const NO_MODIFICATIONS_FOUND_TEXT =
+  'Template does not contain any modifications';
 export const JSONPATH_ROOT_SELECTOR = '$.';
 export enum SORT_ORDER {
   ASC = 'asc',

diff --git a/public/pages/workflow_detail/workflow_inputs/workflow_inputs.tsx b/public/pages/workflow_detail/workflow_inputs/workflow_inputs.tsx
@@ -144,7 +144,7 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
   const debounceAutosave = useCallback(
     debounce(async () => {
       triggerAutosave();
-    }, 10000),
+    }, 1000),
     [autosave]
   );
 
@@ -173,15 +173,14 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
         )
           .unwrap()
           .then(async (result) => {
+            // TODO: figure out clean way to update the "last updated"
+            // section. The problem with re-fetching this every time, is it
+            // triggers lots of component rebuilds due to the base workflow prop
+            // changing.
             // get any updates after autosave
-            new Promise((f) => setTimeout(f, 1000)).then(async () => {
-              dispatch(
-                getWorkflow({
-                  workflowId: props.workflow?.id as string,
-                  dataSourceId,
-                })
-              );
-            });
+            // new Promise((f) => setTimeout(f, 1000)).then(async () => {
+            //   dispatch(getWorkflow(props.workflow?.id as string));
+            // });
           })
           .catch((error: any) => {
             console.error('Error autosaving workflow: ', error);
@@ -676,6 +675,7 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
                           onClick={() => {
                             validateAndRunIngestion();
                           }}
+                          // TODO: only enable if ingest is dirty
                           disabled={ingestProvisioned && !isDirty}
                         >
                           Run ingestion
@@ -687,6 +687,7 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
                           onClick={() => {
                             setSelectedStep(STEP.SEARCH);
                           }}
+                          // TODO: only disable if ingest is dirty
                           disabled={!ingestProvisioned || isDirty}
                         >
                           {`Search pipeline >`}
@@ -697,18 +698,15 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
                     <>
                       <EuiFlexItem grow={false}>
                         <EuiButtonEmpty
-                          disabled={isDirty}
+                          disabled={false}
                           onClick={() => setSelectedStep(STEP.INGEST)}
                         >
                           Back
                         </EuiButtonEmpty>
                       </EuiFlexItem>
                       <EuiFlexItem grow={false}>
                         <EuiButton
-                          disabled={
-                            (searchProvisioned && !isDirty) ||
-                            isProposingNoSearchResources
-                          }
+                          disabled={isProposingNoSearchResources}
                           fill={false}
                           onClick={() => {
                             validateAndRunQuery();

diff --git a/server/resources/templates/custom.json b/server/resources/templates/custom.json
@@ -0,0 +1,12 @@
+{
+    "name": "Custom",
+    "description": "A blank workflow with no preset configurations",
+    "use_case": "CUSTOM",
+    "version": {
+        "template": "1.0.0",
+        "compatibility": [
+            "2.17.0",
+            "3.0.0"
+        ]
+    }
+}
diff --git a/server/resources/templates/hybrid_search.json b/server/resources/templates/hybrid_search.json
diff --git a/server/resources/templates/neural_sparse_search.json b/server/resources/templates/neural_sparse_search.json
diff --git a/server/routes/flow_framework_routes_service.ts b/server/routes/flow_framework_routes_service.ts
@@ -485,6 +485,9 @@ export class FlowFrameworkRoutesService {
 
       return res.ok({ body: { workflowId: workflow_id, workflowTemplate } });
     } catch (err: any) {
+      if (isIgnorableError(err)) {
+        return res.ok({ body: { workflowId: workflow_id, workflowTemplate } });
+      }
       return generateCustomError(res, err);
     }
   };

diff --git a/server/routes/helpers.ts b/server/routes/helpers.ts
@@ -11,6 +11,7 @@ import {
   Model,
   ModelDict,
   ModelInterface,
+  NO_MODIFICATIONS_FOUND_TEXT,
   SearchHit,
   WORKFLOW_RESOURCE_TYPE,
   WORKFLOW_STATE,
@@ -35,7 +36,10 @@ export function generateCustomError(res: any, err: any) {
 
 // Helper fn to filter out backend errors that we don't want to propagate on the frontend.
 export function isIgnorableError(error: any): boolean {
-  return error.body?.error?.type === INDEX_NOT_FOUND_EXCEPTION;
+  return (
+    error.body?.error?.type === INDEX_NOT_FOUND_EXCEPTION ||
+    error.body?.error === NO_MODIFICATIONS_FOUND_TEXT
+  );
 }
 
 // Convert backend workflow into frontend workflow obj