fix(app-page-builder): duplicate page inside original folder (#3866)

webiny · Feb 12, 2024 · 9defab4 · 9defab4
1 parent 220bf61
commit 9defab4
Show file tree

Hide file tree

Showing 7 changed files with 111 additions and 8 deletions.
diff --git a/packages/api-page-builder/__tests__/graphql/graphql/pages.ts b/packages/api-page-builder/__tests__/graphql/graphql/pages.ts
@@ -215,6 +215,21 @@ export const createPageUpdateGraphQl = (params: CreateDataFieldsParams = {}) =>
 
 export const UPDATE_PAGE = createPageUpdateGraphQl();
 
+export const createPageDuplicateGraphQl = (params: CreateDataFieldsParams = {}) => {
+    return /* GraphQL */ `
+        mutation DuplicatePage($id: ID!, $meta: JSON) {
+            pageBuilder {
+                duplicatePage(id: $id, meta: $meta) {
+                    data ${createDataFields(params)}
+                    error ${ERROR_FIELD}
+                }
+            }
+        }
+    `;
+};
+
+export const DUPLICATE_PAGE = createPageDuplicateGraphQl();
+
 export const PUBLISH_PAGE = /* GraphQL */ `
     mutation PublishPage($id: ID!) {
         pageBuilder {

diff --git a/packages/api-page-builder/__tests__/graphql/lifecycleEvents.pages.test.ts b/packages/api-page-builder/__tests__/graphql/lifecycleEvents.pages.test.ts
@@ -10,8 +10,15 @@ describe("Page Lifecycle Events", () => {
         plugins: [assignPageLifecycleEvents()]
     });
 
-    const { createCategory, createPage, deletePage, updatePage, publishPage, unpublishPage } =
-        handler;
+    const {
+        createCategory,
+        createPage,
+        deletePage,
+        duplicatePage,
+        updatePage,
+        publishPage,
+        unpublishPage
+    } = handler;
 
     const createDummyPage = async (): Promise<PageData> => {
         const [response] = await createPage({
@@ -136,6 +143,31 @@ describe("Page Lifecycle Events", () => {
         expect(tracker.isExecutedOnce("page:afterUnpublish")).toEqual(false);
     });
 
+    it("should trigger duplicate lifecycle events", async () => {
+        const [response] = await duplicatePage({
+            id: dummyPage.id,
+            meta: {
+                folderId: "any-folder-id"
+            }
+        });
+
+        expect(response.data.pageBuilder.duplicatePage.data.title).toContain(" (Copy)");
+        expect(response.data.pageBuilder.duplicatePage.data.path).toContain("-copy");
+
+        expect(tracker.isExecutedOnce("page:beforeCreate")).toEqual(true);
+        expect(tracker.isExecutedOnce("page:afterCreate")).toEqual(true);
+        expect(tracker.isExecutedOnce("page:beforeCreateFrom")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:afterCreateFrom")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:beforeUpdate")).toEqual(true);
+        expect(tracker.isExecutedOnce("page:afterUpdate")).toEqual(true);
+        expect(tracker.isExecutedOnce("page:beforeDelete")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:afterDelete")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:beforePublish")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:afterPublish")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:beforeUnpublish")).toEqual(false);
+        expect(tracker.isExecutedOnce("page:afterUnpublish")).toEqual(false);
+    });
+
     it("should trigger delete lifecycle events", async () => {
         const [response] = await deletePage({
             id: dummyPage.id

diff --git a/packages/api-page-builder/__tests__/graphql/pages.test.ts b/packages/api-page-builder/__tests__/graphql/pages.test.ts
@@ -18,6 +18,7 @@ describe("CRUD Test", () => {
         createPageBlock,
         createPageElement,
         deletePage,
+        duplicatePage,
         listPages,
         getPage,
         updatePage,
@@ -604,4 +605,50 @@ describe("CRUD Test", () => {
         );
         expect(updatePageResponse.data.pageBuilder.updatePage.data).toBeNull();
     });
+
+    it("should duplicate a page", async () => {
+        // Let's create a page and update it with some data
+        await createCategory({
+            data: {
+                slug: `slug`,
+                name: `name`,
+                url: `/some-url/`,
+                layout: `layout`
+            }
+        });
+
+        const [createPageResponse] = await createPage({
+            category: "slug"
+        });
+
+        const id = createPageResponse.data.pageBuilder.createPage.data.id;
+        const content = createPageContent("1MB");
+        const settings = {
+            general: {
+                snippet: "any-snippet"
+            }
+        };
+
+        await updatePage({
+            id,
+            data: {
+                content,
+                settings
+            }
+        });
+
+        // Let's duplicate the page
+        const [duplicatePageResponse] = await duplicatePage({
+            id
+        });
+
+        expect(duplicatePageResponse.data.pageBuilder.duplicatePage.data.title).toContain(
+            " (Copy)"
+        );
+        expect(duplicatePageResponse.data.pageBuilder.duplicatePage.data.path).toContain("-copy");
+        expect(duplicatePageResponse.data.pageBuilder.duplicatePage.data.content).toEqual(content);
+        expect(
+            duplicatePageResponse.data.pageBuilder.duplicatePage.data.settings.general.snippet
+        ).toEqual(settings.general.snippet);
+    });
 });
diff --git a/packages/api-page-builder/__tests__/graphql/useGqlHandler.ts b/packages/api-page-builder/__tests__/graphql/useGqlHandler.ts
@@ -27,6 +27,7 @@ import {
 import {
     CREATE_PAGE,
     DELETE_PAGE,
+    DUPLICATE_PAGE,
     GET_PAGE,
     GET_PUBLISHED_PAGE,
     LIST_PAGE_TAGS,
@@ -240,6 +241,9 @@ export default ({ permissions, identity, plugins }: Params = {}) => {
         async createPage(variables: Record<string, any>) {
             return invoke({ body: { query: CREATE_PAGE, variables } });
         },
+        async duplicatePage(variables: Record<string, any>) {
+            return invoke({ body: { query: DUPLICATE_PAGE, variables } });
+        },
         async updatePage(variables: Record<string, any>) {
             return invoke({ body: { query: UPDATE_PAGE, variables } });
         },

diff --git a/packages/api-page-builder/src/graphql/graphql/pages.gql.ts b/packages/api-page-builder/src/graphql/graphql/pages.gql.ts
@@ -241,7 +241,7 @@ const createBasePageGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
                     updatePage(id: ID!, data: PbUpdatePageInput!): PbPageResponse
 
                     # Duplicate page by given ID.
-                    duplicatePage(id: ID!): PbPageResponse
+                    duplicatePage(id: ID!, meta: JSON): PbPageResponse
 
                     unlinkPageFromTemplate(id: ID!): PbPageResponse
 
@@ -473,9 +473,11 @@ const createBasePageGraphQL = (): GraphQLSchemaPlugin<PbContext> => {
 
                     duplicatePage: async (_, args: any, context) => {
                         try {
-                            const page = await context.pageBuilder.getPage(args.id);
+                            const { id, meta } = args;
+                            const page = await context.pageBuilder.getPage(id);
                             const { id: duplicatedPageId } = await context.pageBuilder.createPage(
-                                page.category
+                                page.category,
+                                meta
                             );
 
                             const duplicatedPageData = {

diff --git a/packages/app-page-builder/src/admin/graphql/pages.ts b/packages/app-page-builder/src/admin/graphql/pages.ts
@@ -95,9 +95,9 @@ export const CREATE_PAGE_FROM_TEMPLATE = gql`
 `;
 
 export const DUPLICATE_PAGE = gql`
-    mutation PbDuplicatePage($id: ID!) {
+    mutation PbDuplicatePage($id: ID!, $meta: JSON) {
         pageBuilder {
-            duplicatePage(id: $id) {
+            duplicatePage(id: $id, meta: $meta) {
                 data {
                     ${LIST_PAGES_DATA_FIELDS}
                 }

diff --git a/...app-page-builder/src/admin/plugins/pageDetails/header/pageOptionsMenu/PageOptionsMenu.tsx b/...app-page-builder/src/admin/plugins/pageDetails/header/pageOptionsMenu/PageOptionsMenu.tsx
@@ -70,7 +70,10 @@ const PageOptionsMenu = (props: PageOptionsMenuProps) => {
         try {
             await client.mutate({
                 mutation: DUPLICATE_PAGE,
-                variables: { id: page.id },
+                variables: {
+                    id: page.id,
+                    meta: { location: { folderId: page.wbyAco_location.folderId } }
+                },
                 async update(cache, { data }) {
                     if (data.pageBuilder.duplicatePage.error) {
                         return;