fix: properly handle trpc requestIDs with HMR

Author: jonathanlab

apps/array/package.json

@@ -145,7 +145,7 @@
     "remark-gfm": "^4.0.1",
     "sonner": "^2.0.7",
     "tippy.js": "^6.3.7",
-    "trpc-electron": "^0.1.2",
+    "@posthog/electron-trpc": "workspace:*",
     "uuid": "^9.0.1",
     "vscode-icons-js": "^11.6.1",
     "zod": "^4.1.12",

apps/array/src/main/index.ts

@@ -7,6 +7,7 @@ import { mkdirSync } from "node:fs";
 import os from "node:os";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
+import { createIPCHandler } from "@posthog/electron-trpc/main";
 import {
   app,
   BrowserWindow,
@@ -16,7 +17,6 @@ import {
   type MenuItemConstructorOptions,
   shell,
 } from "electron";
-import { createIPCHandler } from "trpc-electron/main";
 import "./lib/logger";
 import { ANALYTICS_EVENTS } from "../types/analytics.js";
 import { container } from "./di/container.js";

apps/array/src/main/preload.ts

@@ -1,4 +1,4 @@
-import { exposeElectronTRPC } from "trpc-electron/main";
+import { exposeElectronTRPC } from "@posthog/electron-trpc/main";
 import "electron-log/preload";
 
 process.once("loaded", async () => {

apps/array/src/main/services/ui/service.ts

@@ -2,10 +2,6 @@ import { injectable } from "inversify";
 import { TypedEventEmitter } from "../../lib/typed-event-emitter.js";
 import { UIServiceEvent, type UIServiceEvents } from "./schemas.js";
 
-/**
- * UIService handles UI events that need to be communicated from main to renderer.
- * These are typically triggered by menu items or other main process actions.
- */
 @injectable()
 export class UIService extends TypedEventEmitter<UIServiceEvents> {
   openSettings(): void {

apps/array/src/renderer/trpc/client.ts

@@ -1,6 +1,6 @@
+import { ipcLink } from "@posthog/electron-trpc/renderer";
 import { createTRPCProxyClient } from "@trpc/client";
 import { type CreateTRPCReact, createTRPCReact } from "@trpc/react-query";
-import { ipcLink } from "trpc-electron/renderer";
 import type { TrpcRouter } from "../../main/trpc/router.js";
 
 export function createTrpcClient() {

packages/electron-trpc/dts-bundle-generator.config.cjs

@@ -0,0 +1,19 @@
+const config = {
+  compilationOptions: {
+    preferredConfigPath: "./tsconfig.json",
+  },
+  entries: [
+    {
+      filePath: "./src/renderer/index.ts",
+      outFile: `./dist/renderer.d.ts`,
+      noCheck: true,
+    },
+    {
+      filePath: "./src/main/index.ts",
+      outFile: `./dist/main.d.ts`,
+      noCheck: true,
+    },
+  ],
+};
+
+module.exports = config;

packages/electron-trpc/main.d.ts

@@ -0,0 +1,37 @@
+// Generated by dts-bundle-generator v8.1.2
+
+import { AnyTRPCRouter, inferRouterContext } from "@trpc/server";
+import { BrowserWindow, IpcMainInvokeEvent } from "electron";
+
+export declare const ELECTRON_TRPC_CHANNEL = "trpc-electron";
+export interface CreateContextOptions {
+  event: IpcMainInvokeEvent;
+}
+export type MaybePromise<TType> = Promise<TType> | TType;
+declare class IPCHandler<TRouter extends AnyTRPCRouter> {
+  constructor({
+    createContext,
+    router,
+    windows,
+  }: {
+    createContext?: (
+      opts: CreateContextOptions,
+    ) => MaybePromise<inferRouterContext<TRouter>>;
+    router: TRouter;
+    windows?: BrowserWindow[];
+  });
+  attachWindow(win: BrowserWindow): void;
+  detachWindow(win: BrowserWindow, webContentsId?: number): void;
+}
+export declare const createIPCHandler: <TRouter extends AnyTRPCRouter>({
+  createContext,
+  router,
+  windows,
+}: {
+  createContext?: (
+    opts: CreateContextOptions,
+  ) => Promise<inferRouterContext<TRouter>>;
+  router: TRouter;
+  windows?: Electron.BrowserWindow[];
+}) => IPCHandler<TRouter>;
+export declare const exposeElectronTRPC: () => void;

packages/electron-trpc/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@posthog/electron-trpc",
+  "description": "Electron support for tRPC (forked with HMR fix)",
+  "version": "0.1.0",
+  "type": "module",
+  "exports": {
+    "./main": {
+      "types": "./dist/main/index.d.ts",
+      "import": "./dist/main.mjs"
+    },
+    "./renderer": {
+      "types": "./dist/renderer/index.d.ts",
+      "import": "./dist/renderer.mjs"
+    }
+  },
+  "files": [
+    "dist",
+    "src",
+    "main.d.ts",
+    "renderer.d.ts"
+  ],
+  "scripts": {
+    "build": "vite build -c src/main/vite.config.ts && vite build -c src/renderer/vite.config.ts && pnpm build:types",
+    "build:types": "tsc -p tsconfig.build.json",
+    "dev": "pnpm build",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest -c vitest.config.ts",
+    "test:ci": "vitest run -c vitest.config.ts --coverage"
+  },
+  "devDependencies": {
+    "@trpc/client": "^11.8.0",
+    "@trpc/server": "^11.8.0",
+    "@types/node": "^20.3.1",
+    "@vitest/coverage-v8": "^0.34.0",
+    "builtin-modules": "^3.3.0",
+    "dts-bundle-generator": "^8.0.1",
+    "electron": "^35.2.1",
+    "vite": "^6.0.7",
+    "vite-plugin-commonjs-externals": "^0.1.4",
+    "vitest": "^2.1.8",
+    "typescript": "^5.8.3"
+  },
+  "peerDependencies": {
+    "@trpc/client": ">=11.0.0",
+    "@trpc/server": ">=11.0.0",
+    "electron": ">19.0.0"
+  }
+}

packages/electron-trpc/renderer.d.ts

@@ -0,0 +1,13 @@
+// Generated by dts-bundle-generator v8.1.2
+
+import { TRPCLink } from "@trpc/client";
+import { TransformerOptions } from "@trpc/client/unstable-internals";
+import { AnyTRPCRouter, inferTRPCClientTypes } from "@trpc/server";
+
+export declare const ELECTRON_TRPC_CHANNEL = "trpc-electron";
+export type IPCLinkOptions<TRouter extends AnyTRPCRouter> = TransformerOptions<
+  inferTRPCClientTypes<TRouter>
+>;
+export declare function ipcLink<TRouter extends AnyTRPCRouter>(
+  opts?: IPCLinkOptions<TRouter>,
+): TRPCLink<TRouter>;

packages/electron-trpc/src/constants.ts

@@ -0,0 +1 @@
+export const ELECTRON_TRPC_CHANNEL = "trpc-electron";