Skip to content

Add docs browser for in-app markdown viewing#35

Merged
alari76 merged 2 commits intomainfrom
feat/docs-browser
Mar 9, 2026
Merged

Add docs browser for in-app markdown viewing#35
alari76 merged 2 commits intomainfrom
feat/docs-browser

Conversation

@alari76
Copy link
Copy Markdown
Contributor

@alari76 alari76 commented Mar 9, 2026

Summary

  • Adds a lightweight docs browser that lets users browse and read rendered markdown files from any connected repo directly in the terminal UI
  • Markdown is rendered with full GFM support (tables, code blocks with syntax highlighting, task lists) using marked + highlight.js, sanitized via DOMPurify
  • Entry point is a doc icon on each repo row in the sidebar; clicking opens a file picker, then selecting a file replaces the chat area with the rendered doc
  • Input bar remains functional in doc view, with doc context automatically included when messaging Claude

New files

File Purpose
server/docs-routes.ts REST API: GET /api/repos/:repoId/docs (file list) and GET /api/repos/:repoId/docs/:filePath (content)
src/hooks/useDocsBrowser.ts Client state: file picker, content loading, raw/rendered toggle
src/components/MarkdownRenderer.tsx marked + DOMPurify + highlight.js wrapper
src/components/DocsFilePicker.tsx Dropdown file list with pinned files (CLAUDE.md, README.md)
src/components/DocsBrowser.tsx Full doc view with nav bar, back button, raw toggle

Modified files

  • RepoSection.tsx — doc icon button on repo row
  • LeftSidebar.tsx — prop passthrough
  • App.tsx — docs browser integration (replaces chat area when active)
  • InputBar.tsx — optional placeholder prop
  • ws-server.ts — mount docs routes
  • index.css.docs-prose scoped styles

Test plan

  • Click doc icon on a repo row → file picker appears with .md files
  • Pinned files (CLAUDE.md, README.md) appear at top with divider
  • Select a file → rendered markdown replaces chat area
  • Toggle Raw/Rendered button switches between views
  • Back button returns to chat
  • Escape closes doc view
  • Clicking a session in sidebar closes doc view
  • Input bar shows custom placeholder in doc mode
  • Sending a message while viewing a doc includes file context
  • Path traversal attempts return 404
  • Light mode styling works correctly

🤖 Generated with Claude Code

alari76 and others added 2 commits March 9, 2026 11:44
Implements a lightweight docs browser that lets users read rendered
markdown files from any connected repo directly in the terminal UI.

New components:
- server/docs-routes.ts — REST API for listing and fetching .md files
- src/hooks/useDocsBrowser.ts — client state and fetch logic
- src/components/MarkdownRenderer.tsx — marked + DOMPurify + highlight.js
- src/components/DocsFilePicker.tsx — dropdown file picker
- src/components/DocsBrowser.tsx — full document view with nav bar

Modified: RepoSection (doc icon), LeftSidebar (prop passthrough),
App.tsx (docs browser integration), InputBar (placeholder prop),
ws-server.ts (route mounting), index.css (.docs-prose styles).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@alari76 alari76 merged commit 4db7946 into main Mar 9, 2026
2 checks passed
@alari76 alari76 deleted the feat/docs-browser branch March 10, 2026 05:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant