feat: syntax highlight non-markdown text files with Shiki

[k1LoW]

Summary

• Detect file type by extension in the frontend (isMarkdownFile / detectLanguage utilities)
• Render non-markdown text files (e.g. .go, .ts, .json, .yaml) with Shiki syntax highlighting instead of markdown rendering
• Hide ToC and Raw toggle buttons for non-markdown files since they are not applicable
• Refactor RawView into a generic HighlightedView component that accepts a language parameter
• Add test data files (sample.go, sample.json) for manual verification

[Copilot]

Pull request overview

This PR extends the frontend viewer so that non-markdown text files are rendered as syntax-highlighted code (via Shiki) instead of being interpreted as markdown, making mo more useful for quickly viewing source/config files alongside markdown.

Changes:

• Added frontend file-type utilities (isMarkdownFile, detectLanguage) with unit tests.
• Updated MarkdownViewer to render non-markdown files using Shiki and hide ToC/Raw toggles when not applicable.
• Added testdata/ sample files for manual verification.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
testdata/sample.json	Adds a JSON sample for manual syntax-highlight verification.
testdata/sample.go	Adds a Go sample for manual syntax-highlight verification.
internal/frontend/src/utils/filetype.ts	Introduces markdown detection + extension-to-language mapping for Shiki.
internal/frontend/src/utils/filetype.test.ts	Adds unit tests for markdown detection and language mapping.
internal/frontend/src/hooks/useFileDrop.ts	Switches drag/drop markdown detection to the shared utility.
internal/frontend/src/hooks/useFileDrop.test.ts	Updates tests to use isMarkdownFile, but now duplicates coverage and no longer tests useFileDrop.
internal/frontend/src/components/MarkdownViewer.tsx	Renders non-markdown content via Shiki and hides ToC/Raw toggles for non-markdown files.

---

You can also share your feedback on Copilot code review. Take the survey.

[Copilot]

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.

---

You can also share your feedback on Copilot code review. Take the survey.

[Copilot]

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 1 comment.

Comments suppressed due to low confidence (1)

internal/frontend/src/hooks/useFileDrop.ts:56

• useFileDrop now uploads any dropped file by calling file.text() (size limit only). This will happily accept binary files (e.g. PNG/PDF), decode them as UTF-8 with replacement characters, and the backend will persist that content without validation. If the intent is “text/code files only”, consider adding a client-side guard (e.g. allow file.type.startsWith('text/') plus known extensions, or a small binary sniff for NUL bytes) and/or enforce a similar check server-side.

      const maxSize = 10 * 1024 * 1024; // 10MB
      const fileList = e.dataTransfer.files;
      const uploads: Promise<void>[] = [];
      for (let i = 0; i < fileList.length; i++) {
        const file = fileList[i];
        if (file.size <= maxSize) {
          uploads.push(
            file
              .text()
              .then((content) => uploadFile(file.name, content, activeGroup))
              .catch(() => {}),

---

You can also share your feedback on Copilot code review. Take the survey.

[github-actions]

Code Metrics Report

	main (bb29e6c)	#108 (d1653f7)	+/-
Coverage	52.1%	52.2%	+0.0%
Code to Test Ratio	1:0.5	1:0.5	-0.1
Test Execution Time	38s	37s	-1s

Details

  |                     | main (bb29e6c) | #108 (d1653f7) |  +/-  |
  |---------------------|----------------|----------------|-------|
+ | Coverage            |          52.1% |          52.2% | +0.0% |
  |   Files             |             36 |             37 |    +1 |
  |   Lines             |           2886 |           2900 |   +14 |
+ |   Covered           |           1506 |           1514 |    +8 |
- | Code to Test Ratio  |          1:0.5 |          1:0.5 |  -0.1 |
  |   Code              |           4427 |           4524 |   +97 |
+ |   Test              |           2590 |           2617 |   +27 |
+ | Test Execution Time |            38s |            37s |   -1s |

Code coverage of files in pull request scope (38.3% → 39.3%)

Files	Coverage	+/-	Status
internal/frontend/src/components/MarkdownViewer.tsx	44.7%	-1.3%	modified
internal/frontend/src/hooks/useFileDrop.ts	0.0%	-4.3%	modified
internal/frontend/src/utils/filetype.ts	100.0%	+100.0%	added

---

Reported by octocov

[Copilot]

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated no new comments.

Comments suppressed due to low confidence (1)

internal/frontend/src/hooks/useFileDrop.ts:56

• useFileDrop now uploads any dropped file by reading it via file.text(). This will also attempt to upload binary files (e.g. images/PDFs), which the backend currently accepts as plain content without any binary/text validation, resulting in garbled content and potentially expensive payloads. Consider filtering drops to known text/code extensions (e.g. those supported by detectLanguage / markdown), or using file.type / a small-byte heuristic to reject likely-binary files before calling .text() + uploadFile.

        if (file.size <= maxSize) {
          uploads.push(
            file
              .text()
              .then((content) => uploadFile(file.name, content, activeGroup))
              .catch(() => {}),

---

You can also share your feedback on Copilot code review. Take the survey.