feat(ui): add markdown preview to file viewer (#352)

Fixes #331

## Summary
- add an optional Markdown preview toggle for markdown files in the
Files tab
- add a word-wrap toggle for the source editor
- escape raw HTML in preview mode and limit preview to plain Markdown
file extensions

## Why
The Files tab only showed raw source, which makes Markdown files harder
to read quickly.

This change adds a lightweight preview/source switch without introducing
a larger viewer registry.

## What Changed
-
`packages/ui/src/components/instance/shell/right-panel/tabs/FilesTab.tsx`
  - added `Preview Markdown` / `Show source` toggle for markdown files
  - added a word-wrap toggle for the Monaco source viewer
  - restricted preview mode to plain Markdown extensions
  - escaped raw HTML in markdown preview mode
- `packages/ui/src/components/file-viewer/monaco-file-viewer.tsx`
  - added configurable word-wrap support
- `packages/ui/src/components/instance/shell/right-panel/RightPanel.tsx`
- moved file-viewer word-wrap state up so it persists across tab
switches
- `packages/ui/src/components/instance/shell/storage.ts`
  - added storage key for file-viewer word wrap
- `packages/ui/src/lib/i18n/messages/*/instance.ts`
  - added strings for preview/source and word-wrap controls

## Validation
- `npm run build --workspace @codenomad/ui`
This commit is contained in:
Pascal André
2026-04-26 22:24:19 +02:00
committed by GitHub
parent 27f9c76a94
commit 0ba1371348
13 changed files with 298 additions and 294 deletions

View File

@@ -155,6 +155,10 @@ export const instanceMessages = {
"instanceShell.filesShell.actions.copyPath": "Скопировать путь",
"instanceShell.filesShell.toast.copyPathSuccess": "Путь скопирован",
"instanceShell.filesShell.toast.copyPathError": "Не удалось скопировать путь",
"instanceShell.filesShell.previewMarkdown": "Предпросмотр Markdown",
"instanceShell.filesShell.showSource": "Показать исходник",
"instanceShell.filesShell.enableWordWrap": "Включить перенос строк",
"instanceShell.filesShell.disableWordWrap": "Отключить перенос строк",
"instanceShell.plan.noSessionSelected": "Выберите сессию, чтобы просмотреть план.",
"instanceShell.plan.empty": "Пока ничего не запланировано.",