Add VSC extension page

[Saga4]

PR Type

Documentation

---

Description

• Add VS Code extension docs page

• Update docs navigation to include IDE section

• Provide Marketplace and VSIX install steps

• Outline workflow, setup, troubleshooting

---

Diagram Walkthrough

flowchart LR
  Nav["Update docs navigation (docs.json)"] -- "Add IDE Extensions group" --> VSCodePageRef["Link to vscode page"]
  VSCodePage["New page: editor-plugins/vscode.mdx"] -- "Guides & setup" --> Users["Developers using VS Code/Cursor"]

Loading

File Walkthrough

Relevant files

Documentation

docs.json Add IDE Extensions group and VS Code page link                      docs/docs.json Add new "🛠 IDE Extensions" group. Link new page editor-plugins/vscode. Minor formatting/structure adjustments in tabs. +8/-2      vscode.mdx New VS Code extension installation and usage guide              docs/editor-plugins/vscode.mdx Create detailed VS Code extension guide. Include Marketplace and VSIX install instructions. Add requirements, workflow, and troubleshooting. Introduce extension onboarding and CLI pairing notes. +48/-0

---

[github-actions]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 2 🔵🔵⚪⚪⚪

🧪 No relevant tests

🔒 Security concerns Sensitive information exposure: The docs.json snippet contains an "apiKey" value. Even if this is a placeholder, confirm it is not a real or live key and that publishing it is intentional.

⚡ Recommended focus areas for review JSON Formatting Ensure commas and braces are correctly placed around the newly inserted "🛠 IDE Extensions" group and the closing of the previous group's "pages" array to avoid breaking the docs navigation JSON. "getting-started/local-installation" ] }, { "group": "🛠 IDE Extensions", "pages": [ "editor-plugins/vscode" ] }, Branding/Trademarks Verify use of product names and trademarks (e.g., VS Code, Visual Studio Code, Cursor) follows their branding guidelines and that claims like "supported" are accurate for all listed editors. - VS Code 1.94.0 or later (Code, VS Code Desktop, Cursor, Windsurf and other VS Code–compatible editors supported) - Python 3.9+ - Git repository initialized for your project - Codeflash CLI installed and initialized with `codeflash init` (Extension will also walkthrough with interactive onboarding) Accuracy of Features Validate that the described behaviors (inline hints, sidebar overview, targeted runs, CLI pickup) match the current extension capabilities and UI wording to prevent user confusion. - **Inline suggestions:** Optimizable functions display a “# optimize” hint above the function definition. And once optimized they will show a comment where you can click it to preview and apply improvements. - **Sidebar overview:** Use the Codeflash panel to review queued, in-progress, and completed optimizations. - **Targeted runs:** Trigger “Optimize Changed Functions” from the extension to focus on recent edits. - **Pair with CLI:** For batch workflows (`codeflash --all`), you can still run the CLI. The extension will pick up the results when you return to the editor.

[github-actions]

PR Code Suggestions ✨

Explore these optional code suggestions:

Category	Suggestion	Impact
General	Ensure table renders correctly MDX/Markdown tables can render inconsistently without a blank line separator. Add an empty line before the table to ensure proper rendering across docs tooling. This prevents the table from being parsed as part of the preceding paragraph. docs/editor-plugins/vscode.mdx [40-46] ## Troubleshooting + | Issue | Quick Fix | | ----- | --------- | | Using Cursor / custom VS Code build | Install via VSIX and restart the editor. | | Still stuck? | Reach out on [Discord](https://www.codeflash.ai/discord) or file an issue on [GitHub](https://github.com/codeflash-ai/codeflash/issues). | Suggestion importance[1-10]: 5 __ Why: Adding a blank line before the Markdown table can improve rendering consistency in some parsers; the change is harmless and potentially helpful, though not critical.	Low
	Normalize punctuation to ASCII Smart quotes and en dashes can break searchability and some renderers. Replace curly quotes, ellipsis, and en dash with ASCII equivalents to avoid encoding issues in static site builds. This improves consistency across environments. docs/editor-plugins/vscode.mdx [21-28] -## Install via VSIX (Cursor, offline, or air‑gapped environments) +## Install via VSIX (Cursor, offline, or air-gapped environments) -Some environments—Cursor, Windows without Marketplace access, or air-gapped machines—require installing from a VSIX package. +Some environments - Cursor, Windows without Marketplace access, or air-gapped machines - require installing from a VSIX package. 1. Download the latest VSIX build from Open VSX:<br /> - [Download VSIX →](https://open-vsx.org/extension/codeflash/codeflash) -2. In VS Code, run the command palette (`Cmd/Ctrl + Shift + P`) and select **Extensions: Install from VSIX…** + [Download VSIX ->](https://open-vsx.org/extension/codeflash/codeflash) +2. In VS Code, run the command palette (`Cmd/Ctrl + Shift + P`) and select **Extensions: Install from VSIX...** Suggestion importance[1-10]: 3 __ Why: Replacing typographic punctuation with ASCII may aid some tooling but can reduce readability; it's a stylistic/content change, not a functional fix, and most modern doc systems handle UTF‑8 fine.	Low
Possible issue	Fix docs page slug mapping Ensure the page slug matches the file path and extension your docs engine expects. If the router requires explicit .mdx or leading slash, mismatches will cause 404s. Align the entry to reference the MDX file directly. docs/docs.json [32-36] { "group": "🛠 IDE Extensions", "pages": [ - "editor-plugins/vscode" + "editor-plugins/vscode.mdx" ] }, Suggestion importance[1-10]: 4 __ Why: The suggestion could prevent a routing mismatch if the docs engine requires explicit extensions, but without evidence of such a requirement it’s speculative; impact is moderate and context-dependent.	Low