From a501c3c84bd425a2104da2871ace34d7ea041b29 Mon Sep 17 00:00:00 2001 From: mgiannopoulos24 <79588074+mgiannopoulos24@users.noreply.github.com> Date: Thu, 18 Dec 2025 20:55:59 +0200 Subject: [PATCH 1/6] Implement Snippet Lock Feature to Prevent Accidental Deletion and Modification --- src/css/edit/_sidebar.scss | 38 +++++++++++--- src/css/manage.scss | 25 +++++++-- .../EditorSidebar/EditorSidebar.tsx | 5 +- .../EditorSidebar/actions/DeleteButton.tsx | 4 +- .../EditorSidebar/controls/LockControl.tsx | 52 +++++++++++++++++++ src/js/hooks/useSnippetForm.tsx | 7 ++- src/js/hooks/useSubmitSnippet.ts | 34 +++++++----- src/js/types/Snippet.ts | 3 +- src/js/types/schema/SnippetSchema.ts | 3 +- src/js/utils/snippets/api.ts | 4 +- src/js/utils/snippets/objects.ts | 4 +- src/php/class-db.php | 8 ++- src/php/class-list-table.php | 46 ++++++++++++---- src/php/class-snippet.php | 7 ++- .../class-snippets-rest-controller.php | 6 ++- src/php/snippet-ops.php | 25 ++++++++- 16 files changed, 223 insertions(+), 48 deletions(-) create mode 100644 src/js/components/EditorSidebar/controls/LockControl.tsx diff --git a/src/css/edit/_sidebar.scss b/src/css/edit/_sidebar.scss index 919ce70e..7eac0bcc 100644 --- a/src/css/edit/_sidebar.scss +++ b/src/css/edit/_sidebar.scss @@ -23,14 +23,19 @@ .delete-button { color: #cc1818; - &:hover { + &:hover:not(:disabled) { color: #9e1313; } - &:focus { + &:focus:not(:disabled) { color: #710d0d; border-color: #710d0d; } + + &:disabled { + color: #a7aaad; + cursor: not-allowed; + } } .help-tooltip { @@ -61,6 +66,19 @@ > :last-child { margin-inline-start: auto; } + + &.lock-control-container { + border-block-start: 1px solid #eee; + padding-block-start: 1em; + margin-block-start: 0.5em; + + .description { + flex-basis: 100%; + margin-block-start: 4px; + color: #646970; + font-style: italic; + } + } } .block-form-field { @@ -108,11 +126,15 @@ p.submit { padding-block-start: 0; } -.activation-switch-container label { - display: flex; - flex-flow: row; - gap: 5px; - justify-content: center; +.activation-switch-container, +.lock-control-container { + label { + display: flex; + flex-flow: row; + gap: 5px; + justify-content: center; + align-items: center; + } } .shortcode-tag-wrapper { @@ -152,4 +174,4 @@ p.submit { .components-spinner { block-size: 12px; } -} +} \ No newline at end of file diff --git a/src/css/manage.scss b/src/css/manage.scss index f3a4a373..0340d2be 100644 --- a/src/css/manage.scss +++ b/src/css/manage.scss @@ -10,7 +10,7 @@ @use 'common/direction'; @use 'common/select'; @use 'manage/cloud'; - + .column-name, .column-type { .dashicons { @@ -23,6 +23,17 @@ .dashicons-clock { vertical-align: middle; } + + .dashicons-lock { + color: #646970; + margin-inline-start: 4px; + opacity: 0.7; + cursor: help; + + &:hover { + opacity: 1; + } + } } .active-snippet .column-name > .snippet-name { @@ -91,6 +102,14 @@ color: #ddd; position: relative; inset-inline-start: 0; + + .delete { + &.disabled { + color: #a7aaad; + cursor: not-allowed; + pointer-events: none; + } + } } .column-activate { @@ -128,7 +147,7 @@ } &, #all-snippets-table, #search-snippets-table { - a.delete:hover { + a.delete:not(.disabled):hover { border-block-end: 1px solid #f00; color: #f00; } @@ -212,4 +231,4 @@ td.column-description { display: none; } } -} +} \ No newline at end of file diff --git a/src/js/components/EditorSidebar/EditorSidebar.tsx b/src/js/components/EditorSidebar/EditorSidebar.tsx index f9808cd4..8b09f767 100644 --- a/src/js/components/EditorSidebar/EditorSidebar.tsx +++ b/src/js/components/EditorSidebar/EditorSidebar.tsx @@ -12,6 +12,7 @@ import { MultisiteSharingSettings } from './controls/MultisiteSharingSettings' import { ExportButtons } from './actions/ExportButtons' import { SubmitButtons } from './actions/SubmitButtons' import { ActivationSwitch } from './controls/ActivationSwitch' +import { LockControl } from './controls/LockControl' import { DeleteButton } from './actions/DeleteButton' import { PriorityInput } from './controls/PriorityInput' import { RTLControl } from './controls/RTLControl' @@ -29,6 +30,8 @@ export const EditorSidebar: React.FC = ({ setIsUpgradeDialog
{snippet.id && !isCondition(snippet) ? : null} + {snippet.id ? : null} + {isNetworkAdmin() ? : null} {isRTL() ? : null} @@ -53,4 +56,4 @@ export const EditorSidebar: React.FC = ({ setIsUpgradeDialog
) -} +} \ No newline at end of file diff --git a/src/js/components/EditorSidebar/actions/DeleteButton.tsx b/src/js/components/EditorSidebar/actions/DeleteButton.tsx index 7d584e58..38c20f7b 100644 --- a/src/js/components/EditorSidebar/actions/DeleteButton.tsx +++ b/src/js/components/EditorSidebar/actions/DeleteButton.tsx @@ -16,7 +16,7 @@ export const DeleteButton: React.FC = () => {