feat(FN-1116): add Capacitor plugin managers for dashboard

- Add shared plugin types and manager modules for splash screen, status bar, and network handling
- Export plugin initialization from the dashboard entrypoint and configure Capacitor splash/status-bar defaults
- Add unit tests covering plugin initialization and each manager's behavior across supported scenarios
- Document the plugin manager architecture and add required Capacitor plugin dependencies

packages/dashboard/README.md

@@ -608,3 +608,62 @@ When `FUSION_BADGE_PUBSUB_REDIS_URL` is not set, the dashboard uses an in-memory
 - **Badge Updates**: `useBadgeWebSocket()` shares a single browser socket and subscribes per visible GitHub-linked task card
 - **State Management**: Custom hooks with EventSource for real-time task updates plus a dedicated WebSocket store for badge snapshots
 - **Git Integration**: Server-side git command execution with validation
+
+## Plugin Managers
+
+The dashboard package includes a mobile plugin foundation under `src/plugins/` for Capacitor environments. These managers are framework-agnostic and degrade gracefully in browser/test contexts where native Capacitor APIs are unavailable.
+
+### Included managers
+
+- **`SplashScreenManager`** (`src/plugins/splash-screen.ts`)
+  - Controls splash show/hide behavior
+  - Supports optional auto-hide on init with configurable delay
+- **`StatusBarManager`** (`src/plugins/status-bar.ts`)
+  - Applies light/dark/system status bar styling
+  - Exposes `onThemeChange()` subscription callbacks
+- **`NetworkManager`** (`src/plugins/network.ts`)
+  - Reads initial connectivity state
+  - Monitors connectivity changes and exposes `onStatusChange()` callbacks
+
+### Quick setup with `initializePlugins()`
+
+Use `initializePlugins()` to create and initialize all managers in order:
+
+```ts
+import { initializePlugins } from "@fusion/dashboard";
+
+const { splashScreen, statusBar, network, result } = await initializePlugins({
+  splashAutoHide: true,
+  splashHideDelay: 500,
+  themeMode: "system",
+  startNetworkMonitoring: true,
+});
+
+if (result.errors.length > 0) {
+  console.warn("Some plugins failed to initialize", result.errors);
+}
+```
+
+### Custom setup with individual managers
+
+If you need fine-grained lifecycle control, instantiate managers directly:
+
+```ts
+import {
+  SplashScreenManager,
+  StatusBarManager,
+  NetworkManager,
+} from "@fusion/dashboard";
+
+const splash = new SplashScreenManager({ autoHide: false });
+const statusBar = new StatusBarManager({ themeMode: "dark" });
+const network = new NetworkManager();
+
+await splash.initialize();
+await statusBar.initialize();
+await network.initialize();
+```
+
+### Error handling model
+
+All managers use defensive async APIs and silent fallback handling for unsupported environments (for example, browser development/test runs without native Capacitor bindings). This keeps startup resilient across web, simulator, and device contexts.

packages/dashboard/capacitor.config.ts

@@ -16,13 +16,17 @@ const config: CapacitorConfig = {
   },
   plugins: {
     SplashScreen: {
-      launchAutoHide: true,
+      launchAutoHide: false,
       backgroundColor: "#0a0a0a",
       showSpinner: true,
       spinnerColor: "#6366f1",
       androidSplashAssetName: "splash",
       androidScaleType: "CENTER_CROP",
     },
+    StatusBar: {
+      style: "DARK",
+      backgroundColor: "#0a0a0a",
+    },
   },
 };
 

packages/dashboard/package.json

@@ -35,7 +35,13 @@
     "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.app.json"
   },
   "dependencies": {
+    "@capacitor/app": "^7.1.2",
     "@capacitor/core": "^7.0.0",
+    "@capacitor/network": "^7.0.4",
+    "@capacitor/push-notifications": "^7.0.6",
+    "@capacitor/share": "^7.0.4",
+    "@capacitor/splash-screen": "^7.0.5",
+    "@capacitor/status-bar": "^7.0.6",
     "@codemirror/basic-setup": "^0.20.0",
     "@codemirror/lang-css": "^6.3.1",
     "@codemirror/lang-javascript": "^6.2.3",

packages/dashboard/src/__tests__/initialize.test.ts

@@ -0,0 +1,118 @@
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { initializePlugins } from "../plugins/index.js";
+
+const splashCtorMock = vi.fn();
+const splashInitializeMock = vi.fn();
+const splashDestroyMock = vi.fn();
+
+const statusCtorMock = vi.fn();
+const statusInitializeMock = vi.fn();
+const statusDestroyMock = vi.fn();
+
+const networkCtorMock = vi.fn();
+const networkInitializeMock = vi.fn();
+const networkStopMonitoringMock = vi.fn();
+const networkDestroyMock = vi.fn();
+
+vi.mock("../plugins/splash-screen.js", () => ({
+  SplashScreenManager: vi.fn().mockImplementation(function (options) {
+    splashCtorMock(options);
+    this.initialize = splashInitializeMock;
+    this.destroy = splashDestroyMock;
+  }),
+}));
+
+vi.mock("../plugins/status-bar.js", () => ({
+  StatusBarManager: vi.fn().mockImplementation(function (options) {
+    statusCtorMock(options);
+    this.initialize = statusInitializeMock;
+    this.destroy = statusDestroyMock;
+  }),
+}));
+
+vi.mock("../plugins/network.js", () => ({
+  NetworkManager: vi.fn().mockImplementation(function () {
+    networkCtorMock();
+    this.initialize = networkInitializeMock;
+    this.stopMonitoring = networkStopMonitoringMock;
+    this.destroy = networkDestroyMock;
+  }),
+}));
+
+describe("initializePlugins", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+
+    splashInitializeMock.mockResolvedValue(undefined);
+    splashDestroyMock.mockResolvedValue(undefined);
+
+    statusInitializeMock.mockResolvedValue(undefined);
+    statusDestroyMock.mockResolvedValue(undefined);
+
+    networkInitializeMock.mockResolvedValue(undefined);
+    networkStopMonitoringMock.mockResolvedValue(undefined);
+    networkDestroyMock.mockResolvedValue(undefined);
+  });
+
+  it("initializePlugins() returns all managers", async () => {
+    const { splashScreen, statusBar, network } = await initializePlugins();
+
+    expect(splashScreen).toBeDefined();
+    expect(statusBar).toBeDefined();
+    expect(network).toBeDefined();
+  });
+
+  it("initializePlugins() reports success for all plugins", async () => {
+    const { result } = await initializePlugins();
+
+    expect(result.splashScreen).toBe(true);
+    expect(result.statusBar).toBe(true);
+    expect(result.network).toBe(true);
+    expect(result.errors).toEqual([]);
+  });
+
+  it("initializePlugins() passes options to managers", async () => {
+    await initializePlugins({
+      splashAutoHide: false,
+      splashHideDelay: 1500,
+      themeMode: "dark",
+      startNetworkMonitoring: false,
+    });
+
+    expect(splashCtorMock).toHaveBeenCalledWith({ autoHide: false, hideDelay: 1500 });
+    expect(statusCtorMock).toHaveBeenCalledWith({ themeMode: "dark" });
+    expect(networkCtorMock).toHaveBeenCalledTimes(1);
+    expect(networkStopMonitoringMock).toHaveBeenCalledTimes(1);
+  });
+
+  it("initializePlugins() continues if one manager fails", async () => {
+    statusInitializeMock.mockRejectedValue(new Error("status failed"));
+
+    const { result } = await initializePlugins();
+
+    expect(result.splashScreen).toBe(true);
+    expect(result.statusBar).toBe(false);
+    expect(result.network).toBe(true);
+    expect(result.errors).toHaveLength(1);
+    expect(result.errors[0]?.plugin).toBe("statusBar");
+    expect(result.errors[0]?.error.message).toBe("status failed");
+  });
+
+  it("initializePlugins() collects errors without throwing", async () => {
+    splashInitializeMock.mockRejectedValue(new Error("splash failed"));
+    networkInitializeMock.mockRejectedValue("network failed");
+
+    const execution = initializePlugins();
+
+    await expect(execution).resolves.toBeDefined();
+
+    const { result } = await execution;
+    expect(result.splashScreen).toBe(false);
+    expect(result.statusBar).toBe(true);
+    expect(result.network).toBe(false);
+    expect(result.errors).toHaveLength(2);
+    expect(result.errors[0]?.plugin).toBe("splashScreen");
+    expect(result.errors[1]?.plugin).toBe("network");
+    expect(result.errors[1]?.error).toBeInstanceOf(Error);
+  });
+});

packages/dashboard/src/__tests__/network.test.ts

@@ -0,0 +1,163 @@
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { Network } from "@capacitor/network";
+import { NetworkManager } from "../plugins/network.js";
+
+const { getStatusMock, addListenerMock, removeListenerMock } = vi.hoisted(() => ({
+  getStatusMock: vi.fn(),
+  addListenerMock: vi.fn(),
+  removeListenerMock: vi.fn(),
+}));
+
+let networkStatusChangeHandler:
+  | ((status: { connected: boolean; connectionType: "wifi" | "cellular" | "none" | "unknown" }) => void)
+  | null = null;
+
+vi.mock("@capacitor/network", () => ({
+  Network: {
+    getStatus: getStatusMock,
+    addListener: addListenerMock,
+  },
+}));
+
+describe("NetworkManager", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    networkStatusChangeHandler = null;
+
+    getStatusMock.mockResolvedValue({
+      connected: true,
+      connectionType: "wifi",
+    });
+
+    removeListenerMock.mockResolvedValue(undefined);
+
+    addListenerMock.mockImplementation(async (
+      eventName: string,
+      callback: (status: { connected: boolean; connectionType: "wifi" | "cellular" | "none" | "unknown" }) => void,
+    ) => {
+      if (eventName === "networkStatusChange") {
+        networkStatusChangeHandler = callback;
+      }
+      return { remove: removeListenerMock };
+    });
+  });
+
+  it("initialize() queries current network status", async () => {
+    const manager = new NetworkManager();
+
+    await manager.initialize();
+
+    expect(Network.getStatus).toHaveBeenCalledTimes(1);
+    expect(manager.getStatus()).toEqual({ connected: true, connectionType: "wifi" });
+  });
+
+  it("startMonitoring() registers network listener", async () => {
+    const manager = new NetworkManager();
+
+    await manager.startMonitoring();
+
+    expect(Network.addListener).toHaveBeenCalledTimes(1);
+    expect(Network.addListener).toHaveBeenCalledWith("networkStatusChange", expect.any(Function));
+    expect(manager.isMonitoring).toBe(true);
+  });
+
+  it("status change callback fires on network change", async () => {
+    const manager = new NetworkManager();
+    const callback = vi.fn();
+
+    manager.onStatusChange(callback);
+    await manager.initialize();
+
+    networkStatusChangeHandler?.({ connected: false, connectionType: "none" });
+
+    expect(callback).toHaveBeenCalled();
+    expect(callback).toHaveBeenLastCalledWith({ connected: false, connectionType: "none" });
+  });
+
+  it("going offline triggers callback with connected=false", async () => {
+    const manager = new NetworkManager();
+    const callback = vi.fn();
+
+    manager.onStatusChange(callback);
+    await manager.initialize();
+
+    networkStatusChangeHandler?.({ connected: false, connectionType: "none" });
+
+    expect(callback).toHaveBeenCalledWith({ connected: false, connectionType: "none" });
+    expect(manager.isOnline).toBe(false);
+  });
+
+  it("going online triggers callback with connected=true", async () => {
+    getStatusMock.mockResolvedValue({ connected: false, connectionType: "none" });
+    const manager = new NetworkManager();
+    const callback = vi.fn();
+
+    manager.onStatusChange(callback);
+    await manager.initialize();
+
+    networkStatusChangeHandler?.({ connected: true, connectionType: "wifi" });
+
+    expect(callback).toHaveBeenCalledWith({ connected: true, connectionType: "wifi" });
+    expect(manager.isOnline).toBe(true);
+  });
+
+  it("stopMonitoring() removes listener handle", async () => {
+    const manager = new NetworkManager();
+
+    await manager.initialize();
+    await manager.stopMonitoring();
+
+    expect(removeListenerMock).toHaveBeenCalledTimes(1);
+    expect(manager.isMonitoring).toBe(false);
+  });
+
+  it("getStatus() returns copy (not reference)", async () => {
+    const manager = new NetworkManager();
+
+    await manager.initialize();
+
+    const status = manager.getStatus();
+    status.connected = false;
+    status.connectionType = "none";
+
+    expect(manager.getStatus()).toEqual({ connected: true, connectionType: "wifi" });
+  });
+
+  it("onStatusChange unsubscribe works", async () => {
+    const manager = new NetworkManager();
+    const callback = vi.fn();
+
+    const unsubscribe = manager.onStatusChange(callback);
+    await manager.initialize();
+    unsubscribe();
+
+    networkStatusChangeHandler?.({ connected: false, connectionType: "none" });
+
+    expect(callback).not.toHaveBeenCalled();
+  });
+
+  it("initialize() swallows errors", async () => {
+    getStatusMock.mockRejectedValue(new Error("network unavailable"));
+    const manager = new NetworkManager();
+
+    await expect(manager.initialize()).resolves.toBeUndefined();
+
+    expect(manager.getStatus()).toEqual({ connected: true, connectionType: "unknown" });
+  });
+
+  it("destroy() stops monitoring and clears listeners", async () => {
+    const manager = new NetworkManager();
+    const callback = vi.fn();
+
+    manager.onStatusChange(callback);
+    await manager.initialize();
+    await manager.destroy();
+
+    networkStatusChangeHandler?.({ connected: false, connectionType: "none" });
+
+    expect(removeListenerMock).toHaveBeenCalledTimes(1);
+    expect(callback).not.toHaveBeenCalled();
+    expect(manager.isMonitoring).toBe(false);
+    expect(manager.isInitialized).toBe(false);
+  });
+});

packages/dashboard/src/__tests__/splash-screen.test.ts

@@ -0,0 +1,92 @@
+import { beforeEach, afterEach, describe, expect, it, vi } from "vitest";
+import { SplashScreen } from "@capacitor/splash-screen";
+import { SplashScreenManager } from "../plugins/splash-screen.js";
+
+vi.mock("@capacitor/splash-screen", () => ({
+  SplashScreen: {
+    hide: vi.fn(),
+    show: vi.fn(),
+  },
+}));
+
+describe("SplashScreenManager", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    vi.mocked(SplashScreen.hide).mockResolvedValue(undefined);
+    vi.mocked(SplashScreen.show).mockResolvedValue(undefined);
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("initialize() with autoHide=true triggers hide after delay", async () => {
+    vi.useFakeTimers();
+    const manager = new SplashScreenManager({ autoHide: true, hideDelay: 100 });
+
+    await manager.initialize();
+    expect(SplashScreen.hide).not.toHaveBeenCalled();
+
+    await vi.advanceTimersByTimeAsync(100);
+
+    expect(SplashScreen.hide).toHaveBeenCalledTimes(1);
+    expect(SplashScreen.hide).toHaveBeenCalledWith({ fadeOutDuration: 300 });
+  });
+
+  it("initialize() with autoHide=false does not auto-hide", async () => {
+    vi.useFakeTimers();
+    const manager = new SplashScreenManager({ autoHide: false, hideDelay: 100 });
+
+    await manager.initialize();
+    await vi.advanceTimersByTimeAsync(500);
+
+    expect(SplashScreen.hide).not.toHaveBeenCalled();
+  });
+
+  it("hide() delegates to SplashScreen.hide()", async () => {
+    const manager = new SplashScreenManager();
+
+    await manager.hide();
+
+    expect(SplashScreen.hide).toHaveBeenCalledTimes(1);
+    expect(SplashScreen.hide).toHaveBeenCalledWith({ fadeOutDuration: 300 });
+  });
+
+  it("show() delegates to SplashScreen.show()", async () => {
+    const manager = new SplashScreenManager();
+
+    await manager.show();
+
+    expect(SplashScreen.show).toHaveBeenCalledTimes(1);
+    expect(SplashScreen.show).toHaveBeenCalledWith({ autoHide: false });
+  });
+
+  it("initialize() is idempotent", async () => {
+    vi.useFakeTimers();
+    const manager = new SplashScreenManager({ autoHide: true, hideDelay: 50 });
+
+    await manager.initialize();
+    await manager.initialize();
+    await vi.advanceTimersByTimeAsync(50);
+
+    expect(SplashScreen.hide).toHaveBeenCalledTimes(1);
+  });
+
+  it("hide() swallows errors gracefully", async () => {
+    vi.mocked(SplashScreen.hide).mockRejectedValue(new Error("unavailable"));
+    const manager = new SplashScreenManager();
+
+    await expect(manager.hide()).resolves.toBeUndefined();
+  });
+
+  it("destroy() resets initialized state", async () => {
+    const manager = new SplashScreenManager({ autoHide: false });
+    await manager.initialize();
+
+    expect(manager.isInitialized).toBe(true);
+
+    await manager.destroy();
+
+    expect(manager.isInitialized).toBe(false);
+  });
+});

packages/dashboard/src/__tests__/status-bar.test.ts

@@ -0,0 +1,126 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { StatusBar, Style } from "@capacitor/status-bar";
+import { StatusBarManager } from "../plugins/status-bar.js";
+
+vi.mock("@capacitor/status-bar", () => ({
+  StatusBar: {
+    setStyle: vi.fn(),
+  },
+  Style: {
+    Dark: "DARK",
+    Light: "LIGHT",
+  },
+}));
+
+describe("StatusBarManager", () => {
+  const originalMatchMedia = globalThis.window?.matchMedia;
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    vi.mocked(StatusBar.setStyle).mockResolvedValue(undefined);
+  });
+
+  afterEach(() => {
+    if (globalThis.window) {
+      Object.defineProperty(globalThis.window, "matchMedia", {
+        configurable: true,
+        writable: true,
+        value: originalMatchMedia,
+      });
+    }
+  });
+
+  it("initialize() applies current theme", async () => {
+    const manager = new StatusBarManager({ themeMode: "dark" });
+
+    await manager.initialize();
+
+    expect(StatusBar.setStyle).toHaveBeenCalledTimes(1);
+    expect(StatusBar.setStyle).toHaveBeenCalledWith({ style: Style.Dark });
+  });
+
+  it("setTheme('dark') sets dark style", async () => {
+    const manager = new StatusBarManager({ themeMode: "light" });
+
+    await manager.setTheme("dark");
+
+    expect(StatusBar.setStyle).toHaveBeenCalledWith({ style: Style.Dark });
+    expect(manager.getTheme()).toBe("dark");
+  });
+
+  it("setTheme('light') sets light style", async () => {
+    const manager = new StatusBarManager({ themeMode: "dark" });
+
+    await manager.setTheme("light");
+
+    expect(StatusBar.setStyle).toHaveBeenCalledWith({ style: Style.Light });
+    expect(manager.getTheme()).toBe("light");
+  });
+
+  it("setTheme('system') detects system preference", async () => {
+    const manager = new StatusBarManager();
+
+    Object.defineProperty(window, "matchMedia", {
+      configurable: true,
+      writable: true,
+      value: vi.fn().mockReturnValue({ matches: true }),
+    });
+
+    await manager.setTheme("system");
+
+    expect(StatusBar.setStyle).toHaveBeenLastCalledWith({ style: Style.Dark });
+
+    Object.defineProperty(window, "matchMedia", {
+      configurable: true,
+      writable: true,
+      value: vi.fn().mockReturnValue({ matches: false }),
+    });
+
+    await manager.setTheme("system");
+
+    expect(StatusBar.setStyle).toHaveBeenLastCalledWith({ style: Style.Light });
+  });
+
+  it("onThemeChange callback fires on theme change", async () => {
+    const manager = new StatusBarManager();
+    const callback = vi.fn();
+
+    manager.onThemeChange(callback);
+    await manager.setTheme("dark");
+
+    expect(callback).toHaveBeenCalledWith("dark");
+    expect(callback).toHaveBeenCalledTimes(1);
+  });
+
+  it("onThemeChange unsubscribe stops callbacks", async () => {
+    const manager = new StatusBarManager();
+    const callback = vi.fn();
+
+    const unsubscribe = manager.onThemeChange(callback);
+    await manager.setTheme("dark");
+    unsubscribe();
+    await manager.setTheme("light");
+
+    expect(callback).toHaveBeenCalledTimes(1);
+  });
+
+  it("initialize() swallows errors", async () => {
+    vi.mocked(StatusBar.setStyle).mockRejectedValue(new Error("not available"));
+    const manager = new StatusBarManager({ themeMode: "dark" });
+
+    await expect(manager.initialize()).resolves.toBeUndefined();
+    expect(manager.isInitialized).toBe(true);
+  });
+
+  it("destroy() clears all listeners", async () => {
+    const manager = new StatusBarManager();
+    const callback = vi.fn();
+
+    manager.onThemeChange(callback);
+    await manager.destroy();
+    await manager.setTheme("dark");
+
+    expect(callback).not.toHaveBeenCalled();
+    expect(manager.isInitialized).toBe(false);
+  });
+});

packages/dashboard/src/index.ts

@@ -12,3 +12,5 @@ export {
   RedisBadgePubSub,
   createBadgePubSub,
 } from "./badge-pubsub.js";
+
+export * from "./plugins/index.js";

packages/dashboard/src/plugins/index.ts

@@ -0,0 +1,99 @@
+import { SplashScreenManager } from "./splash-screen.js";
+import { StatusBarManager } from "./status-bar.js";
+import { NetworkManager } from "./network.js";
+import type { PluginInitOptions, PluginInitResult } from "./types.js";
+
+// Types
+export type {
+  NetworkStatus,
+  ThemeMode,
+  StatusBarStyle,
+  PluginInitOptions,
+  NetworkStatusCallback,
+  ThemeChangeCallback,
+  PluginManager,
+  PluginInitResult,
+} from "./types.js";
+
+// Plugin managers
+export { SplashScreenManager } from "./splash-screen.js";
+export type { SplashScreenOptions } from "./splash-screen.js";
+
+export { StatusBarManager } from "./status-bar.js";
+export type { StatusBarOptions } from "./status-bar.js";
+
+export { NetworkManager } from "./network.js";
+
+/**
+ * Initialize all mobile plugin managers.
+ *
+ * Creates manager instances, initializes them in order (splash → status bar → network),
+ * and returns them along with the initialization results.
+ *
+ * Errors in individual managers are caught and reported in the result
+ * without preventing other managers from initializing.
+ */
+export async function initializePlugins(
+  options: PluginInitOptions = {},
+): Promise<{
+  splashScreen: SplashScreenManager;
+  statusBar: StatusBarManager;
+  network: NetworkManager;
+  result: PluginInitResult;
+}> {
+  const splashScreen = new SplashScreenManager({
+    autoHide: options.splashAutoHide,
+    hideDelay: options.splashHideDelay,
+  });
+
+  const statusBar = new StatusBarManager({
+    themeMode: options.themeMode,
+  });
+
+  const network = new NetworkManager();
+
+  const result: PluginInitResult = {
+    splashScreen: false,
+    statusBar: false,
+    network: false,
+    errors: [],
+  };
+
+  // Initialize splash screen first (so it hides after UI loads)
+  try {
+    await splashScreen.initialize();
+    result.splashScreen = true;
+  } catch (error) {
+    result.errors.push({
+      plugin: "splashScreen",
+      error: error instanceof Error ? error : new Error(String(error)),
+    });
+  }
+
+  // Initialize status bar
+  try {
+    await statusBar.initialize();
+    result.statusBar = true;
+  } catch (error) {
+    result.errors.push({
+      plugin: "statusBar",
+      error: error instanceof Error ? error : new Error(String(error)),
+    });
+  }
+
+  // Initialize network monitoring
+  try {
+    await network.initialize();
+    if (options.startNetworkMonitoring === false) {
+      await network.stopMonitoring();
+    }
+    result.network = true;
+  } catch (error) {
+    result.errors.push({
+      plugin: "network",
+      error: error instanceof Error ? error : new Error(String(error)),
+    });
+  }
+
+  return { splashScreen, statusBar, network, result };
+}

packages/dashboard/src/plugins/network.ts

@@ -0,0 +1,127 @@
+import { Network, type ConnectionType } from "@capacitor/network";
+import type {
+  PluginManager,
+  NetworkStatus,
+  NetworkStatusCallback,
+  PluginNetworkListenerHandle,
+} from "./types.js";
+
+export class NetworkManager implements PluginManager {
+  private status: NetworkStatus;
+  private listeners: Array<NetworkStatusCallback> = [];
+  private networkListenerHandle: PluginNetworkListenerHandle | null = null;
+  private initialized = false;
+  private monitoring = false;
+
+  constructor() {
+    this.status = { connected: true, connectionType: "unknown" };
+  }
+
+  async initialize(): Promise<void> {
+    if (this.initialized) {
+      return;
+    }
+
+    try {
+      const currentStatus = await Network.getStatus();
+      this.status = this.toNetworkStatus(currentStatus.connected, currentStatus.connectionType);
+    } catch {
+      // Network plugin may not be available in browser context
+      this.status = { connected: true, connectionType: "unknown" };
+    }
+
+    await this.startMonitoring();
+    this.initialized = true;
+  }
+
+  async startMonitoring(): Promise<void> {
+    if (this.monitoring) {
+      return;
+    }
+
+    try {
+      this.networkListenerHandle = await Network.addListener(
+        "networkStatusChange",
+        (status) => {
+          const nextStatus = this.toNetworkStatus(status.connected, status.connectionType);
+          const previousConnected = this.status.connected;
+          this.status = nextStatus;
+
+          // Emit specific events for going online/offline
+          if (!previousConnected && nextStatus.connected) {
+            this.emit("network:online", nextStatus);
+          } else if (previousConnected && !nextStatus.connected) {
+            this.emit("network:offline", nextStatus);
+          }
+
+          // Always emit general status change
+          this.emit("network:change", nextStatus);
+        },
+      );
+      this.monitoring = true;
+    } catch {
+      // Network plugin may not be available in browser context
+      this.networkListenerHandle = null;
+      this.monitoring = false;
+    }
+  }
+
+  async stopMonitoring(): Promise<void> {
+    if (this.networkListenerHandle) {
+      try {
+        await this.networkListenerHandle.remove();
+      } catch {
+        // Ignore listener cleanup errors
+      }
+      this.networkListenerHandle = null;
+    }
+
+    this.monitoring = false;
+  }
+
+  getStatus(): NetworkStatus {
+    return { ...this.status };
+  }
+
+  get isOnline(): boolean {
+    return this.status.connected;
+  }
+
+  get isMonitoring(): boolean {
+    return this.monitoring;
+  }
+
+  onStatusChange(callback: NetworkStatusCallback): () => void {
+    this.listeners.push(callback);
+    return () => {
+      this.listeners = this.listeners.filter((cb) => cb !== callback);
+    };
+  }
+
+  private emit(_event: string, status: NetworkStatus): void {
+    for (const listener of this.listeners) {
+      try {
+        listener(status);
+      } catch {
+        // Prevent one listener error from breaking others
+      }
+    }
+  }
+
+  private toNetworkStatus(connected: boolean, connectionType: ConnectionType): NetworkStatus {
+    return {
+      connected,
+      connectionType: connectionType as NetworkStatus["connectionType"],
+    };
+  }
+
+  get isInitialized(): boolean {
+    return this.initialized;
+  }
+
+  async destroy(): Promise<void> {
+    await this.stopMonitoring();
+    this.listeners = [];
+    this.initialized = false;
+  }
+}

packages/dashboard/src/plugins/splash-screen.ts

@@ -0,0 +1,59 @@
+import { SplashScreen } from "@capacitor/splash-screen";
+import type { PluginManager } from "./types.js";
+
+export interface SplashScreenOptions {
+  autoHide?: boolean;
+  hideDelay?: number;
+}
+
+export class SplashScreenManager implements PluginManager {
+  private options: Required<SplashScreenOptions>;
+  private initialized = false;
+
+  constructor(options: SplashScreenOptions = {}) {
+    this.options = {
+      autoHide: options.autoHide ?? true,
+      hideDelay: options.hideDelay ?? 500,
+    };
+  }
+
+  async initialize(): Promise<void> {
+    if (this.initialized) {
+      return;
+    }
+
+    if (this.options.autoHide) {
+      setTimeout(() => {
+        this.hide().catch(() => {
+          // Splash screen may already be hidden or not available (e.g., in browser)
+        });
+      }, this.options.hideDelay);
+    }
+
+    this.initialized = true;
+  }
+
+  async hide(): Promise<void> {
+    try {
+      await SplashScreen.hide({ fadeOutDuration: 300 });
+    } catch {
+      // Ignore errors — splash screen may not be available in browser/web context
+    }
+  }
+
+  async show(): Promise<void> {
+    try {
+      await SplashScreen.show({ autoHide: false });
+    } catch {
+      // Ignore errors — splash screen may not be available in browser/web context
+    }
+  }
+
+  get isInitialized(): boolean {
+    return this.initialized;
+  }
+
+  async destroy(): Promise<void> {
+    this.initialized = false;
+  }
+}

packages/dashboard/src/plugins/status-bar.ts

@@ -0,0 +1,80 @@
+import { StatusBar, Style } from "@capacitor/status-bar";
+import type {
+  PluginManager,
+  ThemeMode,
+  ThemeChangeCallback,
+} from "./types.js";
+
+export interface StatusBarOptions {
+  themeMode?: ThemeMode;
+}
+
+export class StatusBarManager implements PluginManager {
+  private currentTheme: ThemeMode;
+  private listeners: Array<ThemeChangeCallback> = [];
+  private initialized = false;
+
+  constructor(options: StatusBarOptions = {}) {
+    this.currentTheme = options.themeMode ?? "system";
+  }
+
+  async initialize(): Promise<void> {
+    if (this.initialized) {
+      return;
+    }
+
+    try {
+      await this.applyTheme(this.currentTheme);
+    } catch {
+      // StatusBar plugin may not be available in browser context
+    }
+
+    this.initialized = true;
+  }
+
+  async setTheme(mode: ThemeMode): Promise<void> {
+    this.currentTheme = mode;
+    await this.applyTheme(mode);
+    this.listeners.forEach((callback) => callback(mode));
+  }
+
+  getTheme(): ThemeMode {
+    return this.currentTheme;
+  }
+
+  onThemeChange(callback: ThemeChangeCallback): () => void {
+    this.listeners.push(callback);
+    return () => {
+      this.listeners = this.listeners.filter((cb) => cb !== callback);
+    };
+  }
+
+  private async applyTheme(mode: ThemeMode): Promise<void> {
+    const isDark = mode === "dark" || (mode === "system" && this.isSystemDark());
+
+    try {
+      await StatusBar.setStyle({
+        style: isDark ? Style.Dark : Style.Light,
+      });
+    } catch {
+      // StatusBar plugin may not be available in browser context
+    }
+  }
+
+  private isSystemDark(): boolean {
+    if (typeof window === "undefined") {
+      return false;
+    }
+
+    return window.matchMedia("(prefers-color-scheme: dark)").matches;
+  }
+
+  get isInitialized(): boolean {
+    return this.initialized;
+  }
+
+  async destroy(): Promise<void> {
+    this.listeners = [];
+    this.initialized = false;
+  }
+}

packages/dashboard/src/plugins/types.ts

@@ -0,0 +1,50 @@
+import type { PluginListenerHandle } from "@capacitor/core";
+
+/** Network connectivity status */
+export interface NetworkStatus {
+  connected: boolean;
+  connectionType: "wifi" | "cellular" | "none" | "unknown";
+}
+
+/** Theme mode for status bar styling */
+export type ThemeMode = "light" | "dark" | "system";
+
+/** Status bar style mapping */
+export type StatusBarStyle = "light" | "dark";
+
+/** Plugin initialization options */
+export interface PluginInitOptions {
+  /** Auto-hide splash screen after initialization (default: true) */
+  splashAutoHide?: boolean;
+  /** Splash screen hide delay in milliseconds (default: 500) */
+  splashHideDelay?: number;
+  /** Initial theme mode for status bar (default: "system") */
+  themeMode?: ThemeMode;
+  /** Whether to start network monitoring immediately (default: true) */
+  startNetworkMonitoring?: boolean;
+}
+
+/** Callback for network status changes */
+export type NetworkStatusCallback = (status: NetworkStatus) => void;
+
+/** Callback for theme mode changes */
+export type ThemeChangeCallback = (mode: ThemeMode) => void;
+
+/** Generic plugin manager interface */
+export interface PluginManager {
+  /** Initialize the plugin manager */
+  initialize(): Promise<void>;
+  /** Clean up listeners and resources */
+  destroy(): Promise<void>;
+}
+
+/** Shared network listener handle type for manager implementations. */
+export type PluginNetworkListenerHandle = PluginListenerHandle;
+
+/** Result of initializing all plugins */
+export interface PluginInitResult {
+  splashScreen: boolean;
+  statusBar: boolean;
+  network: boolean;
+  errors: Array<{ plugin: string; error: Error }>;
+}

pnpm-lock.yaml

@@ -91,9 +91,27 @@ importers:
 
   packages/dashboard:
     dependencies:
+      '@capacitor/app':
+        specifier: ^7.1.2
+        version: 7.1.2(@capacitor/core@7.6.1)
       '@capacitor/core':
         specifier: ^7.0.0
         version: 7.6.1
+      '@capacitor/network':
+        specifier: ^7.0.4
+        version: 7.0.4(@capacitor/core@7.6.1)
+      '@capacitor/push-notifications':
+        specifier: ^7.0.6
+        version: 7.0.6(@capacitor/core@7.6.1)
+      '@capacitor/share':
+        specifier: ^7.0.4
+        version: 7.0.4(@capacitor/core@7.6.1)
+      '@capacitor/splash-screen':
+        specifier: ^7.0.5
+        version: 7.0.5(@capacitor/core@7.6.1)
+      '@capacitor/status-bar':
+        specifier: ^7.0.6
+        version: 7.0.6(@capacitor/core@7.6.1)
       '@codemirror/basic-setup':
         specifier: ^0.20.0
         version: 0.20.0
@@ -622,6 +640,11 @@ packages:
     peerDependencies:
       '@capacitor/core': ^7.6.0
 
+  '@capacitor/app@7.1.2':
+    resolution: {integrity: sha512-d4I/oF/PRu4megL7/IGKYfe5j7yzSON1FRFgq6kH+m5kH6g7V+wyjHRLauCzGNjdRx4S+nWOumINds0qcRBtKg==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
   '@capacitor/cli@7.6.1':
     resolution: {integrity: sha512-MdmelaYbwWldKlNxiLOhfHV8F8hoM6bIHPRB/+k81FTQoOqq3HYIdHVMZVl7s2800ubNnr4lSP3FevxU20lDew==}
     engines: {node: '>=20.0.0'}
@@ -635,6 +658,31 @@ packages:
     peerDependencies:
       '@capacitor/core': ^7.6.0
 
+  '@capacitor/network@7.0.4':
+    resolution: {integrity: sha512-fNhN3968AQWMnzasPJ0B8e+nyk7+R6V9PWIBQWSQRHrKndDgWRHpxkjEzJPgnJr3EjnKLjbwO+UYy+EwBlGs3A==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
+  '@capacitor/push-notifications@7.0.6':
+    resolution: {integrity: sha512-zAhbHpdbc15ImuVGgoFwUZsKI+jjGxy/oO5mgfYKUx8Xl2OskndzhL79PYsCPjyGLbqUR9NRUZJthV9auVT3nw==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
+  '@capacitor/share@7.0.4':
+    resolution: {integrity: sha512-wNXxmXUcChrtbZ5jQv8scFIbIGKo3rk6B7qpWySxfUhYJP5NANgAqQ9Z69m0k/zYsucdh66SBU7XW1ykd9aUug==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
+  '@capacitor/splash-screen@7.0.5':
+    resolution: {integrity: sha512-bPG2SamFL7VT5I3XsgsGgJhkiyxq3OXCOVKEDupSieVdtEiG7j2vLbSD0xL+91zteF/qLuxsjbugGy5LD8mS2A==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
+  '@capacitor/status-bar@7.0.6':
+    resolution: {integrity: sha512-7AVqj46b26QikImQzWfsJmzG8NUJZBGkrVSuoeTo+SX/YH3hXH0MqwwFgMqMGHfa/BICDgSvTjM9miVFlq0+RQ==}
+    peerDependencies:
+      '@capacitor/core': '>=7.0.0'
+
   '@changesets/apply-release-plan@7.1.0':
     resolution: {integrity: sha512-yq8ML3YS7koKQ/9bk1PqO0HMzApIFNwjlwCnwFEXMzNe8NpzeeYYKCmnhWJGkN8g7E51MnWaSbqRcTcdIxUgnQ==}
 
@@ -5856,6 +5904,10 @@ snapshots:
     dependencies:
       '@capacitor/core': 7.6.1
 
+  '@capacitor/app@7.1.2(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
   '@capacitor/cli@7.6.1':
     dependencies:
       '@ionic/cli-framework-output': 2.2.8
@@ -5886,6 +5938,26 @@ snapshots:
     dependencies:
       '@capacitor/core': 7.6.1
 
+  '@capacitor/network@7.0.4(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
+  '@capacitor/push-notifications@7.0.6(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
+  '@capacitor/share@7.0.4(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
+  '@capacitor/splash-screen@7.0.5(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
+  '@capacitor/status-bar@7.0.6(@capacitor/core@7.6.1)':
+    dependencies:
+      '@capacitor/core': 7.6.1
+
   '@changesets/apply-release-plan@7.1.0':
     dependencies:
       '@changesets/config': 3.1.3