Update e2e test for editing a folder with templates

cypress/integration/draftTemplates.spec.js

@@ -152,5 +152,22 @@ describe("draft selections and templates", function () {
       // Check that the draft works normlly as its title should be updated
       cy.get("[aria-label='Edit submission']").click()
       cy.get("[data-testid='title']").should("have.value", "Sample draft title edited")
+
+      // Check that editing a draft folder with adding a new template also works
+      // Navigate to home & find folder
+      cy.findDraftFolder("Test name")
+      cy.get('button[aria-label="Edit current folder"]').contains("Edit").click()
+
+      // Select a new Study template
+      cy.get("[data-testid='toggle-user-drafts']", { timeout: 10000 }).click()
+      cy.get("[data-testid='form-template-study']").within(() => {
+        cy.get("input").first().check()
+      })
+      cy.get("button[type=button]").contains("Next").click()
+
+      cy.wait(500)
+      // Check that the new template is added as a draft
+      cy.clickFillForm("Study")
+      cy.get("[data-testid='Draft-objects']").children().should("have.length", 2)
     })
 })

cypress/integration/pagination.spec.js

@@ -325,70 +325,70 @@ describe("unpublished folders, published folders, and user's draft templates pag
     cy.login()
     // Mock response for GET user
     const userResponse = {
-      drafts: [
+      templates: [
         {
           accessionId: "TESTID1",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID2",
-          schema: `draft-sample`,
+          schema: `template-sample`,
         },
         {
           accessionId: "TESTD3",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID4",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID5",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID6",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID7",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID8",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID9",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID10",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID11",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID12",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID13",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID14",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID15",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
         {
           accessionId: "TESTID1",
-          schema: `draft-study`,
+          schema: `template-study`,
         },
       ],
       folders: [],
@@ -406,11 +406,11 @@ describe("unpublished folders, published folders, and user's draft templates pag
     cy.login()
     // Check Draft-study pagination
 
-    cy.get("div[data-schema='draft-study'] > span").should("have.length", "10")
+    cy.get("div[data-schema='template-study'] > span").should("have.length", "10")
     cy.get("p").contains("1-10 of 15").should("be.visible")
     cy.get("[data-testid='page info']").contains("1 of 2 pages").should("be.visible")
 
-    cy.get("div[data-testid='form-draft-study']").within(() => {
+    cy.get("div[data-testid='form-template-study']").within(() => {
       cy.get("button[aria-label='next page']").click()
       cy.get("p").contains("11-15 of 15", { timeout: 10000 }).should("be.visible")
       cy.get("[data-testid='page info']").contains("2 of 2 pages").should("be.visible")
@@ -419,11 +419,11 @@ describe("unpublished folders, published folders, and user's draft templates pag
     cy.get("li[data-value='15']")
       .should("be.visible")
       .then($el => $el.click())
-    cy.get("div[data-schema='draft-study'] > span").should("have.length", "15")
+    cy.get("div[data-schema='template-study'] > span").should("have.length", "15")
 
     // Check Draft-sample pagination
 
-    cy.get("div[data-schema='draft-sample'] > span").should("have.length", "1")
+    cy.get("div[data-schema='template-sample'] > span").should("have.length", "1")
     cy.get("p").contains("1-1 of 1").should("be.visible")
   })
 })

src/components/NewDraftWizard/WizardHooks/WizardTransformTemplatesToDrafts.js

@@ -4,14 +4,14 @@ import { WizardStatus } from "constants/wizardStatus"
 import { updateStatus } from "features/wizardStatusMessageSlice"
 import draftAPIService from "services/draftAPI"
 import templateAPIService from "services/templateAPI"
-import type { ObjectInsideFolder } from "types"
+import type { ObjectInsideFolder, ObjectInsideFolderWithTags } from "types"
 import { getObjectDisplayTitle, getOrigObjectType } from "utils"
 
 const transformTemplatesToDrafts = async (
   templateAccessionIds: Array<string>,
   templates: Array<ObjectInsideFolder>,
   dispatch: any
-): any => {
+): Promise<Array<ObjectInsideFolderWithTags>> => {
   const userTemplates = templates.map(template => ({
     ...template,
     schema: getOrigObjectType(template.schema),

src/components/NewDraftWizard/WizardSteps/WizardCreateFolderStep.js

@@ -19,6 +19,7 @@ import WizardStatusMessageHandler from "../WizardForms/WizardStatusMessageHandle
 import UserDraftTemplates from "components/Home/UserDraftTemplates"
 import transformTemplatesToDrafts from "components/NewDraftWizard/WizardHooks/WizardTransformTemplatesToDrafts"
 import { WizardStatus } from "constants/wizardStatus"
+import { resetTemplateAccessionIds } from "features/templatesSlice"
 import { createNewDraftFolder, updateNewDraftFolder } from "features/wizardSubmissionFolderSlice"
 import type { FolderDataFromForm, CreateFolderFormRef } from "types"
 
@@ -78,17 +79,23 @@ const CreateFolderForm = ({ createFolderFormRef }: { createFolderFormRef: Create
 
   const onSubmit = async (data: FolderDataFromForm) => {
     setConnError(false)
+    // Transform the format of templates to drafts with proper values to be added to current folder or new folder
+    const selectedDraftsArray = await transformTemplatesToDrafts(templateAccessionIds, user.templates, dispatch)
+
     if (folder && folder?.folderId) {
-      dispatch(updateNewDraftFolder(folder.folderId, Object.assign({ ...data, folder })))
-        .then(() => history.push({ pathname: "/newdraft", search: "step=1" }))
+      dispatch(updateNewDraftFolder(folder.folderId, Object.assign({ ...data, folder, selectedDraftsArray })))
+        .then(() => {
+          history.push({ pathname: "/newdraft", search: "step=1" })
+          dispatch(resetTemplateAccessionIds())
+        })
         .catch(() => setConnError(true))
     } else {
-      // Get an array of drafts which have proper values to be added to new folder
-      const draftsArray = await transformTemplatesToDrafts(templateAccessionIds, user.templates, dispatch)
-
       // Create a new folder with selected templates as drafts
-      dispatch(createNewDraftFolder(data, draftsArray))
-        .then(() => history.push({ pathname: "/newdraft", search: "step=1" }))
+      dispatch(createNewDraftFolder(data, selectedDraftsArray))
+        .then(() => {
+          history.push({ pathname: "/newdraft", search: "step=1" })
+          dispatch(resetTemplateAccessionIds())
+        })
         .catch(error => {
           setConnError(true)
           setResponseError(JSON.parse(error))

src/features/wizardSubmissionFolderSlice.js

@@ -84,17 +84,27 @@ export const createNewDraftFolder =
 export const updateNewDraftFolder =
   (
     folderId: string,
-    folderDetails: FolderDataFromForm & { folder: Object }
+    folderDetails: FolderDataFromForm & { folder: Object } & { selectedDraftsArray: Array<ObjectInsideFolderWithTags> }
   ): ((dispatch: (any) => void) => Promise<any>) =>
   async (dispatch: any => void) => {
+    const { selectedDraftsArray } = folderDetails
+    // Add templates as selectedDrafts to current drafts in case there is any
+    const updatedDrafts =
+      selectedDraftsArray.length > 0
+        ? folderDetails.folder.drafts.concat(selectedDraftsArray)
+        : folderDetails.folder.drafts
+
     const updatedFolder = _extend(
       { ...folderDetails.folder },
-      { name: folderDetails.name, description: folderDetails.description }
+      { name: folderDetails.name, description: folderDetails.description, drafts: updatedDrafts }
     )
+
     const changes = [
       { op: "add", path: "/name", value: folderDetails.name },
       { op: "add", path: "/description", value: folderDetails.description },
+      { op: "add", path: "/drafts/-", value: updatedDrafts },
     ]
+
     const response = await folderAPIService.patchFolderById(folderId, changes)
 
     return new Promise((resolve, reject) => {