[IMP] website: improve code for duplicate and new page

in this commit, throw the wizard to enter the new page name, while duplicating
page button and new duplicate page button added in the page properties dialog.
updated the test case related to duplicate page along with duplicate menu
consideration.

task-2088546
closes #40085

Co-authored-by: jpr-odoo <jpr@openerp.com>

2 files changed, 50 insertions, 10 deletions

diff --git a/addons/website/static/src/js/menu/content.js b/addons/website/static/src/js/menu/content.js
index b8743f27932..d8be9ba80ff 100644
--- a/addons/website/static/src/js/menu/content.js
+++ b/addons/website/static/src/js/menu/content.js
@@ -44,22 +44,32 @@ var PagePropertiesDialog = weWidgets.Dialog.extend({
 
         var buttons = [
             {text: _t("Save"), classes: 'btn-primary', click: this.save},
-            {text: _t("Discard"), close: true},
+            {text: _t("Discard"), classes: 'mr-auto', close: true},
         ];
         if (options.fromPageManagement) {
             buttons.push({
                 text: _t("Go To Page"),
                 icon: 'fa-globe',
-                classes: 'btn-link float-right',
+                classes: 'btn-link',
                 click: function (e) {
                     window.location.href = '/' + self.page.url;
                 },
             });
         }
         buttons.push({
+            text: _t("Duplicate Page"),
+            icon: 'fa-clone',
+            classes: 'btn-link',
+            click: function (e) {
+                // modal('hide') will break the rpc, so hide manually
+                this.$el.closest('.modal').addClass('d-none');
+                _clonePage.call(this, self.page_id);
+            },
+        });
+        buttons.push({
             text: _t("Delete Page"),
             icon: 'fa-trash',
-            classes: 'btn-link float-right',
+            classes: 'btn-link',
             click: function (e) {
                 _deletePage.call(this, self.page_id, options.fromPageManagement);
             },
@@ -985,13 +995,7 @@ var PageManagement = Widget.extend({
     },
     _onClonePageButtonClick: function (ev) {
         var pageId = $(ev.currentTarget).data('id');
-        this._rpc({
-            model: 'website.page',
-            method: 'clone_page',
-            args: [pageId],
-        }).then(function (path) {
-            window.location.href = path;
-        });
+        _clonePage.call(this, pageId);
     },
     _onDeletePageButtonClick: function (ev) {
         var pageId = $(ev.currentTarget).data('id');
@@ -1040,6 +1044,33 @@ function _deletePage(pageId, fromPageManagement) {
         }, reject);
     });
 }
+/**
+ * Duplicate the page after showing the wizard to enter new page name.
+ *
+ * @private
+ * @param {integer} pageId - The ID of the page to be duplicate
+ *
+ */
+function _clonePage(pageId) {
+    var self = this;
+    new Promise(function (resolve, reject) {
+        Dialog.confirm(this, undefined, {
+            title: _t("Duplicate Page"),
+            $content: $(qweb.render('website.duplicate_page_action_dialog')),
+            confirm_callback: function () {
+                var new_page_name =  this.$('#page_name').val();
+                return self._rpc({
+                    model: 'website.page',
+                    method: 'clone_page',
+                    args: [pageId, new_page_name],
+                }).then(function (path) {
+                    window.location.href = path;
+                }).guardedCatch(reject);
+            },
+            cancel_callback: reject,
+        }).on('closed', null, reject);
+    });
+}
 
 websiteNavbarData.websiteNavbarRegistry.add(ContentMenu, '#content-menu');
 websiteRootData.websiteRootRegistry.add(PageManagement, '#list_website_pages');
diff --git a/addons/website/static/src/xml/website.xml b/addons/website/static/src/xml/website.xml
index d4193d7cbc2..a8af566ecfb 100644
--- a/addons/website/static/src/xml/website.xml
+++ b/addons/website/static/src/xml/website.xml
@@ -76,4 +76,13 @@
         </div>
         <t t-call="website.dependencies"/>
     </div>
+
+    <div t-name="website.duplicate_page_action_dialog">
+        <div class="form-group row">
+            <label class="col-form-label col-md-3" for="page_name">Page Name</label>
+            <div class="col-md-9">
+                <input type="text" class="form-control" id="page_name"/>
+            </div>
+        </div>
+    </div>
 </templates>