migrate to ACE

[IslandRhythms]

closes #171

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
studio	Ready	Preview, Comment	Mar 6, 2026 11:59pm

[Copilot]

Pull request overview

This PR replaces CodeMirror-based textareas with a reusable Ace Editor Vue component across the frontend to address editor instability reported in #171 (unpredictable behavior after “Run Script” / “Clear”).

Changes:

• Add ace-builds and introduce a shared ace-editor Vue component plus helper (createAceEditor/destroyAceEditor).
• Migrate multiple JSON/JS editing surfaces (document create/clone/update, execute script drawer, tasks parameters, dashboard editors, document-details add-field modal, array/subdocument editors) from CodeMirror/textarea to <ace-editor>.
• Remove CodeMirror CDN assets from frontend/public/index.html and delete CodeMirror lifecycle management code in affected components.

Reviewed changes

Copilot reviewed 28 out of 28 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
package.json	Adds ace-builds dependency to support Ace editor.
frontend/public/index.html	Removes CodeMirror CSS/JS CDN includes.
frontend/src/aceEditor.js	Adds Ace editor creation/destruction helper.
frontend/src/ace-editor/ace-editor.js	Adds reusable <ace-editor> Vue component wrapper.
frontend/src/ace-editor/ace-editor.html	Adds container template for Ace editor mounting.
frontend/src/document/execute-script/execute-script.js	Removes CodeMirror integration; relies on scriptText with Ace editor binding.
frontend/src/document/execute-script/execute-script.html	Replaces textarea with <ace-editor> for script input.
frontend/src/document-details/document-details.js	Removes CodeMirror field editor logic; switches conditional to shouldUseAce.
frontend/src/document-details/document-details.html	Uses <ace-editor> for complex field value input.
frontend/src/document-details/document-details.css	Updates modal editor styling selectors from CodeMirror to Ace.
frontend/src/create-document/create-document.js	Removes CodeMirror and switches to Ace-backed documentData model (also used by AI suggestion flow).
frontend/src/create-document/create-document.html	Replaces textarea with <ace-editor> for document JSON/JS input.
frontend/src/clone-document/clone-document.js	Removes CodeMirror; uses documentData directly.
frontend/src/clone-document/clone-document.html	Replaces textarea with <ace-editor>.
frontend/src/update-document/update-document.js	Removes CodeMirror; uses editorValue string bound to <ace-editor>.
frontend/src/update-document/update-document.html	Replaces textarea with <ace-editor>.
frontend/src/tasks/tasks.js	Removes CodeMirror parameters editor; uses newTask.parameters string.
frontend/src/tasks/tasks.html	Replaces parameters textarea with <ace-editor> (JSON mode).
frontend/src/edit-subdocument/edit-subdocument.js	Removes CodeMirror; relies on currentValue with Ace binding.
frontend/src/edit-subdocument/edit-subdocument.html	Replaces textarea with <ace-editor>.
frontend/src/edit-array/edit-array.js	Removes CodeMirror editor; parses JSON from Ace input and emits updates.
frontend/src/edit-array/edit-array.html	Replaces textarea with <ace-editor> using :value + @input.
frontend/src/dashboard/edit-dashboard/edit-dashboard.js	Removes CodeMirror; uses Ace ref + editCode state.
frontend/src/dashboard/edit-dashboard/edit-dashboard.html	Replaces dashboard code textarea with <ace-editor>.
frontend/src/create-dashboard/create-dashboard.js	Removes CodeMirror and relies on code state.
frontend/src/create-dashboard/create-dashboard.html	Replaces textarea with <ace-editor>.
frontend/src/chat/chat-message-script/chat-message-script.js	Removes CodeMirror editing and uses editedScript state.
frontend/src/chat/chat-message-script/chat-message-script.html	Replaces script/dashboard code textareas with <ace-editor>.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.