Big trash refactor (#16600)

### What does it do? 1. Adds new "Trash" menu item to the top menu 2. Fixes #14190 3. Fixes trash button icon color change when its inactive 4. Removes unnecessary styles 5. Adds a purge button to the edit resource page 6. The resource tree and trash button state are now updates when a resource is deleted/undeleted on the resource update page 7. Fixes trash button tooltip information when purging resources on the trash page 8. Now when a resource have been delete/undelete in the resource tree, the state of the resource update form (checkbox and buttons) updates 9. Fixes undefined text of the trash button tooltip 10. Adds purge resource menu item to the context menu in the resource tree ### Why is it needed? There are many errors when deleting/restoring/purging resources ### How to test 1. — 2. Click by the middle mouse button on the trash button on the toolbar 3. Hover over the trash button when its inactive, before the icon changed color, now when inactive it does not 4. — 5. Open the edit resource page, delete it and you will see a new purging button 6. If you delete or restore a resource on the edit page, the resource tree and the trash button in the toolbar remain unchanged. Now the resource tree and the trash button will change their state 7. On the trash page when purging resources, the state of the trash button in the toolbar was not updated, now it will be 8. Create a resource, open its edit page and delete the resource **in the resource tree**, the state of the checkbox and buttons in the edit form will not change. Now everything works as it should. 9. If you delete a resource and when you hover the trash button, it will be undefined in the tooltip. Now the information will be correct 10. Open the context menu of resource tree, delete the resource and open again ### Related issue(s)/PR(s) #14190 --------- Co-authored-by: Jan Peca <[email protected]> Co-authored-by: Jason Coward <[email protected]>
modxcms · Oct 8, 2024 · e155f60 · e155f60
1 parent c1f2213
commit e155f60
Show file tree

Hide file tree

Showing 26 changed files with 294 additions and 157 deletions.
diff --git a/_build/data/transport.core.menus.php b/_build/data/transport.core.menus.php
@@ -79,7 +79,14 @@
                         'action' => 'system/contenttype',
                     ],
                     // endregion
-
+                    // region: Trash
+                    [
+                        'text' => 'trash',
+                        'description' => 'trash_desc',
+                        'permissions' => 'menu_trash',
+                        'action' => 'resource/trash',
+                    ],
+                    // endregion
                 ],
             ],
             // endregion

diff --git a/_build/templates/default/sass/_buttons.scss b/_build/templates/default/sass/_buttons.scss
@@ -672,12 +672,6 @@ html.ext-strict body #modx-container .x-small-editor .x-form-text {
   font-weight: 400;
 }
 
-.tree-trash > em > button:before {
-  @extend %pseudo-font;
-  content: fa-content($fa-var-trash-alt);
-  font-weight: 400;
-}
-
 /* alignment overrides */
 #modx-leftbar .x-toolbar-ct .x-btn .tree-new-symlink > em > button {
   top: 4px;

diff --git a/_build/templates/default/sass/_tree.scss b/_build/templates/default/sass/_tree.scss
@@ -989,14 +989,15 @@
 #modx-leftbar-tabpanel__modx-trash-link {
   .icon {
     opacity: .5;
-    &:hover {
-      color: $red;
-    }
   }
 
   &.active {
     .icon {
       opacity: 1;
     }
+
+    &:hover .icon {
+      color: $red;
+    }
   }
 }
diff --git a/_build/templates/default/sass/index.scss b/_build/templates/default/sass/index.scss
@@ -663,7 +663,7 @@ a.x-grid-link:focus {
         background: scale-color($color: $red, $saturation: -10%, $lightness: 94%);
         font-weight: 400;
       }
-      // The "Call Stack" header row 
+      // The "Call Stack" header row
       &[bgcolor^="#e9b"] {
         background: $colorSplash;
         color: $white !important;
@@ -1685,6 +1685,15 @@ iframe[classname="x-hidden"] {
   color: $green;
 }
 
+#modx-abtn-purge {
+  background-color: $red;
+  color: $white;
+
+  &:hover {
+    background-color: darken($red, 10%);
+  }
+}
+
 #modx-abtn-help {
   color: $colorSplash;
 }

diff --git a/core/lexicon/en/resource.inc.php b/core/lexicon/en/resource.inc.php
@@ -45,6 +45,8 @@
 $_lang['resource_createdon'] = 'Created On';
 $_lang['resource_delete'] = 'Delete';
 $_lang['resource_delete_confirm'] = 'Are you sure you want to delete the resource: "[[+resource]]"?<br />NOTE: Any child resources will also be deleted!';
+$_lang['resource_purge'] = 'Erase resource';
+$_lang['resource_purge_confirm'] = 'Do you really want to finally erase the following resource: "[[+resource]]"?<br />WARNING: This cannot be undone.';
 $_lang['resource_description'] = 'Description';
 $_lang['resource_description_help'] = 'This is an optional description of the resource.';
 $_lang['resource_duplicate'] = 'Duplicate';

diff --git a/core/lexicon/en/topmenu.inc.php b/core/lexicon/en/topmenu.inc.php
@@ -119,6 +119,8 @@
 $_lang['tools_desc'] = 'Utilities to keep your site sorted';
 $_lang['topnav'] = 'Main Navigation';
 $_lang['topnav_desc'] = '';
+$_lang['trash'] = 'Trash';
+$_lang['trash_desc'] = 'Manage deleted resources.';
 $_lang['user'] = 'User';
 $_lang['usernav'] = 'User Navigation';
 $_lang['usernav_desc'] = '';

diff --git a/core/lexicon/en/trash.inc.php b/core/lexicon/en/trash.inc.php
@@ -21,7 +21,7 @@
 $_lang['trash.restore_all'] = 'Restore all';
 $_lang['trash.selected_purge'] = 'Erase selected resources';
 $_lang['trash.selected_restore'] = 'Restore selected resources';
-$_lang['trash.purge'] = 'Erase resource';
+$_lang['trash.purge'] = 'Erase';
 $_lang['trash.purge_confirm_title'] = 'Erase resource(s)?';
 $_lang['trash.purge_confirm_message'] = 'Do you really want to finally erase the following resource(s)? This cannot be undone.<hr>[[+list]]';
 $_lang['trash.purge_all_confirm_message'] = 'Do you really want to finally erase the listed [[+count]] resource(s)?<br><br><strong>This cannot be undone, and it affects all currently trashed resources in the grid.</strong><hr>[[+list]]';

diff --git a/core/src/Revolution/Processors/Resource/GetNodes.php b/core/src/Revolution/Processors/Resource/GetNodes.php
@@ -109,6 +109,7 @@ public function prepare()
             'edit_document' => $this->modx->hasPermission('edit_document') ? 'pedit' : '',
             'delete_document' => $this->modx->hasPermission('delete_document') ? 'pdelete' : '',
             'undelete_document' => $this->modx->hasPermission('undelete_document') ? 'pundelete' : '',
+            'purge_deleted' => $this->modx->hasPermission('purge_deleted') ? 'ppurge' : '',
             'publish_document' => $this->modx->hasPermission('publish_document') ? 'ppublish' : '',
             'unpublish_document' => $this->modx->hasPermission('unpublish_document') ? 'punpublish' : '',
             'resource_duplicate' => $this->modx->hasPermission('resource_duplicate') ? 'pduplicate' : '',

diff --git a/core/src/Revolution/Processors/Resource/GetToolbar.php b/core/src/Revolution/Processors/Resource/GetToolbar.php
@@ -91,12 +91,10 @@ public function process()
 
             $items[] = [
                 'id' => 'emptifier',
-                'cls' => 'tree-trash',
                 'tooltip' => $this->modx->lexicon('trash.manage_recycle_bin_tooltip', [
                     'count' => $deletedResources
                 ]),
-                'disabled' => ($deletedResources == 0) ? true : false,
-                'handler' => 'new Function("this.redirect(\"?a=resource/trash\");");'
+                'disabled' => $deletedResources === 0
             ];
         }
 

diff --git a/core/src/Revolution/Processors/Resource/Trash/Purge.php b/core/src/Revolution/Processors/Resource/Trash/Purge.php
@@ -198,9 +198,12 @@ public function process()
             }
         }
 
+        $deletedCount = $this->modx->getCount(modResource::class, ['deleted' => 1]);
+
         return $this->success($msg, [
             'count_success' => count($success),
-            'count_failures' => count($this->failures)
+            'count_failures' => count($this->failures),
+            'deletedCount' => $deletedCount,
         ]);
     }
 }
diff --git a/core/src/Revolution/modManagerController.php b/core/src/Revolution/modManagerController.php
@@ -138,6 +138,7 @@ public function prepareLanguage()
     {
         $this->modx->lexicon->load('action');
         $languageTopics = $this->getLanguageTopics();
+        $languageTopics[] = 'trash';
         foreach ($languageTopics as $topic) {
             $this->modx->lexicon->load($topic);
         }

diff --git a/manager/assets/modext/core/modx.layout.js b/manager/assets/modext/core/modx.layout.js
@@ -299,7 +299,7 @@ Ext.extend(MODx.Layout, Ext.Viewport, {
                 ,listeners: {
                     afterrender: function() {
                         const baseTabs = this,
-                              header = Ext.get('modx-leftbar-header')
+                            header = Ext.get('modx-leftbar-header')
                         ;
                         MODx.Ajax.request({
                             url: MODx.config.connector_url,
@@ -313,8 +313,25 @@ Ext.extend(MODx.Layout, Ext.Viewport, {
                                         if (trashTrigger) {
                                             const trashTab = baseTabs.add({
                                                 id: 'modx-trash-link',
-                                                title: '<i class="icon icon-trash-o"></i>',
-                                                handler: trashTrigger.handler
+                                                title: '<a href="?resource/trash"><i class="icon icon-trash-o"></i></a>',
+                                                updateState(deletedCount = 0) {
+                                                    const tab = this;
+                                                    const tabEl = tab.tabEl;
+                                                    const tooltipTarget = new Ext.Element(tabEl);
+
+                                                    if (deletedCount === 0) {
+                                                        tab.disable();
+                                                        tabEl.classList.remove('active');
+                                                    } else {
+                                                        tab.enable();
+                                                        tabEl.classList.add('active');
+                                                    }
+
+                                                    tab.tooltip = new Ext.ToolTip({
+                                                        target: tooltipTarget,
+                                                        title: _('trash.manage_recycle_bin_tooltip', { count: deletedCount }),
+                                                    });
+                                                },
                                             });
                                             if (!trashTrigger.disabled) {
                                                 trashTab.tabEl.classList.add('active');

diff --git a/manager/assets/modext/modx.jsgrps-min.js b/manager/assets/modext/modx.jsgrps-min.js
diff --git a/manager/assets/modext/sections/resource/update.js b/manager/assets/modext/sections/resource/update.js
@@ -107,35 +107,71 @@ Ext.extend(MODx.page.UpdateResource,MODx.Component,{
             }
             ,listeners: {
                 success: {fn:function(r) {
-                    var panel = Ext.getCmp('modx-panel-resource');
+                    const panel = Ext.getCmp('modx-panel-resource');
                     if (panel) {
                         panel.handlePreview(true);
                         panel.handleDeleted(true);
                     }
+
+                    Ext.getCmp('modx-resource-tree')?.refresh();
+                    Ext.getCmp('modx-trash-link')?.updateState(+r.object.deletedCount);
                 },scope:this}
             }
         });
     }
 
-    ,unDeleteResource: function(btn,e) {
+    ,unDeleteResource: function() {
         MODx.Ajax.request({
-            url: MODx.config.connector_url
-            ,params: {
-                action: 'Resource/Undelete'
-                ,id: this.config.resource
-            }
-            ,listeners: {
-                success: {fn:function(r) {
-                    var panel = Ext.getCmp('modx-panel-resource');
-                    if (panel) {
-                        panel.handlePreview(false);
-                        panel.handleDeleted(false);
-                    }
-                },scope:this}
+            url: MODx.config.connector_url,
+            params: {
+                action: 'Resource/Undelete',
+                id: this.config.resource,
+            },
+            listeners: {
+                success: {
+                    fn: function(r) {
+                        const panel = Ext.getCmp('modx-panel-resource');
+                        if (panel) {
+                            panel.handlePreview(false);
+                            panel.handleDeleted(false);
+                        }
+
+                        const tree = Ext.getCmp('modx-resource-tree');
+                        if (tree?.rendered) {
+                            tree.refresh();
+                        }
+
+                        Ext.getCmp('modx-trash-link')?.updateState(+r.object.deletedCount);
+                    },
+                    scope: this,
+                }
             }
         });
     }
 
+    ,purgeResource: function() {
+        MODx.msg.confirm({
+            text: _('resource_purge_confirm', {
+                resource: Ext.util.Format.htmlEncode(this.config.record.pagetitle) + ' ('+ this.config.resource + ')'
+            }),
+            url: MODx.config.connector_url,
+            params: {
+                action: 'Resource/Trash/Purge',
+                ids: this.config.resource,
+            },
+            listeners: {
+                success: {
+                    fn: function() {
+                        const fp = Ext.getCmp(this.config.formpanel);
+                        fp.warnUnsavedChanges = false;
+                        MODx.loadPage('?');
+                    },
+                    scope: this,
+                },
+            },
+        });
+    }
+
     ,cancel: function(btn,e) {
         var fp = Ext.getCmp(this.config.formpanel);
         if (fp && fp.isDirty()) {
@@ -213,6 +249,16 @@ Ext.extend(MODx.page.UpdateResource,MODx.Component,{
             });
         }
 
+        if (config.canPurge == 1 && !config.locked) {
+            buttons.push({
+                text: '<i class="icon icon-remove"></i>',
+                id: 'modx-abtn-purge',
+                handler: this.purgeResource,
+                hidden: !config.record.deleted,
+                scope: this,
+            });
+        }
+
         buttons.push({
             text: '<i class="icon icon-question-circle"></i>'
             ,id: 'modx-abtn-help'

diff --git a/manager/assets/modext/widgets/resource/modx.grid.trash.js b/manager/assets/modext/widgets/resource/modx.grid.trash.js
@@ -244,7 +244,7 @@ Ext.extend(MODx.grid.Trash, MODx.grid.Grid, {
                 'success': {
                     fn: function (data) {
                         this.getSelectionModel().clearSelections(true);
-                        this.refreshEverything(data.total);
+                        this.refreshEverything(data.object.deletedCount);
                     }, scope: this
                 },
                 'error': {
@@ -404,25 +404,7 @@ Ext.extend(MODx.grid.Trash, MODx.grid.Grid, {
     },
 
     refreshRecycleBinButton: function (total) {
-        var trashButton = Ext.getCmp('modx-trash-link');
-
-        if (total !== undefined) {
-            // if no resource is deleted, we disable the icon.
-            // otherwise we have to update the tooltip
-            if (total == 0) {
-                trashButton.disable();
-                trashButton.tooltip = new Ext.ToolTip({
-                    target: trashButton.tabEl,
-                    title: _('trash.manage_recycle_bin_tooltip')
-                });
-            } else {
-                trashButton.enable();
-                trashButton.tooltip = new Ext.ToolTip({
-                    target: trashButton.tabEl,
-                    title: _('trash.manage_recycle_bin_tooltip', {count: total})
-                });
-            }
-        }
+        Ext.getCmp('modx-trash-link')?.updateState(+total);
     },
 
     listResources: function (separator) {

diff --git a/manager/assets/modext/widgets/resource/modx.panel.resource.js b/manager/assets/modext/widgets/resource/modx.panel.resource.js
@@ -141,24 +141,30 @@ Ext.extend(MODx.panel.Resource,MODx.FormPanel,{
         }
     }
 
-    ,handleDeleted: function(deleted) {
-        if (this.config.canDelete == 1 && !this.config.locked) {
-            var deleteBtn = Ext.getCmp('modx-abtn-delete');
-            var unDeleteBtn = Ext.getCmp('modx-abtn-undelete');
-            var deleteChk = Ext.getCmp('modx-resource-deleted');
-            if (deleteBtn && unDeleteBtn) {
-                if (deleted) {
-                    deleteBtn.hide();
-                    unDeleteBtn.show();
-                } else {
-                    unDeleteBtn.hide();
-                    deleteBtn.show();
-                }
-            }
-            if (deleteChk) {
-                deleteChk.setValue(deleted);
+    ,handleDeleted: function(isDeleted) {
+        const canDelete = this.config.canDelete === 1 && !this.config.locked;
+
+        if (!canDelete) {
+            return;
+        }
+
+        const deleteButton = Ext.getCmp('modx-abtn-delete');
+        const unDeleteButton = Ext.getCmp('modx-abtn-undelete');
+        const purgeButton = Ext.getCmp('modx-abtn-purge');
+
+        if (deleteButton && unDeleteButton && purgeButton) {
+            if (isDeleted) {
+                deleteButton.hide();
+                purgeButton.show();
+                unDeleteButton.show();
+            } else {
+                deleteButton.show();
+                purgeButton.hide();
+                unDeleteButton.hide();
             }
         }
+
+        Ext.getCmp('modx-resource-deleted')?.setValue(isDeleted);
     }
 
     ,updateTree: function() {