feat(plugins): plugin system with extension points, consent, Wasm runtime and plugin API 1.0 (#971)

A plugin system built on WebAssembly components (wasmtime, WASI p2), with a
typed WIT API (`openidea:[email protected]`) and a Rust SDK, shipped as a preview.

- Extension points declared in `plugin.toml` (commands, languages, themes,
  icon themes, menus, key bindings, status items, settings, views, custom
  editors, file icons and templates, run detectors, editor providers),
  validated before anything takes effect and projected onto the workbench's
  own registries: plugin themes and file icon themes are chosen in
  Settings › Appearance and Quick Switch, plugin shortcuts are edited in
  Settings › Keymap, plugin problems are grouped in Settings › Inspections.
- Capabilities with risk levels and consent at install, pinned `process:`
  programs, secrets in the OS keychain.
- Runtime: one thread per active plugin, fuel/time/memory budgets, soft and
  hard deadlines on the editing path, cancellation, crash backoff, idle
  reclaim, a precompiled-component cache; remote projects run code plugins on
  `openidea-server`.
- Web views and custom editors with a sandboxed page, a document bridge
  joined to the text editor's undo history, and split or preview layouts.
- Distribution: signed `.oiplugin` packages, a static marketplace index with
  revocation, versioned installs with rollback, install from a `.zip` or a
  folder. The release workflow signs and publishes the official plugins and
  their index, which released builds use as the default marketplace.
- Official plugins: String Tools, Key Promoter, Git Toolbox, AI Completion,
  Checkstyle, MyBatis Navigator, CSV Editor, Solidity, Material Icons, Harbor
  Night, Excalidraw, Graphviz, Regex Tester, License Header.

Closes #732

Co-authored-by: Deng Liu <[email protected]>
Co-authored-by: florentvdry <[email protected]>

src/workbench/TitleBar.tsx

@@ -24,7 +24,8 @@ import { WindowControls } from "./WindowControls";
 import { usePlatform } from "@/platform/platformInfo";
 import { projectInitials } from "./projectColor";
 import { keymapItems, themeItems, VIEW_MODE_ITEMS } from "./quickSwitch";
-import { currentThemeId, useThemeOverride } from "./theme";
+import { useContributedThemes } from "@/platform/themes";
+import { currentThemeChoice, useThemeOverride } from "./theme";
 import styles from "./TitleBar.module.css";
 import { useNativeTitlebar } from "./nativeTitlebar";
 
@@ -202,8 +203,9 @@ function GearButton({ customize }: { customize: MenuItem[] }) {
   useActions((s) => s.actions);
   const preset = useKeymap((s) => s.preset);
   const customs = settings?.customKeymaps;
+  useContributedThemes((s) => s.themes);
   const items = gearMenuItems(
-    currentThemeId(),
+    currentThemeChoice(),
     typeof settings?.keymap === "string" ? settings.keymap : preset,
     customs && typeof customs === "object" ? Object.keys(customs) : [],
     customize,

src/workbench/contributions.ts

@@ -941,6 +941,26 @@ export type ContextMenuId =
   | "selectIn"
   | "new";
 
+/**
+ * Entries of the native main menu's open slots (src-tauri/src/menu.rs
+ * `Entry::Dynamic`), e.g. `pluginTools` at the end of Tools: each runs `action`.
+ */
+export interface MenuSlotItem {
+  action: string;
+  arg?: string | null;
+  label: string;
+}
+
+export const useMenuSlotItems = create<{ slots: Record<string, MenuSlotItem[]> }>(() => ({ slots: {} }));
+
+export function registerMenuSlotItem(slot: string, item: MenuSlotItem): () => void {
+  useMenuSlotItems.setState((s) => ({ slots: { ...s.slots, [slot]: [...(s.slots[slot] ?? []), item] } }));
+  return () =>
+    useMenuSlotItems.setState((s) => ({
+      slots: { ...s.slots, [slot]: (s.slots[slot] ?? []).filter((i) => i !== item) },
+    }));
+}
+
 export interface MenuGroupContext {
   /** Files / directories the menu is for (absolute paths; a virtual URI for virtual documents). */
   paths: string[];

src/workbench/quickSwitch.ts

@@ -8,7 +8,8 @@ import { editorPrefs } from "@/platform/editorSettings";
 import { PRESET_TITLES, useKeymap } from "@/platform/keymap";
 import { useProject } from "@/platform/project";
 import type { MenuItem } from "@/ui";
-import { currentThemeId, setTheme, THEME_CHOICES } from "./theme";
+import { themeChoices } from "@/platform/themes";
+import { currentThemeChoice, setTheme } from "./theme";
 
 async function setGlobal(key: string, value: unknown, what: string) {
   if (!isTauri()) return;
@@ -21,10 +22,12 @@ async function setGlobal(key: string, value: unknown, what: string) {
 
 export const selectKeymap = (id: string) => setGlobal("keymap", id, "keymap");
 
-export function themeItems(themeId: string = currentThemeId()): MenuItem[] {
-  return THEME_CHOICES.map<MenuItem>((c) => ({
+export function themeItems(themeId: string = currentThemeChoice()): MenuItem[] {
+  return themeChoices().map<MenuItem>((c) => ({
     id: `theme.${c.id}`,
     label: c.label,
+    // Plugin themes keep their own names.
+    verbatim: !!c.origin,
     checked: c.id === themeId,
     run: () => void setTheme(c.id),
   }));

src/workbench/statusBarWidgets.ts

@@ -24,7 +24,14 @@ export function statusBarMenu(
     .filter((i) => i.title)
     .map((i) => {
       const visible = isStatusItemVisible(i, overrides);
-      return { id: i.id, label: i.title!, checked: visible, run: () => set(i.id, !visible) };
+      // Plugin widgets are named by their plugin, not translated.
+      return {
+        id: i.id,
+        label: i.title!,
+        verbatim: i.id.startsWith("plugin."),
+        checked: visible,
+        run: () => set(i.id, !visible),
+      };
     });
 }
 

src/workbench/theme.ts

@@ -4,10 +4,21 @@ import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
 import { create } from "zustand";
 import { call, commands, isTauri } from "@/platform/ipc";
 import { useProject } from "@/platform/project";
-import { BUILTIN_THEMES, isBuiltinTheme, themeKind, type BuiltinThemeId } from "@/platform/themes";
+import {
+  baseTheme,
+  isThemeChoiceId,
+  parsePluginThemeRef,
+  themeChoices,
+  themeKind,
+  useContributedThemes,
+  type BuiltinThemeId,
+  type ThemeChoice,
+  type ThemeChoiceId,
+} from "@/platform/themes";
 import { resolveTokenColor, toHex } from "@/platform/cssColor";
+import type { SelectOption } from "@/ui";
 
-export type ThemeSetting = BuiltinThemeId | "system";
+export type ThemeSetting = ThemeChoiceId | "system";
 /** PyCharm's brand blue: the accent both Islands themes ship with. */
 export const DEFAULT_ACCENT = "#3871e1";
 /** Accent presets (Settings › Appearance, Welcome › Customize); the first is the Islands default. */
@@ -26,13 +37,13 @@ export const useThemeOverride = create<{ theme: ThemeSetting | null }>(() => ({
 const media = () =>
   typeof window !== "undefined" && window.matchMedia ? window.matchMedia("(prefers-color-scheme: light)") : null;
 
-function subscribeScheme(cb: () => void) {
+export function subscribeScheme(cb: () => void) {
   const m = media();
   m?.addEventListener?.("change", cb);
   return () => m?.removeEventListener?.("change", cb);
 }
 
-const prefersLight = () => !!media()?.matches;
+export const prefersLight = () => !!media()?.matches;
 
 interface AppearanceLike {
   theme?: string;
@@ -42,16 +53,26 @@ interface AppearanceLike {
 }
 
 /**
- * Concrete theme id: the chosen theme, or with "Sync with OS" (legacy
- * `theme = "system"`) the preferred light / dark theme for the OS mode.
+ * The theme in effect as the settings name it: the chosen theme, or with
+ * "Sync with OS" (legacy `theme = "system"`) the preferred light / dark theme
+ * for the OS mode. A plugin theme (`plugin:<id>/<theme>`) is returned as is.
  */
-export function resolveThemeId(a: AppearanceLike | undefined, systemLight: boolean): BuiltinThemeId {
-  const concrete = (v: string | undefined, d: "dark" | "light") => (isBuiltinTheme(v) ? v : d);
+export function resolveThemeChoice(a: AppearanceLike | undefined, systemLight: boolean): ThemeChoiceId {
+  const concrete = (v: string | undefined, d: "dark" | "light") => (isThemeChoiceId(v) ? v : d);
   if (a?.syncWithOs || a?.theme === "system")
     return systemLight ? concrete(a?.preferredLightTheme, "light") : concrete(a?.preferredDarkTheme, "dark");
   return concrete(a?.theme, "light");
 }
 
+/**
+ * Concrete built-in theme id: the one chosen, or the base of a chosen plugin
+ * theme (its light / dark default, which also shows while its plugin is off).
+ */
+export function resolveThemeId(a: AppearanceLike | undefined, systemLight: boolean): BuiltinThemeId {
+  const sync = !!(a?.syncWithOs || a?.theme === "system");
+  return baseTheme(resolveThemeChoice(a, systemLight), sync && !systemLight ? "dark" : "light");
+}
+
 /** `dark-hc` resolves to `dark` plus `data-contrast="high"`. */
 export function resolveTheme(setting: string | undefined, systemLight: boolean): "dark" | "light" {
   return themeKind(resolveThemeId({ theme: setting }, systemLight));
@@ -63,6 +84,8 @@ export function useApplyTheme() {
   const appearance = useProject((s) => s.settings?.appearance);
   const override = useThemeOverride((s) => s.theme);
   const systemLight = useSyncExternalStore(subscribeScheme, prefersLight, () => false);
+  // A plugin theme's kind is known once its plugin is live.
+  useContributedThemes((s) => s.themes);
   const id = override
     ? resolveThemeId({ theme: override }, systemLight)
     : resolveThemeId(appearance as AppearanceLike | undefined, systemLight);
@@ -171,10 +194,13 @@ export function currentTheme(): "dark" | "light" {
   return themeKind(currentThemeId());
 }
 
-/** Themes offered by quick switch menus, in IDEA's order. */
-export const THEME_CHOICES = BUILTIN_THEMES;
+/** Themes offered by the theme pickers and quick switch menus: built-in, then plugins'. */
+export function useThemeChoices(): ThemeChoice[] {
+  const contributed = useContributedThemes((s) => s.themes);
+  return themeChoices(contributed);
+}
 
-/** The concrete theme in effect (`dark-hc` kept distinct). */
+/** The concrete built-in theme in effect (`dark-hc` kept distinct; a plugin theme's base). */
 export function currentThemeId(): BuiltinThemeId {
   const override = useThemeOverride.getState().theme;
   return override
@@ -182,6 +208,14 @@ export function currentThemeId(): BuiltinThemeId {
     : resolveThemeId(useProject.getState().settings?.appearance as AppearanceLike | undefined, prefersLight());
 }
 
+/** The theme in effect as selected: built-in or a plugin's. */
+export function currentThemeChoice(): ThemeChoiceId {
+  const override = useThemeOverride.getState().theme;
+  return override
+    ? resolveThemeChoice({ theme: override }, prefersLight())
+    : resolveThemeChoice(useProject.getState().settings?.appearance as AppearanceLike | undefined, prefersLight());
+}
+
 export async function setTheme(next: ThemeSetting) {
   useThemeOverride.setState({ theme: next });
   if (!isTauri()) return;
@@ -200,3 +234,24 @@ export async function setTheme(next: ThemeSetting) {
 export async function toggleTheme() {
   await setTheme(currentTheme() === "dark" ? "light" : "dark");
 }
+
+/** The plugin named beside a contributed theme, unless the theme carries its name already. */
+export function originDetail(t: { label: string; origin?: string }): string | undefined {
+  return t.origin && t.origin !== t.label ? t.origin : undefined;
+}
+
+/**
+ * Options for a theme picker: built-in themes, then plugins' (with the plugin
+ * named beside them). A selected plugin theme whose plugin is off stays listed.
+ */
+export function themeSelectOptions(choices: readonly ThemeChoice[], selected?: string): SelectOption<ThemeChoiceId>[] {
+  const options: SelectOption<ThemeChoiceId>[] = choices.map((c) => ({
+    value: c.id,
+    label: c.label,
+    detail: originDetail(c),
+  }));
+  const missing = parsePluginThemeRef(selected);
+  if (missing && !options.some((o) => o.value === selected))
+    options.push({ value: selected as ThemeChoiceId, label: missing.themeId, detail: "Plugin not enabled" });
+  return options;
+}