From de3b7e1fee94aa0ea6570ddc173ab0e6fb8b0001 Mon Sep 17 00:00:00 2001
From: nmorasb <nate.moraca@semanticbits.com>
Date: Wed, 8 May 2024 12:07:09 -0400
Subject: [PATCH 1/2] MAT-7184: fetch full library object in preparation to
 draft a library

---
 .../cqlLibraryList/CqlLibraryList.test.tsx    | 35 +++++++++++++++----
 .../cqlLibraryList/CqlLibraryList.tsx         | 21 ++++++++---
 2 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/src/components/cqlLibraryList/CqlLibraryList.test.tsx b/src/components/cqlLibraryList/CqlLibraryList.test.tsx
index 0850182..cc20d38 100644
--- a/src/components/cqlLibraryList/CqlLibraryList.test.tsx
+++ b/src/components/cqlLibraryList/CqlLibraryList.test.tsx
@@ -195,7 +195,7 @@ describe("CqlLibrary List component", () => {
     );
   });
 
-  it("should display draft button for version libraries and on click should render dialog", () => {
+  it("should display draft button for version libraries and on click should render dialog", async () => {
     const cqlLibrary: CqlLibrary[] = [
       {
         id: "622e1f46d1fd3729d861e6cb",
@@ -212,6 +212,15 @@ describe("CqlLibrary List component", () => {
         cqlErrors: false,
       },
     ];
+
+    useCqlLibraryServiceMockResolved.fetchCqlLibrary = jest
+      .fn()
+      .mockResolvedValue(cqlLibrary[0]);
+
+    useCqlLibraryServiceMock.mockImplementation(() => {
+      return useCqlLibraryServiceMockResolved;
+    });
+
     render(
       <CqlLibraryList
         cqlLibraryList={cqlLibrary}
@@ -227,10 +236,18 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
   });
 
   it("should successfully draft a cql library", async () => {
+    useCqlLibraryServiceMockResolved.fetchCqlLibrary = jest
+      .fn()
+      .mockResolvedValue(cqlLibrary[0]);
+
+    useCqlLibraryServiceMock.mockImplementation(() => {
+      return useCqlLibraryServiceMockResolved;
+    });
+
     render(
       <CqlLibraryList
         cqlLibraryList={[{ ...cqlLibrary[0], draft: false }]}
@@ -245,7 +262,7 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
     const cqlLibraryNameInput = screen.getByRole("textbox", {
       name: "CQL Library Name",
     });
@@ -267,6 +284,7 @@ describe("CqlLibrary List component", () => {
     };
     const useCqlLibraryServiceMockRejected = {
       createDraft: jest.fn().mockRejectedValue(error),
+      fetchCqlLibrary: jest.fn().mockResolvedValue(cqlLibrary[0]),
     } as unknown as CqlLibraryServiceApi;
 
     useCqlLibraryServiceMock.mockImplementation(() => {
@@ -288,7 +306,7 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
     const cqlLibraryNameInput = screen.getByRole("textbox", {
       name: "CQL Library Name",
     });
@@ -312,6 +330,7 @@ describe("CqlLibrary List component", () => {
     };
     const useCqlLibraryServiceMockRejected = {
       createDraft: jest.fn().mockRejectedValue(error),
+      fetchCqlLibrary: jest.fn().mockResolvedValue(cqlLibrary[0]),
     } as unknown as CqlLibraryServiceApi;
 
     useCqlLibraryServiceMock.mockImplementation(() => {
@@ -332,7 +351,7 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
     const cqlLibraryNameInput = screen.getByRole("textbox", {
       name: "CQL Library Name",
     });
@@ -357,6 +376,7 @@ describe("CqlLibrary List component", () => {
     };
     const useCqlLibraryServiceMockRejected = {
       createDraft: jest.fn().mockRejectedValue(error),
+      fetchCqlLibrary: jest.fn().mockResolvedValue(cqlLibrary[0]),
     } as unknown as CqlLibraryServiceApi;
 
     useCqlLibraryServiceMock.mockImplementation(() => {
@@ -378,7 +398,7 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
     const cqlLibraryNameInput = screen.getByRole("textbox", {
       name: "CQL Library Name",
     });
@@ -403,6 +423,7 @@ describe("CqlLibrary List component", () => {
     };
     const useCqlLibraryServiceMockRejected = {
       createDraft: jest.fn().mockRejectedValue(error),
+      fetchCqlLibrary: jest.fn().mockResolvedValue(cqlLibrary[0]),
     } as unknown as CqlLibraryServiceApi;
 
     useCqlLibraryServiceMock.mockImplementation(() => {
@@ -423,7 +444,7 @@ describe("CqlLibrary List component", () => {
       `create-new-draft-${cqlLibrary[0].id}-button`
     );
     userEvent.click(draftButton);
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
     const cqlLibraryNameInput = screen.getByRole("textbox", {
       name: "CQL Library Name",
     });
diff --git a/src/components/cqlLibraryList/CqlLibraryList.tsx b/src/components/cqlLibraryList/CqlLibraryList.tsx
index 5e92861..410883e 100644
--- a/src/components/cqlLibraryList/CqlLibraryList.tsx
+++ b/src/components/cqlLibraryList/CqlLibraryList.tsx
@@ -355,10 +355,23 @@ export default function CqlLibraryList({ cqlLibraryList, onListUpdate }) {
                 <button
                   data-testid={`create-new-draft-${selectedCQLLibrary.id}-button`}
                   onClick={() => {
-                    setCreateDraftDialog({
-                      open: true,
-                      cqlLibrary: selectedCQLLibrary,
-                    });
+                    cqlLibraryServiceApi
+                      .fetchCqlLibrary(selectedCQLLibrary.id)
+                      .then((cqlLibrary) => {
+                        setSelectedCqlLibrary(cqlLibrary);
+                        setCreateDraftDialog({
+                          open: true,
+                          cqlLibrary: cqlLibrary,
+                        });
+                      })
+                      .catch(() => {
+                        setSnackBar({
+                          message:
+                            "An error occurred while fetching the CQL Library!",
+                          open: true,
+                          severity: "error",
+                        });
+                      });
                     setOptionsOpen(false);
                     setAnchorEl(null);
                   }}

From 6eec91d7801925db940f91d56d9a771be5917c4e Mon Sep 17 00:00:00 2001
From: nmorasb <nate.moraca@semanticbits.com>
Date: Wed, 8 May 2024 13:02:17 -0400
Subject: [PATCH 2/2] MAT-7184: move draft click logic to its own function per
 review comment

---
 .../cqlLibraryList/CqlLibraryList.tsx         | 43 ++++++++++---------
 1 file changed, 22 insertions(+), 21 deletions(-)

diff --git a/src/components/cqlLibraryList/CqlLibraryList.tsx b/src/components/cqlLibraryList/CqlLibraryList.tsx
index 410883e..128f7f2 100644
--- a/src/components/cqlLibraryList/CqlLibraryList.tsx
+++ b/src/components/cqlLibraryList/CqlLibraryList.tsx
@@ -215,6 +215,27 @@ export default function CqlLibraryList({ cqlLibraryList, onListUpdate }) {
     setAnchorEl(null);
   };
 
+  const onDraftClicked = (selectedCQLLibrary: CqlLibrary) => {
+    cqlLibraryServiceApi
+      .fetchCqlLibrary(selectedCQLLibrary.id)
+      .then((cqlLibrary) => {
+        setSelectedCqlLibrary(cqlLibrary);
+        setCreateDraftDialog({
+          open: true,
+          cqlLibrary: cqlLibrary,
+        });
+      })
+      .catch(() => {
+        setSnackBar({
+          message: "An error occurred while fetching the CQL Library!",
+          open: true,
+          severity: "error",
+        });
+      });
+    setOptionsOpen(false);
+    setAnchorEl(null);
+  };
+
   return (
     <div data-testid="cqlLibrary-list">
       <Snackbar
@@ -354,27 +375,7 @@ export default function CqlLibraryList({ cqlLibraryList, onListUpdate }) {
               {!selectedCQLLibrary.draft && canEdit && (
                 <button
                   data-testid={`create-new-draft-${selectedCQLLibrary.id}-button`}
-                  onClick={() => {
-                    cqlLibraryServiceApi
-                      .fetchCqlLibrary(selectedCQLLibrary.id)
-                      .then((cqlLibrary) => {
-                        setSelectedCqlLibrary(cqlLibrary);
-                        setCreateDraftDialog({
-                          open: true,
-                          cqlLibrary: cqlLibrary,
-                        });
-                      })
-                      .catch(() => {
-                        setSnackBar({
-                          message:
-                            "An error occurred while fetching the CQL Library!",
-                          open: true,
-                          severity: "error",
-                        });
-                      });
-                    setOptionsOpen(false);
-                    setAnchorEl(null);
-                  }}
+                  onClick={() => onDraftClicked(selectedCQLLibrary)}
                 >
                   Draft
                 </button>