Mat 7797 edit function

src/AceEditor/madie-ace-editor.tsx

@@ -48,6 +48,7 @@
   handleDeleteLibrary?: (lib: SelectedLibrary) => void;
   handleApplyFunction?: (funct: Funct) => void;
   handleFunctionDelete?: (funct: any) => void;
+  handleFunctionEdit?: (funct: any, newFunct: string) => void;
   parseDebounceTime?: number;
   inboundAnnotations?: Ace.Annotation[];
   inboundErrorMarkers?: Ace.MarkerLike[];
@@ -481,7 +482,7 @@
         console.warn("Editor is not set! Cannot set annotations!", editor);
       }
     }
   }, [parserAnnotations, inboundAnnotations, editor]);
   const toggleSearchBox = () => {
     // given the searchBox has not been instantiated we execCommand which also triggers show
     //@ts-ignore
@@ -523,7 +524,7 @@
         toggleSearchBox as EventListener
       );
     };
   }, [editor, parseErrorMarkers, inboundErrorMarkers]);
 
   useEffect(() => {
     const cqlMode = new CqlMode();
@@ -535,14 +536,14 @@
         debouncedParse.cancel();
       }
     };
   }, [debouncedParse]);
 
   useEffect(() => {
     if (!_.isNil(value) && editor && validationsEnabled) {
       setParsing(true);
       debouncedParse(value, editor);
     }
   }, [value, editor, debouncedParse]);
 
   useEffect(() => {
     // This is to set aria-label on textarea for accessibility

src/CqlBuilderPanel/CqlBuilderPanel.tsx

@@ -38,6 +38,7 @@
   handleDefinitionDelete,
   handleApplyFunction,
   handleFunctionDelete,
+  handleFunctionEdit,
   resetCql,
   getCqlDefinitionReturnTypes,
   makeExpanded,
@@ -126,7 +127,7 @@
     } else {
       setLoading(false);
     }
   }, [measureModel, measureStoreCql]);
 
   return (
     <div className="right-panel">
@@ -246,6 +247,7 @@
               canEdit={canEdit}
               handleApplyFunction={handleApplyFunction}
               handleFunctionDelete={handleFunctionDelete}
+              handleFunctionEdit={handleFunctionEdit}
               loading={loading}
               cql={measureStoreCql}
               isCQLUnchanged={isCQLUnchanged}

src/CqlBuilderPanel/definitionsSection/expressionSection/ExpressionEditor.tsx

@@ -116,7 +116,7 @@ export default function ExpressionEditor(props: ExpressionsProps) {
       type === "Definitions" ||
       type === "Functions"
     ) {
-      if (cqlBuilderLookupsTypes[type?.toLowerCase()]) {
+      if (cqlBuilderLookupsTypes?.[type?.toLowerCase()]) {
         setNamesOptions(
           cqlBuilderLookupsTypes[type?.toLowerCase()].map((def) =>
             getDefinitionNameWithAlias(def, type?.toLowerCase())

src/CqlBuilderPanel/functionsSection/EditFunctionDialog.tsx

@@ -54,11 +54,9 @@ const EditFunctionDialog = ({
 
   const updatedFunction = {
     ...funct,
-    fluentFunction: funct?.isFluent === true ? true : false,
-    functionsArguments: parseArgumentsFromLogicString(
-      funct?.logic ? funct?.logic : ""
-    ),
-    expressionEditorValue: funct?.logic,
+    fluentFunction: funct?.isFluent === "Yes" ? true : false,
+    functionsArguments: funct?.arguments,
+    expressionEditorValue: funct?.expressionEditorValue,
   };
 
   return (

src/CqlBuilderPanel/functionsSection/FunctionsSection.tsx

@@ -3,14 +3,19 @@ import "./Functions.scss";
 import FunctionSectionNavTabs from "./FunctionSectionNavTabs";
 import Functions from "./functions/Functions";
 import FunctionBuilder from "./functionBuilder/FunctionBuilder";
-import { CqlBuilderLookup, FunctionLookup } from "../../model/CqlBuilderLookup";
+import {
+  CqlBuilderLookup,
+  FunctionLookup,
+  FunctionArgument,
+} from "../../model/CqlBuilderLookup";
 import * as _ from "lodash";
 import { CqlAntlr } from "@madie/cql-antlr-parser/dist/src";
 
 export interface FunctionProps {
   canEdit: boolean;
   handleApplyFunction?: Function;
   handleFunctionDelete?: Function;
+  handleFunctionEdit?: Function;
   loading: boolean;
   cqlBuilderLookupsTypes?: CqlBuilderLookup;
   cql: string;
@@ -19,9 +24,24 @@ export interface FunctionProps {
   resetCql: Function;
 }
 
-const getArgumentNames = (logic: string) => {
+const getArgumentNames = (logic: string): FunctionArgument[] => {
   const args = logic.substring(logic.indexOf("(") + 1, logic.indexOf(")"));
-  return args.split(",");
+  const argstr = args.split(",");
+  return argstr.map((arg) => {
+    if (arg[0] === " ") {
+      arg = arg.substring(1);
+    }
+    const splitted = arg.split(" ");
+    return { argumentName: splitted[0], dataType: splitted[1] };
+  });
+};
+
+const getExpressionEditorValue = (logic: string): string => {
+  const expressionEditorValue = logic.substring(
+    logic.indexOf(":") + 1,
+    logic.length
+  );
+  return expressionEditorValue ? expressionEditorValue.trim() : "";
 };
 
 export default function FunctionsSection({
@@ -32,6 +52,7 @@ export default function FunctionsSection({
   cqlBuilderLookupsTypes,
   resetCql,
   handleFunctionDelete,
+  handleFunctionEdit,
   loading,
 }: FunctionProps) {
   const [activeTab, setActiveTab] = useState<string>("function");
@@ -52,7 +73,8 @@ export default function FunctionsSection({
           ...func,
           comment: expression?.comment,
           isFluent: "-",
-          argumentNames: getArgumentNames(func.logic),
+          arguments: getArgumentNames(func.logic),
+          expressionEditorValue: getExpressionEditorValue(func.logic),
         } as FunctionLookup;
       }) || [];
 
@@ -67,8 +89,9 @@ export default function FunctionsSection({
           ...func,
           comment: expression?.comment,
           isFluent: "Yes",
-          argumentNames: getArgumentNames(func.logic),
-        };
+          arguments: getArgumentNames(func.logic),
+          expressionEditorValue: getExpressionEditorValue(func.logic),
+        } as FunctionLookup;
       }) || []
   );
   functionLookups = _.sortBy(functionLookups, (o) => o.name?.toLowerCase());
@@ -99,6 +122,7 @@ export default function FunctionsSection({
             resetCql={resetCql}
             handleApplyFunction={handleApplyFunction}
             handleFunctionDelete={handleFunctionDelete}
+            handleFunctionEdit={handleFunctionEdit}
           />
         )}
       </div>

src/CqlBuilderPanel/functionsSection/functionBuilder/FunctionBuilder.test.tsx

@@ -13,6 +13,30 @@ import userEvent from "@testing-library/user-event";
 import { cqlBuilderLookup } from "../../__mocks__/MockCqlBuilderLookupsTypes";
 import { getNewExpressionsAndLines } from "../../common/utils";
 
+const funct = {
+  name: "isFinishedEncounter",
+  libraryName: null,
+  libraryAlias: null,
+  logic:
+    "define fluent function \"isFinishedEncounter\"(Enc Encounter):\n  (Enc E where E.status = 'finished') is not null",
+  startLine: 0,
+  isFluent: "Yes",
+  arguments: [
+    {
+      argumentName: "Enc",
+      dataType: "Encounter",
+    },
+  ],
+  expressionEditorValue: "(Enc E where E.status = 'finished') is not null",
+  fluentFunction: true,
+  functionsArguments: [
+    {
+      argumentName: "Enc",
+      dataType: "Encounter",
+    },
+  ],
+};
+
 describe("CQL Function Builder Tests", () => {
   it("Should display name and comment fields", async () => {
     render(<FunctionBuilder canEdit={true} handleApplyFunction={jest.fn()} />);
@@ -584,20 +608,13 @@ describe("CQL Function Builder Tests", () => {
     fireEvent.click(submitButton);
 
     await waitFor(() => {
-      expect(handleApplyFn).toHaveBeenCalledWith(
-        expect.objectContaining({
-          comment: "comment",
-          expressionValue: "after",
-          fluentFunction: true,
-          functionName: "IP",
-          functionsArguments: [
-            expect.objectContaining({
-              argumentName: "Test",
-              dataType: "test",
-            }),
-          ],
-        })
-      );
+      expect(handleApplyFn).toHaveBeenCalledWith({
+        comment: "comment",
+        expressionValue: "after",
+        fluentFunction: true,
+        functionName: "IP",
+        functionsArguments: [{ argumentName: "Test", dataType: "test" }],
+      });
     });
   });
   it("should call handleApplyFunction with a function that we've created through the UI", async () => {
@@ -710,20 +727,127 @@ describe("CQL Function Builder Tests", () => {
     fireEvent.click(submitButton);
 
     await waitFor(() => {
-      expect(handleApplyFn).toHaveBeenCalledWith(
-        expect.objectContaining({
-          comment: "comment",
-          expressionValue: "after",
-          fluentFunction: true,
-          functionName: "IP",
-          functionsArguments: [
-            expect.objectContaining({
-              argumentName: "Test",
-              dataType: "Boolean",
-            }),
-          ],
-        })
-      );
+      expect(handleApplyFn).toHaveBeenCalledWith({
+        comment: "comment",
+        expressionValue: "after",
+        fluentFunction: true,
+        functionName: "IP",
+        functionsArguments: [{ argumentName: "Test", dataType: "Boolean" }],
+      });
+    });
+  });
+
+  it("should call handleFunctionEdit with a function when editing a saved Function", async () => {
+    const handleApplyFn = jest.fn();
+    const handleEditFn = jest.fn();
+    render(
+      <FunctionBuilder
+        canEdit={true}
+        handleApplyFunction={handleApplyFn}
+        handleFunctionEdit={handleEditFn}
+        cqlBuilderLookupsTypes={cqlBuilderLookup}
+        funct={funct}
+        operation="edit"
+      />
+    );
+    const functionNameInput = (await screen.findByTestId(
+      "function-name-text-input"
+    )) as HTMLInputElement;
+    const argumentsSection = screen.getByTestId(
+      "terminology-section-Arguments-sub-heading"
+    );
+    expect(functionNameInput).toBeInTheDocument();
+    expect(functionNameInput.value).toBe("isFinishedEncounter");
+    fireEvent.change(functionNameInput, {
+      target: { value: "IP" },
+    });
+    expect(functionNameInput.value).toBe("IP");
+
+    const definitionCommentTextBox = await screen.findByRole("textbox", {
+      name: "Comment",
+    });
+    expect(definitionCommentTextBox).toBeInTheDocument();
+    const definitionCommentInput = (await screen.findByTestId(
+      "function-comment-text"
+    )) as HTMLInputElement;
+    expect(definitionCommentInput.value).toBe("");
+    fireEvent.change(definitionCommentInput, {
+      target: { value: "comment" },
+    });
+    expect(definitionCommentInput.value).toBe("comment");
+
+    expect(
+      screen.getByTestId("terminology-section-Expression Editor-sub-heading")
+    ).toBeInTheDocument();
+    const typeInput = screen.getByTestId(
+      "type-selector-input"
+    ) as HTMLInputElement;
+    expect(typeInput).toBeInTheDocument();
+    expect(typeInput.value).toBe("");
+
+    fireEvent.change(typeInput, {
+      target: { value: "Timing" },
+    });
+    expect(typeInput.value).toBe("Timing");
+
+    const nameAutoComplete = screen.getByTestId("name-selector");
+    expect(nameAutoComplete).toBeInTheDocument();
+    const nameComboBox = within(nameAutoComplete).getByRole("combobox");
+    //name dropdown is populated with values based on type
+    await waitFor(() => expect(nameComboBox).toBeEnabled());
+
+    const nameDropDown = await screen.findByTestId("name-selector");
+    fireEvent.keyDown(nameDropDown, { key: "ArrowDown" });
+
+    const nameOptions = await screen.findAllByRole("option");
+    expect(nameOptions).toHaveLength(70);
+    const insertBtn = screen.getByTestId("expression-insert-btn");
+
+    expect(insertBtn).toBeInTheDocument();
+    expect(insertBtn).toBeDisabled();
+
+    fireEvent.click(nameOptions[0]);
+    expect(insertBtn).toBeEnabled();
+
+    fireEvent.click(insertBtn);
+    const definitionName = (await screen.findByTestId(
+      "function-name-text-input"
+    )) as HTMLInputElement;
+    expect(definitionName.value).toBe("IP");
+
+    const argumentNameInput = (await screen.findByTestId(
+      "argument-name-input"
+    )) as HTMLInputElement;
+    expect(argumentNameInput).toBeInTheDocument();
+    expect(argumentNameInput.value).toBe("");
+    fireEvent.change(argumentNameInput, {
+      target: { value: "Test" },
+    });
+    expect(argumentNameInput.value).toBe("Test");
+
+    const dataTypeDropdown = await screen.findByTestId(
+      "arg-type-selector-input"
+    );
+    fireEvent.change(dataTypeDropdown, {
+      target: { value: "Boolean" },
+    });
+
+    const addButton = screen.getByTestId("function-argument-add-btn");
+    expect(addButton).toBeInTheDocument();
+    expect(addButton).toBeEnabled();
+
+    fireEvent.click(addButton);
+
+    const functionArgumentTable = screen.getByTestId("function-argument-tbl");
+    expect(functionArgumentTable).toBeInTheDocument();
+    const tableRow = functionArgumentTable.querySelector("tbody").children[0];
+
+    const submitButton = screen.getByTestId("function-apply-btn");
+    expect(submitButton).toBeEnabled();
+    fireEvent.click(submitButton);
+
+    await waitFor(() => {
+      expect(handleEditFn).toHaveBeenCalled();
     });
   });