feat(editor): add language selector to code block node view

[Liewzheng]

Description

Adds a language selector dropdown to the code block node view, closing #9799.

In CE, code blocks created via slash command / paste / import get language: null and there is no UI to set or change the language afterwards — the only workaround is retyping the ```lang fence. This PR renders a compact <select> at the top-left of code blocks (editable mode only):

• Options come from the extension's own lowlight instance (listLanguages()), so the list always matches the registered grammars, plus a "Plain text" (null) option.
• Selecting a language calls updateAttributes({ language }), so lowlight highlighting updates in place.
• A language that is set on the node but not registered in lowlight stays selectable instead of blanking the picker.
• The selector is inside a contentEditable={false} wrapper with mousedown propagation stopped, so it doesn't disturb the editor selection; the <pre> gets extra top padding in editable mode so the control never overlaps the first line of code.

Read-only rendering is unchanged (no selector, no extra padding).

Type of Change

• New feature (non-breaking change which adds functionality)

Screenshots and Media (if applicable)

Tested locally on the CE dev server: created code blocks via slash command, ```ts fence, and plain paste; switched languages via the selector and confirmed highlighting follows the selection; verified the selector is hidden in read-only mode.

Test Scenarios

• pnpm turbo run check:types --filter=@plane/editor passes
• oxlint on the changed file: 0 warnings, 0 errors

References

Closes #9799

[coldtea-pr-lens]

◈ PR Lens

🟢 +0 new · 🟠 ~1 changed · 🔴 -0 removed · 0 flows · 1 file · commit 2665973

Architecture

1 component touched across 1 lane.

Open the interactive canvas

Data flow

No data-flow sequence changed in this PR.

Drill down

Client Applications — 1 component

🟡 CHANGED Editor Core (@⁠plane/editor)

Rich-text editor package based on TipTap and ProseMirror, providing document editing extensions and custom node views.

• packages/editor/src/core/extensions/code/code-block-node-view.tsx:1-105

View

• Architecture lens
• Data flow lens
• Expand every detail
• Show unchanged neighbours

Tip

GitHub will not let you zoom an image in a comment. The link under each diagram opens it on an interactive canvas, where you can zoom, pan and step through the flow.

🪧 More tips

• Run PR Lens on your own machine: npx skills add coldteadotai/pr-lens installs the agent skill. Then tell your coding agent: "Diagram the change you just made with PR Lens and attach it to the pull request."
• Draw a diff before it is even a pull request: npx @coldtea/pr-lens-cli analyze --base origin/main reads the diff with your own model key, and npx @coldtea/pr-lens-cli render .pr-lens/graph.json draws the same lenses on your machine.
• The boxes under View are live. Tick Architecture lens or Data flow lens to choose which diagrams appear, or Expand every detail to open every drill-down at once. The comment redraws in place a few seconds later.
• Show unchanged neighbours lists the components this change did not touch alongside the ones it did, so the drill-down shows what the changed code sits next to.
• The CLI's render picks up .github/pr-lens.yml automatically and applies your corrections (renames, exclusions, lane pins) at draw time.
• Would you rather run it from CI on a key of your own? Add .github/workflows/pr-lens.yml with coldteadotai/pr-lens/packages/action@v0 and a model key in your repository secrets, say GEMINI_API_KEY. The Action asks Gemini by default, or OpenAI and any endpoint speaking /chat/completions through its provider input.
• PR Lens is free for open source. A star on the repository is what keeps it going.
• Push a new commit and the whole comment re-renders for the new head. An older run never overwrites a newer one, so a slow render cannot put a stale diagram back.
• The diagrams follow your GitHub theme, so dark mode gets the dark render and light mode the light one, and the moving dots show this pull request's data in motion.

---

◈ Rendered by PR Lens · crafted with ❤️ by the Coldtea team · Come say hi on Discord

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Advanced

Run ID: a04a57bb-2ec3-4718-9196-ffd6ac13fb4e

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}