Skip to content

feat: add automatic code formatting and language detection to the snippet editor - #205

Merged
SudiptaPaul-31 merged 2 commits into
SudiptaPaul-31:mainfrom
JemimahEkong:feature/code-formatting-language-detection
Oct 3, 2026
Merged

SudiptaPaul-31 merged 2 commits into
SudiptaPaul-31:mainfrom
JemimahEkong:feature/code-formatting-language-detection

Conversation

@JemimahEkong

Copy link
Copy Markdown
Contributor

Summary

Closes #187

Implemented automatic code formatting and language detection support for the snippet editor.

What changed

  • Added intelligent pasted-code language detection using weighted heuristics and confidence scoring.

    • Low-confidence, mixed, or unsupported snippets safely fall back to plaintext.
    • Existing snippet edits and manual language selections lock detection to prevent unwanted overrides.
  • Added editor formatting workflow:

    • New toolbar with language indicator.
    • Format Code action.
    • Auto-format toggle.
    • Accept/dismiss language detection suggestions.
  • Added language-aware formatting:

    • Prettier support for JavaScript, TypeScript, HTML, CSS, JSON, and Markdown.
    • Conservative Python formatting.
    • Whitespace normalization for unsupported languages.
    • Plaintext and large snippets (>100KB) are protected from automatic rewriting.
  • Improved editor stability:

    • Added lazy-loaded formatter plugins.
    • Added idempotence checks and graceful formatting failures.
    • Fixed Radix Select mount behavior where empty change events could accidentally clear the selected language.

Files added/updated

  • lib/language-detection.ts
  • lib/format-code.ts
  • hooks/useSnippetFormatting.ts
  • components/SnippetEditorToolbar.tsx
  • components/ui/switch.tsx
  • components/SnippetForm.tsx
  • lib/languages.ts

Testing

Added comprehensive test coverage:

  • lib/language-detection.test.ts
  • lib/format-code.test.ts
  • hooks/useSnippetFormatting.test.ts
  • components/__tests__/SnippetEditorToolbar.test.tsx
  • components/__tests__/SnippetForm.test.tsx

Results:

  • New test suites: 5 suites, 75 tests passing
  • TypeScript validation: tsc --noEmit passes with zero errors in all modified files.

The remaining failing tests are existing failures from main and unrelated to this change (reputation, wallet, signature, share/blockchain services).

…ppet editor

- Detect pasted code language with weighted heuristics and confidence scoring; low-confidence, mixed, or unsupported pastes fall back to plaintext
- Add an editor toolbar with language indicator, Format Code button, auto-format toggle, and accept/dismiss suggestion banner
- Format with Prettier (JS/TS/HTML/CSS/JSON/Markdown), a conservative Python formatter, and whitespace-only normalization for other languages; plaintext and oversized snippets are never rewritten
- Lock detection when editing an existing snippet or when the user manually picks a language; guard Radix Select against spurious empty change events
- Add test suites for detection, formatting, the formatting hook, the toolbar, and form integration (5 suites, 75 tests)
@drips-wave

drips-wave Bot commented Sep 27, 2026

Copy link
Copy Markdown

@JemimahEkong Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@vercel

vercel Bot commented Sep 27, 2026

Copy link
Copy Markdown

@JemimahEkong is attempting to deploy a commit to the Sudipta 's projects Team on Vercel.

A member of the Team first needs to authorize it.

@SudiptaPaul-31
SudiptaPaul-31 merged commit a175f78 into SudiptaPaul-31:main Oct 3, 2026
0 of 3 checks passed
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.

Add Code Formatting & Language Detection

2 participants