liniting and build fixes

Author: PinJinx

package-lock.json

@@ -28,6 +28,7 @@
 		"lucide-react": "^0.561.0",
 		"nitro": "^3.0.260429-beta",
 		"nitro-nightly": "^3.0.1-20260501-164602-aee73f19",
+		"node-datachannel": "^0.32.3",
 		"qrcode": "^1.5.4",
 		"react": "^19.2.5",
 		"react-dom": "^19.2.5",
@@ -37,6 +38,7 @@
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^2.4.14",
+		"@rolldown/plugin-babel": "^0.2.3",
 		"@tailwindcss/postcss": "^4.1.18",
 		"@tailwindcss/typography": "^0.5.19",
 		"@tanstack/devtools-vite": "^0.6.0",
@@ -51,6 +53,7 @@
 		"@types/ws": "^8.5.14",
 		"@vitejs/plugin-react": "^5.2.0",
 		"autoprefixer": "^10.4.23",
+		"babel-plugin-react-compiler": "^1.0.0",
 		"concurrently": "^9.2.1",
 		"daisyui": "^5.5.14",
 		"electron": "^40.6.1",

package.json

@@ -13,7 +13,7 @@ interface ScreenMirrorProps {
 
 const TEXTS = {
 	WAITING: "Connecting to host desktop...",
-	AUTOMATIC: "Establishing secure low-latency WebRTC connection",
+	AUTOMATIC: "Establishing secure connection",
 }
 
 export const ScreenMirror = ({
@@ -24,11 +24,15 @@ export const ScreenMirror = ({
 	trackActive,
 }: ScreenMirrorProps) => {
 	const videoElementRef = useRef<HTMLVideoElement | null>(null)
-
 	useEffect(() => {
-		if (videoElementRef.current && videoStream) {
-			videoElementRef.current.srcObject = videoStream
-			videoElementRef.current.play().catch(() => {})
+		const video = videoElementRef.current
+		if (!video) return
+		video.srcObject = videoStream
+		if (videoStream) {
+			video.play().catch(() => {})
+		}
+		return () => {
+			video.srcObject = null
 		}
 	}, [videoStream])
 
@@ -37,6 +41,7 @@ export const ScreenMirror = ({
 			{/* Hardware Accelerated Video Renderer */}
 			<video
 				ref={videoElementRef}
+				aria-label="Remote desktop screen share"
 				autoPlay
 				playsInline
 				muted

src/components/Trackpad/ScreenMirror.tsx

@@ -47,7 +47,11 @@ export function ConnectionProvider({
 				: null
 
 		// High frequency mouse/touch inputs go to unordered; keyboard/clicks and others go to ordered.
-		const isUnordered = type === "move" || type === "scroll" || type === "touch"
+		const isUnordered =
+			type === "move" ||
+			type === "scroll" ||
+			type === "touch" ||
+			type === "zoom"
 		const targetDc = isUnordered ? unorderedDcRef.current : orderedDcRef.current
 
 		if (targetDc?.readyState === "open") {

src/contexts/ConnectionProvider.tsx

@@ -1,3 +1,4 @@
+"use client"
 import { useConnection } from "../contexts/ConnectionProvider"
 
 export const useRemoteConnection = () => {

src/hooks/useRemoteConnection.ts

@@ -106,24 +106,10 @@ export function useWebRtcStream({ token }: UseWebRtcStreamOptions) {
 			}).catch(console.error)
 		}
 
-		// Send input PC offer to server immediately
-		const sendInputOffer = async () => {
-			const offer = await inputPc.createOffer()
-			await inputPc.setLocalDescription(offer)
-			await fetch("/api/webrtc/input-offer", {
-				method: "POST",
-				headers: {
-					"Content-Type": "application/json",
-					...(token ? { Authorization: `Bearer ${token}` } : {}),
-				},
-				body: JSON.stringify({ sessionId: activeSessionId, sdp: offer.sdp }),
-			})
-		}
-
-		sendInputOffer().catch(console.error)
-
 		// ── SSE bridge: handles both video offer and input-answer ────────────
-		const sseUrl = `/api/webrtc/events?sessionId=${activeSessionId}${token ? `&token=${token}` : ""}`
+		const sseParams = new URLSearchParams({ sessionId: activeSessionId })
+		if (token) sseParams.set("token", token)
+		const sseUrl = `/api/webrtc/events?${sseParams.toString()}`
 		const sse = new EventSource(sseUrl)
 		sseSourceRef.current = sse
 
@@ -226,6 +212,20 @@ export function useWebRtcStream({ token }: UseWebRtcStreamOptions) {
 				inputIceQueue.push(candidateInit)
 			}
 		})
+		const sendInputOffer = async () => {
+			const offer = await inputPc.createOffer()
+			await inputPc.setLocalDescription(offer)
+			await fetch("/api/webrtc/input-offer", {
+				method: "POST",
+				headers: {
+					"Content-Type": "application/json",
+					...(token ? { Authorization: `Bearer ${token}` } : {}),
+				},
+				body: JSON.stringify({ sessionId: activeSessionId, sdp: offer.sdp }),
+			})
+		}
+
+		sendInputOffer().catch(console.error)
 
 		return () => {
 			sse.close()

src/hooks/useWebRtcStream.ts

@@ -5,7 +5,7 @@ import {
 	Scripts,
 	createRootRoute,
 } from "@tanstack/react-router"
-import { useEffect, useRef } from "react"
+import { useEffect } from "react"
 import { APP_CONFIG, THEMES } from "../config"
 import "../styles.css"
 import {

src/routes/__root.tsx

@@ -89,7 +89,10 @@ export async function readBody(req: IncomingMessage): Promise<string> {
 		req.setEncoding("utf-8")
 		req.on("data", (chunk: string) => {
 			raw += chunk
-			if (raw.length > 64 * 1024) reject(new Error("Request body too large"))
+			if (raw.length > 64 * 1024) {
+				req.destroy()
+				reject(new Error("Request body too large"))
+			}
 		})
 		req.on("end", () => resolve(raw))
 		req.on("error", reject)
@@ -706,4 +709,5 @@ export async function handleWhipSignalingExchange(
 			res.end(JSON.stringify({ error: "WHIP signaling handshake timeout" }))
 		}
 	}, 100)
+	req.on("close", () => clearInterval(answerCheckInterval))
 }

src/server/api/apiHandlers.ts

@@ -5,7 +5,7 @@
 import type { ServerResponse } from "node:http"
 import { getActiveToken, generateToken, storeToken } from "../tokenStore"
 import { HostRunner } from "../gstreamer/hostRunner"
-import type { InputPeerConnection } from "../InputPeerConnection"
+import type { InputPeerConnection } from "./InputPeerConnection"
 import logger from "../../utils/logger"
 
 export type SessionState =

src/server/api/apiState.ts

@@ -72,19 +72,22 @@ class UinputDevice {
 	}
 
 	open(): boolean {
-		const fd = openUinput(UINPUT_PATH)
-		if (fd < 0) {
-			console.error(`[${this.name}] Failed to open ${UINPUT_PATH} (fd=${fd})`)
+		try {
+			const fd = openUinput(UINPUT_PATH)
+			this.fd = fd
+			return true
+		} catch (err) {
+			console.error(`[${this.name}] Failed to open ${UINPUT_PATH}:`, err)
 			console.error(
 				`[${this.name}] Ensure /dev/uinput exists and the process has write permission.`,
 			)
 			console.error(
-				`[${this.name}] Run: sudo chmod 0660 /dev/uinput  or add udev rule.`,
+				`[${this.name}] Run: sudo chown root:input /dev/uinput && sudo chmod 0660 /dev/uinput  or add udev rule.`,
+			)
+			throw new Error(
+				`Failed to open /dev/uinput. Ensure your user has write permissions (run: sudo chown root:input /dev/uinput && sudo chmod 0660 /dev/uinput)`,
 			)
-			return false
 		}
-		this.fd = fd
-		return true
 	}
 
 	create(deviceName: string): boolean {