fix: refresh plugin settings after enabling a plugin and match select and disabled bar styling

src/ui/tests/plugin-host/bridge.test.ts

@@ -1,5 +1,48 @@
-import { describe, expect, it } from "vitest";
-import { toHostRecord } from "@/plugin-host/bridge";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { act, cleanup, renderHook, waitFor } from "@testing-library/react";
+
+const getPluginUserSettings = vi.hoisted(() => vi.fn());
+
+vi.mock("@/api/plugins-api", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("@/api/plugins-api")>()),
+  getPluginUserSettings,
+}));
+
+import { pluginHostBridge, toHostRecord } from "@/plugin-host/bridge";
+import { PLUGIN_SETTINGS_CHANGED_EVENT } from "@/api/plugins-api";
+
+afterEach(cleanup);
+
+function announce(pluginId: string, scope: string) {
+  act(() => {
+    window.dispatchEvent(
+      new CustomEvent(PLUGIN_SETTINGS_CHANGED_EVENT, {
+        detail: { pluginId, scope },
+      }),
+    );
+  });
+}
+
+describe("useSettings", () => {
+  it("reads again when the settings page saves the same plugin and scope", async () => {
+    getPluginUserSettings.mockResolvedValueOnce({ enabled: false });
+    const { result } = renderHook(() =>
+      pluginHostBridge.useSettings("ai", "user"),
+    );
+    await waitFor(() => expect(result.current.loaded).toBe(true));
+    expect(result.current.values).toEqual({ enabled: false });
+
+    getPluginUserSettings.mockResolvedValue({ enabled: true });
+    announce("other", "user");
+    announce("ai", "admin");
+    expect(getPluginUserSettings).toHaveBeenCalledTimes(1);
+
+    announce("ai", "user");
+    await waitFor(() =>
+      expect(result.current.values).toEqual({ enabled: true }),
+    );
+  });
+});
 
 describe("toHostRecord", () => {
   it("copies only the fields the SDK types", () => {

src/ui/tests/settings/FeatureSettingsSections.test.tsx

@@ -106,6 +106,22 @@ describe("useFeatureSettings", () => {
     await waitFor(() => expect(api.getPlugins).toHaveBeenCalled());
     expect(result.current).toEqual([]);
   });
+
+  it("picks up a feature enabled while it is open", async () => {
+    api.getPlugins.mockResolvedValue([
+      plugin({ id: "late", name: "Late", enabled: false }),
+    ]);
+    const { result } = renderHook(() => useFeatureSettings("user"));
+    await waitFor(() => expect(api.getPlugins).toHaveBeenCalledTimes(1));
+    expect(result.current).toEqual([]);
+
+    api.getPlugins.mockResolvedValue([plugin({ id: "late", name: "Late" })]);
+    window.dispatchEvent(new CustomEvent("termix:plugins-changed"));
+
+    await waitFor(() =>
+      expect(result.current.map((p) => p.id)).toEqual(["late"]),
+    );
+  });
 });
 
 describe("FeatureSettingsSection", () => {

src/ui/tests/settings/host-feature-tabs.test.tsx

@@ -28,6 +28,7 @@ import { withPluginScope } from "@/plugin-host/scope";
 
 const getPlugins = vi.fn();
 vi.mock("@/api/plugins-api", () => ({
+  PLUGINS_CHANGED_EVENT: "termix:plugins-changed",
   getPlugins: () => getPlugins(),
 }));