feat(web): MarkdownEditor — visual-only mode, drop Source tab #915

New issue

Closed

opened 2026-05-06 23:26:38 +00:00 by claude-desktop · 0 comments

claude-desktop commented

2026-05-06 23:26:38 +00:00

Collaborator

Context

apps/web/src/components/markdown-editor/ currently ships two modes toggled by a Source / Visual button pair. The Milkdown Crepe visual editor is the polished, user-facing surface; the CodeMirror Source pane is a fallback for power users that adds complexity and clutter.

AC

Remove the mode-toggle (Source / Visual buttons) from MarkdownEditor.
Drop MarkdownSourcePane and the CodeMirror source path from the component (or move them to a separate internal export only used by SpecEditor if still needed there).
MarkdownEditor renders only the Milkdown Crepe visual pane.
Remove now-unused props: mode, defaultMode, onModeChange, showModeToggle, sourceExtensions.
Keep toolbar slot — still used for the Assistant button and any future action.
Rethink the chrome: without the tab strip the available height increases; ensure the toolbar (Save / Assistant) still has a clear home above or below the editor surface.
Update markdown-editor.test.tsx — remove mode-switch tests, add a smoke test that the Crepe pane mounts.
SpecEditor (apps/web/src/components/spec-editor/spec-editor.tsx) owns its own CodeMirror instance independently — do not touch it.

Notes

@milkdown/utils replaceAll and the controlled-value sync (useEffect on value) must be preserved.
Keep disabled, className, editorClassName, placeholder, crepeFeatures, crepeFeatureConfigs, data-testid props.

## Context `apps/web/src/components/markdown-editor/` currently ships two modes toggled by a Source / Visual button pair. The Milkdown Crepe visual editor is the polished, user-facing surface; the CodeMirror Source pane is a fallback for power users that adds complexity and clutter. ## AC - Remove the mode-toggle (Source / Visual buttons) from `MarkdownEditor`. - Drop `MarkdownSourcePane` and the CodeMirror source path from the component (or move them to a separate internal export only used by `SpecEditor` if still needed there). - `MarkdownEditor` renders only the Milkdown Crepe visual pane. - Remove now-unused props: `mode`, `defaultMode`, `onModeChange`, `showModeToggle`, `sourceExtensions`. - Keep `toolbar` slot — still used for the **Assistant** button and any future action. - Rethink the chrome: without the tab strip the available height increases; ensure the toolbar (Save / Assistant) still has a clear home above or below the editor surface. - Update `markdown-editor.test.tsx` — remove mode-switch tests, add a smoke test that the Crepe pane mounts. - `SpecEditor` (`apps/web/src/components/spec-editor/spec-editor.tsx`) owns its own CodeMirror instance independently — do not touch it. ## Notes - `@milkdown/utils` `replaceAll` and the controlled-value sync (`useEffect` on `value`) must be preserved. - Keep `disabled`, `className`, `editorClassName`, `placeholder`, `crepeFeatures`, `crepeFeatureConfigs`, `data-testid` props.

claude-desktop referenced this issue

2026-05-06 23:26:48 +00:00

feat(web): integrate MarkdownEditor + AI drawer into skills-tab system-prompt editor #916

claude-desktop referenced this issue

2026-05-06 23:26:54 +00:00

feat(web): integrate MarkdownEditor into SpecEditor (visual mode, no AI drawer) #917