Files
wp-agentic-writer/SIDEBAR_1_TO_1_TASKLIST.md
Dwindi Ramadhana 690991c526 refactor: Cleanup git state - commit all staged changes
Major refactoring cleanup:
- Add new controller architecture (class-controller-*.php)
- Add new settings-v2 UI (views/settings-v2/)
- Add new CSS architecture (agentic-sidebar.css, tokens)
- Add esbuild build pipeline (scripts/build.js, package.json)
- Add composer dependencies (vendor/)
- Add frontend src directory (assets/js/src/index.jsx)
- Add documentation files
- Remove old/obsolete files (class-settings.php, old CSS)

This commits all pending changes from previous refactoring efforts.
2026-06-17 05:27:58 +07:00

18 KiB

WP Agentic Writer Sidebar 1:1 Migration Tasklist

Source task plan: SIDEBAR_1_TO_1_MIGRATION.md Source of truth: assets/js/sidebar.js Mode: active 1:1 migration. No build step, no inferred behavior.

Use this tasklist to execute the migration described in SIDEBAR_1_TO_1_MIGRATION.md. Every checkbox must be completed against assets/js/sidebar.js, not memory.

Current status: Real 1:1 monolith migration is complete in assets/js/src/index.jsx for mechanical wp.element.createElement to JSX conversion. The migrated file parses with tsc --allowJs --checkJs false --jsx preserve --noEmit, class inventory still verifies 226 tokens, endpoint and Gutenberg/browser side-effect inventories remain present, and only intentional document.createElement DOM usage remains. No build was run, no enqueue switch was made, and no extraction was performed.

Implementation tracker: Continue real migration work in SIDEBAR_1_TO_1_REAL_MIGRATION_TASKLIST.md. This document remains the Phase 0-14 parity/audit ledger.

Readiness statement: Phase 0 through Phase 14 have been checked twice against the current assets/js/sidebar.js source of truth and are considered complete for monolith parity. Optional Phase 15 is intentionally excluded because extraction must wait until after the 1:1 monolith migration. Do not re-open uncertainty about Phase 0-14 unless assets/js/sidebar.js, SIDEBAR_1_TO_1_MIGRATION.md, or assets/js/src/index.jsx changes. The project is ready to start the actual 1:1 migration work: mechanical createElement to JSX conversion inside the monolith, with no behavior changes.

Active conversion rule: During JSX conversion, each completed range must be recorded below with its original source line range. The global createElement definition-of-done item is checked only after every wp.element.createElement render call in the monolith has been converted and verified.

Ground Rules

  • Confirm assets/js/sidebar.js is the current source of truth before starting.
  • Confirm SIDEBAR_1_TO_1_MIGRATION.md is open beside assets/js/sidebar.js.
  • Do not use MIGRATION_GUIDE.md as authority when it differs from assets/js/sidebar.js.
  • Do not rename functions during the first migration pass.
  • Do not extract helper files during the first migration pass.
  • Do not change visible text, labels, placeholders, icons, SVG markup, classes, inline styles, aria attributes, roles, or conditional render gates.
  • Do not replace RawHTML, markdown logic, stream handling, abort handling, localStorage keys, endpoint paths, request bodies, or Gutenberg APIs.
  • Keep the first target as a monolithic JSX port.

Definition of Done for Each Range

  • Source range is copied or represented completely.
  • createElement conversion keeps the same tag/component.
  • Props are preserved 1:1.
  • Children order is preserved 1:1.
  • Conditional gates are preserved in the same branch position.
  • State/ref/effect ordering is preserved.
  • Callback boundaries and dependency arrays are preserved.
  • Inline styles, string literals, titles, placeholders, labels, and SVG strings are preserved.
  • Any migrated range is checked against the original source lines before moving on.

Phase 0 - Source Lock and Boundaries

  • Verify sidebar.js has 12,363 lines.
  • Verify file header and IIFE boundary: lines 1-7 and 12363.
  • Verify dependency destructuring: lines 8-15.
  • Verify debug logger and pluginIcon: lines 16-35.
  • Verify AgenticWriterSidebar starts at line 38.
  • Verify AgenticWriterSidebar closes at line 12347.
  • Verify HOC/plugin boot remains separate: lines 12349-12363.
  • Verify main return starts at line 12307.
  • Record any source drift before implementation. If line numbers changed, regenerate this tasklist from the updated source.

Phase 1 - Monolith Skeleton

  • Create the migrated target as one monolithic sidebar component.
  • Map every WordPress dependency from lines 8-15.
  • Preserve pluginIcon behavior from lines 31-35.
  • Preserve component prop shape: AgenticWriterSidebar = ({ postId }).
  • Preserve mapSelectToProps behavior from lines 12349-12352.
  • Preserve ConnectedSidebar behavior from lines 12355-12356.
  • Preserve registerPlugin("wp-agentic-writer") behavior from lines 12358-12362.
  • Do not split files yet.

Phase 2 - State, Refs, and Constants

  • Migrate settings and error formatting: lines 40-138.
  • Migrate chat/top-level state: lines 139-149.
  • Migrate session lock state and refs: lines 152-160.
  • Migrate config defaults, config state, and config refs: lines 163-188.
  • Migrate cost/provider state and provider metadata helper: lines 191-223.
  • Migrate editor/refinement lock state and refs: lines 224-237.
  • Migrate SEO audit state: lines 240-243.
  • Migrate clarification, pending plan, and request refs: lines 246-268.
  • Migrate active operation refs/state: lines 269-279.
  • Migrate writing state: lines 280-289.
  • Migrate workspace snapshot/collapse state and toggle: lines 290-321.
  • Migrate mention/slash/input refs and state: lines 323-336.
  • Migrate focus keyword state and persistence refs: lines 338-347.
  • Migrate welcome state: lines 349-352.
  • Migrate undo stack and max size: lines 354-356.
  • Migrate Memanto restore state/ref: lines 358-366.
  • Verify state/ref/hook order matches sidebar.js exactly.

Phase 3 - Effects, Saving, Timeline, and Editor Locks

  • Migrate agent mode reset effect: lines 367-371.
  • Migrate post config load effect: lines 373-400.
  • Migrate savePostConfig: lines 402-448.
  • Migrate debounced post config effect: lines 449-473.
  • Migrate cost tracking effect: lines 474-499.
  • Migrate normalizeWritingState: lines 500-510.
  • Migrate saveWritingState: lines 511-539.
  • Migrate persistWritingStatePatch: lines 540-550.
  • Migrate writing state load effect: lines 551-585.
  • Migrate scroll refs/effect: lines 586-595.
  • Migrate timeline regex/status constants and helpers: lines 596-673.
  • Migrate active operation helpers: lines 674-728.
  • Migrate refine-all confirmation callbacks: lines 729-752.
  • Migrate undo snapshot helpers: lines 753-812.
  • Migrate post saving lock effects: lines 813-841.
  • Migrate editor input lock and DOM blocker effect: lines 842-981.
  • Migrate text/config/keyword helpers and welcome start: lines 1020-1194.

Phase 4 - SEO, Workspace, Sessions, and Locks

  • Migrate runSeoAudit: lines 1195-1269.
  • Migrate SEO fix instruction helpers: lines 1270-1348.
  • Migrate handleSeoAuditFix: lines 1349-1459.
  • Migrate generateMetaDescription: lines 1460-1563.
  • Migrate block preview helpers: lines 1564-1599.
  • Migrate workspace snapshot helper/effects: lines 1600-1668.
  • Migrate beforeunload/session restore effects: lines 1669-1716.
  • Migrate session storage sanitizing and hydration: lines 1717-1781.
  • Migrate session message persistence: lines 1782-1889.
  • Migrate session lock acquire/release/heartbeat/takeover: lines 1890-2026.
  • Migrate lock/chat-history/post-session effects: lines 2027-2300.
  • Migrate loadPostSessions: lines 2301-2397.
  • Migrate openSessionById: lines 2398-2515.

Phase 5 - Mentions, Commands, Plans, and Agent Decisions

  • Migrate stream target and mention token helpers: lines 2516-2569.
  • Migrate title refinement: lines 2570-2689.
  • Migrate slash command parsing/options/block index: lines 2690-2758.
  • Migrate target block resolution and insert refinement block: lines 2759-2870.
  • Migrate plan streaming: lines 2871-3188.
  • Migrate retry helpers: lines 3189-3473.
  • Migrate plan block/preview helpers: lines 3474-3604.
  • Migrate section block helpers and persistence: lines 3605-3696.
  • Migrate plan task/target/matching/status/index helpers: lines 3697-3906.
  • Migrate chat summary, intent detection, context, reset, plan message, keyword suggestion, and runtime helpers: lines 3907-4218.
  • Migrate plan ID, intent classifier, and action decider: lines 4219-4320.

Phase 6 - Execution, Refinement, and Block Context

  • Migrate executePlanFromCard: lines 4321-4768.
  • Migrate stop execution: lines 4769-4794.
  • Migrate clear chat context: lines 4795-4870.
  • Migrate serialized block creation: lines 4871-4953.
  • Migrate block reformatting: lines 4954-5056.
  • Migrate plan revision: lines 5057-5142.
  • Migrate edit plan apply/cancel: lines 5143-5280.
  • Migrate clarification context effect/helper: lines 5281-5327.
  • Migrate duplicate heading removal: lines 5328-5362.
  • Migrate refineable block/list helpers: lines 5363-5442.
  • Migrate context block helpers: lines 5443-5520.
  • Migrate slang/AI-slop detection helpers: lines 5521-5606.
  • Migrate refinement diagnosis and block mention resolution: lines 5607-5799.
  • Migrate handleChatRefinement: lines 5800-6388.
  • Verify wpaw-diff-added and wpaw-diff-removed behavior survives unchanged.

Phase 7 - Chat Input and Main Async Flows

  • Migrate refine-all modal: lines 6389-6455.
  • Migrate mention options: lines 6456-6579.
  • Migrate custom insert-mention event effect: lines 6580-6612.
  • Migrate input change/key handling: lines 6613-6701.
  • Migrate mention and slash insertion helpers: lines 6702-6758.
  • Migrate sendMessage: lines 6759-8056.
  • Migrate submitAnswers: lines 8057-8476.
  • Verify all stream readers, decoders, timeouts, active readers, and abort branches match the source.

Phase 8 - Render Surfaces

  • Migrate renderClarification: lines 8477-8829.
  • Verify renderSingleChoice: lines 8486-8547.
  • Verify renderMultipleChoice: lines 8550-8577.
  • Verify renderOpenText: lines 8580-8597.
  • Verify renderConfigForm: lines 8600-8723.
  • Verify answer input switch: lines 8725-8742.
  • Migrate conversation session actions: lines 8830-9004.
  • Migrate renderWelcomeScreen: lines 9005-9184.
  • Migrate renderWritingEmptyState: lines 9185-9253.
  • Migrate renderFocusKeywordBar: lines 9254-9459.
  • Migrate renderAgentWorkspaceCard: lines 9460-9629.
  • Preserve renderContextIndicator = renderAgentWorkspaceCard: lines 9630-9632.
  • Migrate renderContextualAction: lines 9633-9996.
  • Migrate renderMessages: lines 9997-10917.
  • Migrate renderConfigTab: lines 10918-11434.
  • Migrate getAgentStatus: lines 11435-11448.
  • Migrate renderGlobalStatusBar: lines 11449-11585.
  • Migrate renderChatTab: lines 11586-12020.
  • Migrate cost state/effect/helpers: lines 12021-12057.
  • Migrate renderCostTab: lines 12058-12306.
  • Migrate main component return tree: lines 12307-12346.

Phase 9 - Render Surface Element Audit

  • Refine modal: confirm dialog role, aria modal/label, overlay, modal, title, body, checkbox, cancel, continue.
  • Clarification UI: confirm all question types, custom answer field, config fields, progress bar, previous/skip/next/finish behavior.
  • Welcome UI: confirm recent session, older session details, open/delete buttons, keyword input, mode pills, start button.
  • Writing empty state: confirm SVG icon, copy, create outline button, hint text.
  • Focus keyword bar: confirm expanded/compact branches, suggestions, selected state, provider/cost display, expand/collapse.
  • Workspace card: confirm collapsed state, status, context grid, keyword field, conversation/provider summary, resume card.
  • Contextual action: confirm create_outline action, clarity check branch, generate-plan stream branch, action card.
  • Messages: confirm markdown helpers, grouping, timeline, plan, edit plan, structured errors, retry buttons, default response, resume actions.
  • Config tab: confirm every section, control, description, SEO controls, meta generation, audit score, check list, fix buttons.
  • Status bar: confirm status dot, memory badge, undo, sessions, chat, workspace toggle, config, cost buttons.
  • Chat tab: confirm lock banners, health notices, welcome/empty/workspace/activity gates, command area, hint, textarea, autocompletes, search toggle, stop/send, keyboard hints, modal.
  • Cost tab: confirm header, refresh, cards, budget section, warning, action summary table, history table, footer link.
  • Final shell: confirm menu item, sidebar title, icon, panel, tab wrapper, active tab branch.

Phase 10 - Class Inventory Audit

  • Verify every literal className token from SIDEBAR_1_TO_1_MIGRATION.md exists in the migrated target.
  • Verify dynamic classes remain dynamic expressions.
  • Verify wpaw-diff-removed append branch: lines 6075-6078 and 6111-6114.
  • Verify wpaw-diff-added append branches: lines 6085-6089 and 6128-6129.
  • Verify welcome pill active branches: lines 9152-9154 and 9162-9164.
  • Verify focus suggestion selected: lines 9322-9324.
  • Verify workspace is-collapsed and status-${activeWorkspaceStatus}: lines 9489 and 9514.
  • Verify timeline statusClass and is-current: lines 10351-10375.
  • Verify plan section section.status || "pending": line 10582.
  • Verify SEO/meta status classes: lines 11165-11374.
  • Verify status-bar is-active branches: lines 11510-11572.
  • Verify chat input classes: lines 11596-11955.
  • Verify budget status classes: lines 12129, 12158, and 12167.

Phase 11 - Non-Render Class and Selector Audit

  • Preserve WordPress lock key wpaw-writing: lines 824 and 828.
  • Preserve body class wpaw-editor-locked: lines 825 and 829.
  • Preserve WordPress lock key wpaw-refining: lines 835 and 838.
  • Preserve body class wpaw-refining-locked: lines 836 and 839.
  • Preserve editor block class wpaw-block-refining: lines 895, 903, and 916.
  • Preserve input-blocking selector .wpaw-sidebar, .wpaw-command-area, .wpaw-messages: line 933.
  • Preserve diff cleanup removal of wpaw-diff-removed: line 5262.

Phase 12 - Endpoint and Integration Audit

  • Verify /post-config/${postId} calls.
  • Verify /cost-tracking/${postId} calls.
  • Verify /writing-state/${postId} calls.
  • Verify /seo-audit/${postId} call.
  • Verify /generate-meta call.
  • Verify all conversation endpoints.
  • Verify /conversation/${postId} and /conversation/${data.post_id} calls.
  • Verify /chat-history/${postId} call.
  • Verify /memanto/restore?post_id=${postId} call.
  • Verify /refine-title call.
  • Verify all /generate-plan calls.
  • Verify all /chat calls.
  • Verify /section-blocks/${postId} and /section-blocks calls.
  • Verify /summarize-context call.
  • Verify /detect-intent call.
  • Verify /clear-context call.
  • Verify /suggest-keywords call.
  • Verify /execute-article call.
  • Verify /reformat-blocks call.
  • Verify /revise-plan call.
  • Verify /refine-from-chat call.
  • Verify /check-clarity calls.
  • For every endpoint, verify method, nonce header, content type, body shape, stream/non-stream handling, provider metadata, cost updates, and error handling.

Phase 13 - Gutenberg and Browser Side Effects Audit

  • Verify all select("core/block-editor") calls.
  • Verify all dispatch("core/block-editor") calls.
  • Verify all select("core/editor") calls.
  • Verify all dispatch("core/editor") calls.
  • Verify wp.data.subscribe behavior.
  • Verify wp.data.withSelect behavior.
  • Verify localStorage keys: wpaw_agent_workspace_collapsed and wpawSessionId_${postId}.
  • Verify beforeunload handlers.
  • Verify global document event listeners and cleanups.
  • Verify window wpaw:insert-mention listener and cleanup.
  • Verify lock heartbeat interval setup and cleanup.
  • Verify debounced config/message/keyword saves.
  • Verify AbortController lifecycle.
  • Verify stream reader lifecycle and active reader cancellation.
  • Verify TextDecoder usage.

Phase 14 - Final Parity Audit

  • Confirm no functions are missing from SIDEBAR_1_TO_1_MIGRATION.md.
  • Confirm no state/ref/effect entries are missing.
  • Confirm no render surface entries are missing.
  • Confirm no class inventory entries are missing.
  • Confirm no dynamic class expressions were flattened.
  • Confirm no endpoint inventory entries are missing.
  • Confirm no editor/browser side effects are missing.
  • Confirm final plugin registration still renders ConnectedSidebar.
  • Confirm no optional extraction was performed before monolith parity.
  • Confirm any future extraction task references the source line range it moves.

Active JSX Conversion Pass

  • Convert renderRefineAllConfirmModal: source lines 6389-6455. Verified overlay div, modal div, title/body divs, CheckboxControl, two Button components, class names, role/aria attributes, labels, text, callbacks, and child order.
  • Convert all remaining wp.element.createElement render calls in the monolith. Verified assets/js/src/index.jsx has zero remaining wp.element.createElement/React.createElement calls, preserves intentional document.createElement, parses with TypeScript JSX, preserves class inventory, endpoint inventory, Gutenberg/browser side effects, and final plugin registration.

Optional Phase 15 - Extraction After Monolith Parity Only

  • Extract only one helper group at a time.
  • Before extraction, record source range and destination file.
  • Move code without renaming public/internal symbols.
  • Preserve imports/dependencies exactly.
  • Re-run the same parity checks for the moved range.
  • Do not extract render surfaces until all behavior helpers are proven equivalent.
  • Do not delete the monolith source range until the moved range is checked line-by-line.

Stop Conditions

  • Stop if sidebar.js changes and this tasklist has not been regenerated.
  • Stop if a migrated range requires guessing.
  • Stop if a function seems unused but exists in sidebar.js.
  • Stop if a class appears styling-only but exists in sidebar.js.
  • Stop if an endpoint or request body differs from sidebar.js.
  • Stop if hook order would change.