feat: preview modal actions and large-snippet UX#418
Conversation
|
Assertion corrected to the snippets list; the post-save setup and dirty-state checks are unchanged. |
|
Follow-up adversarial re-audit found two unresolved issues:
|
# Conflicts: # src/css/manage/_cloud-community.scss # src/js/components/common/KebabMenu.tsx # src/php/Admin/Menus/Manage_Menu.php # src/php/Admin/Menus/Manage_Menu_Assets.php # src/php/Admin/Menus/Manage_Menu_Bulk_Download.php # tests/unit/Admin/Menus/Manage_Menu_Assets_Test.php # tests/unit/Admin/Menus/Manage_Menu_Test.php
# Conflicts: # src/js/components/EditMenu/SnippetForm/SnippetForm.tsx # src/js/components/ManageMenu/SnippetsTable/SnippetsTable.tsx
|
Resolved. Preview CodeMirror uses readOnly true with keyboard focus and selection coverage. The Add New-to-Edit transition now replaces the Add New history entry, while dirty navigation restores Edit after cancellation and prompts once before returning to the snippets list. The relevant E2E coverage passes. |
Propagation also duplicated the keyboard-selection test; the older inline copy (same title) blocked Playwright discovery, so it is removed in favor of the refactored helper-based version. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The keyboard-selection test located textarea[aria-label] from the whole modal, matching both the readonly fallback and the CodeMirror input. The input element also differs by CodeMirror inputStyle (contenteditable on current WordPress, textarea on older builds), so inputValue/toHaveValue cannot target it portably. Read the document and selection through the already-scoped .CodeMirror editor instance instead. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
code-snippets-bot
added
the
build
Download and install |
| use Code_Snippets\Model\Snippet; | ||
| use function Code_Snippets\code_snippets; | ||
|
|
||
| defined( 'ABSPATH' ) || exit; |
There was a problem hiding this comment.
Unnecessary for PHP class files.
| * | ||
| * @return array<string, int> Map of type name to snippet count, including 'all'. | ||
| */ | ||
| public function count(): array { |
There was a problem hiding this comment.
Does it make sense to have this as its own class? Would it make more sense as a function in snippet-ops.php?
| public function __construct( Manage_Menu_Screen_Options $screen_options ) { | ||
| public function __construct( | ||
| Manage_Menu_Screen_Options $screen_options, | ||
| Snippet_Type_Counter $type_counter |
There was a problem hiding this comment.
There's no reason why this should be passed through from Plugin – this class can initialise its own local version.
| </form> | ||
| ) | ||
| } | ||
| export const PriorityColumn: React.FC<ColumnProps> = ({ snippet }) => |
There was a problem hiding this comment.
Inline this in the column definition.
| (type?: SnippetType) => countedSnippets | ||
| ? type ? typeCounts?.get(type) ?? 0 : countedSnippets.length | ||
| : localized?.[type ?? 'all'], | ||
| [countedSnippets, typeCounts, localized] |
There was a problem hiding this comment.
I don't know why countedSnippets and typeCounts are memorised separately when they just feed into this?
3 participants
What changed
TableColumnsinto a sharedSnippetPriorityInputcommon component, reused by the list table, card kebab menu, and preview modal, with an optionalinputIdto keep element IDs unique.min(900px, 90vw)wide with a85vhheight cap; the header and footer stay pinned and the CodeMirror editor is the only scroll region, scrolling long code vertically and horizontally without wrapping. CodeMirror's default viewport rendering is retained so very long snippets stay fast.How verified
npm run buildcompiles successfully.npm run lint:jsandnpm run lint:stylespass with no errors or warnings.REST_API_Cloudper-page failure, matching the baseline on the parent branch.