Merge pull request #351 from MeasureAuthoringTool/MAT-7407

MAT-7407 CQL - Definitions - Return Type field on Edit popup screen

Author: adongare

package-lock.json

@@ -53,6 +53,7 @@ export interface EditorPropsType {
   setIsCQLUnchanged?: Function;
   isCQLUnchanged?: boolean;
   resetCql?: () => void;
+  getCqlDefinitionReturnTypes?: () => void;
   // conditional props used to pass up annotations outside of the editor
   setOutboundAnnotations?: Function;
 }

src/AceEditor/madie-ace-editor.tsx

@@ -118,6 +118,11 @@ const props = {
   handleDefinitionDelete: jest.fn(),
   handleApplyLibrary: jest.fn(),
   handleDeleteLibrary: jest.fn(),
+  handleEditLibrary: jest.fn(),
+  handleDefinitionEdit: jest.fn(),
+  resetCql: jest.fn(),
+  getCqlDefinitionReturnTypes: jest.fn(),
+  makeExpanded: jest.fn(),
 };
 const { getByTestId } = screen;
 

src/CqlBuilderPanel/CqlBuilderPanel.test.tsx

@@ -31,6 +31,7 @@ export default function CqlBuilderPanel({
   handleDefinitionEdit,
   handleDefinitionDelete,
   resetCql,
+  getCqlDefinitionReturnTypes,
   makeExpanded,
 }) {
   const featureFlags = useFeatureFlags();
@@ -209,11 +210,11 @@ export default function CqlBuilderPanel({
             handleApplyDefinition={handleApplyDefinition}
             handleDefinitionDelete={handleDefinitionDelete}
             cqlBuilderLookupsTypes={cqlBuilderLookupsTypes}
-            setIsCQLUnchanged={setIsCQLUnchanged}
             isCQLUnchanged={isCQLUnchanged}
             cql={measureStoreCql}
             setEditorVal={setEditorVal}
             resetCql={resetCql}
+            getCqlDefinitionReturnTypes={getCqlDefinitionReturnTypes}
             handleDefinitionEdit={handleDefinitionEdit}
           />
         )}

src/CqlBuilderPanel/CqlBuilderPanel.tsx

@@ -5,18 +5,22 @@ import userEvent from "@testing-library/user-event";
 import { CqlBuilderLookup } from "../../model/CqlBuilderLookup";
 import { cqlBuilderLookup } from "../__mocks__/MockCqlBuilderLookupsTypes";
 
+const props = {
+  canEdit: true,
+  handleApplyDefinition: jest.fn(),
+  handleDefinitionEdit: jest.fn(),
+  handleDefinitionDelete: jest.fn(),
+  cqlBuilderLookupsTypes: {} as CqlBuilderLookup,
+  isCQLUnchanged: true,
+  cql: "",
+  setEditorVal: jest.fn(),
+  resetCql: jest.fn(),
+  getCqlDefinitionReturnTypes: jest.fn(),
+};
+
 describe("DefinitionsSection", () => {
   it("Should display definition section", async () => {
-    render(
-      <DefinitionsSection
-        canEdit={true}
-        handleApplyDefinition={jest.fn()}
-        cqlBuilderLookupsTypes={{} as CqlBuilderLookup}
-        handleDefinitionDelete={jest.fn()}
-        isCQLUnchanged
-        setIsCQLUnchanged
-      />
-    );
+    render(<DefinitionsSection {...props} />);
     const definition = await screen.findByTestId("definition-tab");
     const savedDefinitions = await screen.findByText("Saved Definitions (0)");
     expect(definition).toBeInTheDocument();
@@ -30,16 +34,7 @@ describe("DefinitionsSection", () => {
   });
 
   it("Should display saved definition section", async () => {
-    render(
-      <DefinitionsSection
-        canEdit={true}
-        handleApplyDefinition={jest.fn()}
-        handleDefinitionDelete={jest.fn()}
-        isCQLUnchanged
-        setIsCQLUnchanged
-        cqlBuilderLookupsTypes={{} as unknown as CqlBuilderLookup}
-      />
-    );
+    render(<DefinitionsSection {...props} />);
     const definition = await screen.findByTestId("definition-tab");
     const savedDefinitions = await screen.findByText("Saved Definitions (0)");
     expect(definition).toBeInTheDocument();
@@ -59,12 +54,8 @@ describe("DefinitionsSection", () => {
   it("Should allow pagination for savedDefinitions", async () => {
     render(
       <DefinitionsSection
-        canEdit={true}
-        handleApplyDefinition={jest.fn()}
+        {...props}
         cqlBuilderLookupsTypes={cqlBuilderLookup}
-        handleDefinitionDelete={jest.fn()}
-        isCQLUnchanged
-        setIsCQLUnchanged
       />
     );
     const definition = await screen.findByTestId("definition-tab");
@@ -99,12 +90,8 @@ describe("DefinitionsSection", () => {
   it("Should allow limit changes for savedDefinitions pagination", async () => {
     render(
       <DefinitionsSection
-        canEdit={true}
-        handleApplyDefinition={jest.fn()}
+        {...props}
         cqlBuilderLookupsTypes={cqlBuilderLookup}
-        handleDefinitionDelete={jest.fn()}
-        isCQLUnchanged
-        setIsCQLUnchanged
       />
     );
     const definition = await screen.findByTestId("definition-tab");
@@ -152,15 +139,36 @@ describe("DefinitionsSection", () => {
     });
   });
 
+  it("Should not show edit/delete actions for measure if user does not have permission", async () => {
+    render(
+      <DefinitionsSection
+        {...props}
+        cqlBuilderLookupsTypes={cqlBuilderLookup}
+        canEdit={false}
+      />
+    );
+    // go to saved definitions tab
+    const savedDefinitionsTab = screen.getByRole("tab", {
+      name: /Saved Definitions/i,
+    });
+    expect(savedDefinitionsTab).toBeInTheDocument();
+    userEvent.click(savedDefinitionsTab);
+    const table = screen.getByRole("table");
+    expect(table).toBeInTheDocument();
+    expect(screen.queryByTestId("definition-actions")).not.toBeInTheDocument();
+  });
+
   it("Should render edit definition dialog on edit button click", async () => {
+    const getCqlDefinitionReturnTypes = () => {
+      return {
+        sdeSex: "PatientCharacteristicSex",
+      };
+    };
     render(
       <DefinitionsSection
-        canEdit={true}
-        handleApplyDefinition={jest.fn()}
+        {...props}
         cqlBuilderLookupsTypes={cqlBuilderLookup}
-        handleDefinitionDelete={jest.fn()}
-        isCQLUnchanged
-        setIsCQLUnchanged
+        getCqlDefinitionReturnTypes={getCqlDefinitionReturnTypes}
       />
     );
     // go to saved definitions tab
@@ -182,5 +190,7 @@ describe("DefinitionsSection", () => {
     expect(screen.getByTestId("definition-name-text-input")).toHaveValue(
       "SDE Sex"
     );
+    const returnType = screen.getByTestId("return-type");
+    expect(returnType).toHaveTextContent(getCqlDefinitionReturnTypes().sdeSex);
   });
 });

src/CqlBuilderPanel/definitionsSection/DefinitionsSection.test.tsx

@@ -4,19 +4,18 @@ import DefinitionSectionNavTabs from "./DefinitionSectionNavTabs";
 import Definitions from "./definitions/Definitions";
 import DefinitionBuilder from "./definitionBuilder/DefinitionBuilder";
 import { CqlBuilderLookup } from "../../model/CqlBuilderLookup";
-import { ResetTvTwoTone } from "@mui/icons-material";
 
 interface DefinitionProps {
   canEdit: boolean;
   handleApplyDefinition: Function;
   handleDefinitionEdit: Function;
   handleDefinitionDelete: Function;
   cqlBuilderLookupsTypes: CqlBuilderLookup;
-  setIsCQLUnchanged: boolean;
   isCQLUnchanged: boolean;
   cql: string;
   setEditorVal: (cql: string) => void;
   resetCql: Function;
+  getCqlDefinitionReturnTypes: Function;
 }
 
 export default function DefinitionsSection({
@@ -29,6 +28,7 @@ export default function DefinitionsSection({
   cql,
   setEditorVal,
   resetCql,
+  getCqlDefinitionReturnTypes,
 }: DefinitionProps) {
   const [activeTab, setActiveTab] = useState<string>("definition");
 
@@ -54,12 +54,14 @@ export default function DefinitionsSection({
         )}
         {activeTab === "saved-definitions" && (
           <Definitions
+            canEdit={canEdit}
             definitions={measureDefinitions}
             isCQLUnchanged={isCQLUnchanged}
             cql={cql}
             setEditorValue={setEditorVal}
             handleDefinitionDelete={handleDefinitionDelete}
             resetCql={resetCql}
+            getCqlDefinitionReturnTypes={getCqlDefinitionReturnTypes}
             cqlBuilderLookup={cqlBuilderLookupsTypes}
             handleDefinitionEdit={handleDefinitionEdit}
           />

src/CqlBuilderPanel/definitionsSection/DefinitionsSection.tsx

@@ -16,6 +16,7 @@ export interface Definition {
   definitionName?: string;
   comment?: string;
   expressionValue?: string;
+  returnType?: string;
 }
 
 export interface DefinitionProps {
@@ -155,10 +156,10 @@ export default function DefinitionBuilder({
               {...formik.getFieldProps("definitionName")}
             />
           </div>
-          {definition && (
-            <div tw="w-1/2 ml-10 my-2">
+          {definition && definition.returnType && (
+            <div tw="w-1/2 ml-10 my-2" data-testid="return-type">
               <p className="result-label">Return Type</p>
-              <span className="result-value">-</span>
+              <span className="result-value">{definition.returnType}</span>
             </div>
           )}
         </div>

src/CqlBuilderPanel/definitionsSection/definitionBuilder/DefinitionBuilder.tsx

@@ -32,6 +32,7 @@ const DefinitionBuilderDialog = ({
   const updatedDefinition = {
     definitionName: definition?.name,
     expressionValue: getExpression(definition),
+    returnType: definition?.returnType,
   } as Definition;
 
   return (

src/CqlBuilderPanel/definitionsSection/definitionBuilderDialog/DefinitionBuilderDialog.tsx

@@ -1,4 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
+import _ from "lodash";
 import {
   ColumnDef,
   flexRender,
@@ -17,28 +18,33 @@ import BorderColorOutlinedIcon from "@mui/icons-material/BorderColorOutlined";
 import ToolTippedIcon from "../../../toolTippedIcon/ToolTippedIcon";
 import { CqlBuilderLookup, Lookup } from "../../../model/CqlBuilderLookup";
 import DefinitionBuilderDialog from "../definitionBuilderDialog/DefinitionBuilderDialog";
+import { Stack } from "@mui/material";
 
 const TH = tw.th`p-3 text-left text-sm font-bold capitalize`;
 const TD = tw.td`p-3 text-left text-sm break-all`;
 
 type DefinitionsPropTypes = {
+  canEdit: boolean;
   definitions: Lookup[];
   isCQLUnchanged: boolean;
   cql: string;
   setEditorValue: (cql) => void;
   handleDefinitionEdit?: Function;
   handleDefinitionDelete?: Function;
   resetCql: Function;
+  getCqlDefinitionReturnTypes: Function;
   cqlBuilderLookup: CqlBuilderLookup;
 };
 const Definitions = ({
+  canEdit,
   definitions,
   isCQLUnchanged,
   cql,
   setEditorValue,
   handleDefinitionEdit,
   handleDefinitionDelete,
   resetCql,
+  getCqlDefinitionReturnTypes,
   cqlBuilderLookup,
 }: DefinitionsPropTypes) => {
   const [deleteDialogOpen, setDeleteDialogOpen] = useState<boolean>(false);
@@ -77,7 +83,11 @@ const Definitions = ({
 
   const showEditDefinitionDialog = (index) => {
     const rowModal = table.getRow(index).original;
-    setSelectedDefinition(rowModal);
+    const returnTypes = getCqlDefinitionReturnTypes();
+    const returnType = returnTypes
+      ? returnTypes[_.camelCase(rowModal.name)]
+      : undefined;
+    setSelectedDefinition({ ...rowModal, returnType: returnType });
   };
 
   // table data
@@ -93,8 +103,15 @@ const Definitions = ({
         header: "",
         accessorKey: "apply",
         cell: (row: any) => {
+          if (!canEdit) {
+            return null;
+          }
           return (
-            <>
+            <Stack
+              direction="row"
+              alignItems="center"
+              data-testid="definition-actions"
+            >
               <ToolTippedIcon
                 tooltipMessage="Delete"
                 buttonProps={{
@@ -131,7 +148,7 @@ const Definitions = ({
               >
                 <BorderColorOutlinedIcon color="primary" />
               </ToolTippedIcon>
-            </>
+            </Stack>
           );
         },
       },

src/CqlBuilderPanel/definitionsSection/definitions/Definitions.tsx

@@ -34,6 +34,7 @@ const CqlEditorWithTerminology = ({
   setIsCQLUnchanged,
   isCQLUnchanged,
   resetCql,
+  getCqlDefinitionReturnTypes,
 }: EditorPropsType) => {
   const [expanded, setExpanded] = useState(true);
   const toggleSearch = () => {
@@ -113,6 +114,7 @@ const CqlEditorWithTerminology = ({
               handleEditLibrary={handleEditLibrary}
               handleDeleteLibrary={handleDeleteLibrary}
               resetCql={resetCql}
+              getCqlDefinitionReturnTypes={getCqlDefinitionReturnTypes}
             />
           </Allotment.Pane>
         )}