@three333/termbuddy 0.1.0

package/src/hooks/useBroadcaster.ts

@@ -0,0 +1,52 @@
+import {useEffect} from 'react';
+import dgram from 'node:dgram';
+import {UDP_PORT, DISCOVERY_VERSION} from '../constants.js';
+import type {DiscoveryPacket} from '../protocol.js';
+import {getBroadcastTargets} from '../net/index.js';
+
+type Options =
+	| {enabled: false}
+	| {enabled: true; hostName: string; roomName: string; tcpPort?: number | null; intervalMs?: number};
+
+export function useBroadcaster(options: Options) {
+	const depKey = options.enabled
+		? `${options.hostName}|${options.roomName}|${options.tcpPort ?? ''}|${options.intervalMs ?? 1000}`
+		: 'disabled';
+
+	useEffect(() => {
+		if (!options.enabled) return;
+		if (!options.tcpPort) return;
+
+		const socket = dgram.createSocket('udp4');
+		socket.on('error', () => {});
+
+		socket.bind(() => {
+			socket.setBroadcast(true);
+		});
+
+		const targets = getBroadcastTargets();
+
+		const send = () => {
+			const packet: DiscoveryPacket = {
+				type: 'termbuddy_discovery',
+				version: DISCOVERY_VERSION,
+				hostName: options.hostName,
+				roomName: options.roomName,
+				tcpPort: options.tcpPort!,
+				sentAt: Date.now()
+			};
+			const msg = Buffer.from(JSON.stringify(packet));
+			for (const address of targets) {
+				socket.send(msg, UDP_PORT, address);
+			}
+		};
+
+		send();
+		const id = setInterval(send, options.intervalMs ?? 1000);
+
+		return () => {
+			clearInterval(id);
+			socket.close();
+		};
+	}, [depKey]);
+}

package/src/hooks/useCountdown.ts

@@ -0,0 +1,42 @@
+import {useCallback, useEffect, useRef, useState} from 'react';
+
+function formatMMSS(totalSeconds: number) {
+	const m = Math.floor(totalSeconds / 60);
+	const s = totalSeconds % 60;
+	return `${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`;
+}
+
+export function useCountdown() {
+	const [remainingSeconds, setRemainingSeconds] = useState<number | null>(null);
+	const timerRef = useRef<NodeJS.Timeout | null>(null);
+
+	const start = useCallback((minutes: number) => {
+		const seconds = Math.max(1, Math.floor(minutes * 60));
+		setRemainingSeconds(seconds);
+		if (timerRef.current) clearInterval(timerRef.current);
+		timerRef.current = setInterval(() => {
+			setRemainingSeconds((prev) => {
+				if (prev === null) return null;
+				if (prev <= 1) return null;
+				return prev - 1;
+			});
+		}, 1000);
+	}, []);
+
+	useEffect(() => {
+		if (remainingSeconds !== null) return;
+		if (timerRef.current) clearInterval(timerRef.current);
+		timerRef.current = null;
+	}, [remainingSeconds]);
+
+	useEffect(() => {
+		return () => {
+			if (timerRef.current) clearInterval(timerRef.current);
+		};
+	}, []);
+
+	return {
+		start,
+		label: remainingSeconds === null ? null : formatMMSS(remainingSeconds)
+	};
+}

package/src/hooks/useScanner.ts

@@ -0,0 +1,60 @@
+import {useEffect, useState} from 'react';
+import dgram from 'node:dgram';
+import {UDP_PORT, DISCOVERY_VERSION} from '../constants.js';
+import type {DiscoveryPacket} from '../protocol.js';
+import type {DiscoveredRoom} from '../types.js';
+
+function safeParse(msg: Buffer): DiscoveryPacket | null {
+	try {
+		const parsed = JSON.parse(msg.toString('utf8')) as DiscoveryPacket;
+		if (parsed?.type !== 'termbuddy_discovery') return null;
+		if (parsed?.version !== DISCOVERY_VERSION) return null;
+		if (!parsed.hostName || !parsed.roomName || !parsed.tcpPort) return null;
+		return parsed;
+	} catch {
+		return null;
+	}
+}
+
+export function useScanner(options?: {staleAfterMs?: number}): DiscoveredRoom[] {
+	const staleAfterMs = options?.staleAfterMs ?? 3500;
+	const [rooms, setRooms] = useState<DiscoveredRoom[]>([]);
+
+	useEffect(() => {
+		const socket = dgram.createSocket('udp4');
+		socket.on('error', () => {});
+
+		socket.on('message', (msg, rinfo) => {
+			const packet = safeParse(msg);
+			if (!packet) return;
+
+			const now = Date.now();
+			setRooms((prev) => {
+				const key = `${rinfo.address}:${packet.tcpPort}`;
+				const next = prev.filter((r) => `${r.ip}:${r.tcpPort}` !== key);
+				next.push({
+					ip: rinfo.address,
+					hostName: packet.hostName,
+					roomName: packet.roomName,
+					tcpPort: packet.tcpPort,
+					lastSeenAt: now
+				});
+				return next;
+			});
+		});
+
+		socket.bind(UDP_PORT, () => {});
+
+		const prune = setInterval(() => {
+			const now = Date.now();
+			setRooms((prev) => prev.filter((r) => now - r.lastSeenAt <= staleAfterMs));
+		}, 500);
+
+		return () => {
+			clearInterval(prune);
+			socket.close();
+		};
+	}, [staleAfterMs]);
+
+	return rooms;
+}

package/src/hooks/useTcpSync.ts

@@ -0,0 +1,153 @@
+import {useCallback, useEffect, useRef, useState} from 'react';
+import net from 'node:net';
+import type {ActivityState, ConnectionStatus, TcpPacket} from '../protocol.js';
+import {TCP_DEFAULT_PORT} from '../constants.js';
+
+type HostOptions = {role: 'host'; localName: string; port?: number};
+type ClientOptions = {role: 'client'; localName: string; hostIp: string; tcpPort: number; hostName?: string};
+type Options = HostOptions | ClientOptions;
+
+function writePacket(socket: net.Socket, packet: TcpPacket) {
+	socket.write(`${JSON.stringify(packet)}\n`, 'utf8');
+}
+
+export function useTcpSync(options: Options): {
+	status: ConnectionStatus;
+	listenPort?: number;
+	peerName?: string;
+	remoteState?: ActivityState;
+	sendStatus: (state: ActivityState) => void;
+} {
+	const [status, setStatus] = useState<ConnectionStatus>(options.role === 'host' ? 'waiting' : 'connecting');
+	const [listenPort, setListenPort] = useState<number | undefined>(undefined);
+	const [peerName, setPeerName] = useState<string | undefined>(undefined);
+	const [remoteState, setRemoteState] = useState<ActivityState | undefined>(undefined);
+
+	const socketRef = useRef<net.Socket | null>(null);
+	const lastSeenRef = useRef<number>(Date.now());
+	const heartbeatRef = useRef<NodeJS.Timeout | null>(null);
+
+	const cleanupSocket = useCallback(() => {
+		if (heartbeatRef.current) clearInterval(heartbeatRef.current);
+		heartbeatRef.current = null;
+
+		const s = socketRef.current;
+		socketRef.current = null;
+		if (s && !s.destroyed) s.destroy();
+	}, []);
+
+	const attachSocket = useCallback(
+		(s: net.Socket) => {
+			cleanupSocket();
+			socketRef.current = s;
+			lastSeenRef.current = Date.now();
+
+			setStatus('connected');
+			setRemoteState('IDLE');
+
+			let buf = '';
+			s.setNoDelay(true);
+			s.setEncoding('utf8');
+
+			const onData = (chunk: string) => {
+				buf += chunk;
+				while (true) {
+					const idx = buf.indexOf('\n');
+					if (idx === -1) break;
+					const line = buf.slice(0, idx).trim();
+					buf = buf.slice(idx + 1);
+					if (!line) continue;
+					try {
+						const packet = JSON.parse(line) as TcpPacket;
+						lastSeenRef.current = Date.now();
+						if (packet.type === 'hello') {
+							if (options.role === 'host') setPeerName(packet.clientName);
+							else setPeerName(packet.hostName);
+						}
+						if (packet.type === 'status') setRemoteState(packet.state);
+						if (packet.type === 'ping') writePacket(s, {type: 'pong', sentAt: Date.now()});
+						if (packet.type === 'pong') {
+							// no-op
+						}
+					} catch {
+						// ignore
+					}
+				}
+			};
+
+			s.on('data', onData);
+			s.on('close', () => {
+				setStatus(options.role === 'host' ? 'waiting' : 'disconnected');
+				setRemoteState('OFFLINE');
+				cleanupSocket();
+			});
+			s.on('error', () => {
+				setStatus(options.role === 'host' ? 'waiting' : 'disconnected');
+				setRemoteState('OFFLINE');
+			});
+
+			// Hello handshake.
+			writePacket(s, {
+				type: 'hello',
+				hostName: options.role === 'host' ? options.localName : options.hostName ?? 'Host',
+				clientName: options.role === 'client' ? options.localName : 'Client',
+				sentAt: Date.now()
+			});
+
+			heartbeatRef.current = setInterval(() => {
+				const sock = socketRef.current;
+				if (!sock || sock.destroyed) return;
+				writePacket(sock, {type: 'ping', sentAt: Date.now()});
+				const age = Date.now() - lastSeenRef.current;
+				if (age > 6000) {
+					setStatus('disconnected');
+					setRemoteState('OFFLINE');
+					cleanupSocket();
+				}
+			}, 2000);
+		},
+		[cleanupSocket, options]
+	);
+
+	useEffect(() => {
+		if (options.role === 'host') {
+			const server = net.createServer((socket) => {
+				attachSocket(socket);
+			});
+
+			server.on('error', () => {});
+
+			server.listen(options.port ?? TCP_DEFAULT_PORT, () => {
+				const address = server.address();
+				if (address && typeof address === 'object') setListenPort(address.port);
+			});
+
+			return () => {
+				cleanupSocket();
+				server.close();
+			};
+		}
+
+		setStatus('connecting');
+		const socket = net.createConnection({host: options.hostIp, port: options.tcpPort}, () => {
+			attachSocket(socket);
+		});
+		socket.on('error', () => {
+			setStatus('disconnected');
+			setRemoteState('OFFLINE');
+		});
+
+		return () => {
+			socket.destroy();
+			cleanupSocket();
+		};
+	}, [attachSocket, cleanupSocket, options]);
+
+	const sendStatus = useCallback((state: ActivityState) => {
+		const socket = socketRef.current;
+		if (!socket || socket.destroyed) return;
+		writePacket(socket, {type: 'status', state, sentAt: Date.now()});
+	}, []);
+
+	return {status, listenPort, peerName, remoteState, sendStatus};
+}

package/src/net/broadcast.ts

@@ -0,0 +1,32 @@
+import os from 'node:os';
+
+function ipv4ToInt(ip: string) {
+	return ip
+		.split('.')
+		.map((n) => Number.parseInt(n, 10))
+		.reduce((acc, n) => ((acc << 8) | (n & 255)) >>> 0, 0);
+}
+
+function intToIpv4(n: number) {
+	return [24, 16, 8, 0].map((shift) => String((n >>> shift) & 255)).join('.');
+}
+
+export function getBroadcastTargets(): string[] {
+	const out = new Set<string>(['255.255.255.255']);
+
+	const ifaces = os.networkInterfaces();
+	for (const entries of Object.values(ifaces)) {
+		if (!entries) continue;
+		for (const e of entries) {
+			if (e.family !== 'IPv4') continue;
+			if (e.internal) continue;
+			if (!e.address || !e.netmask) continue;
+			const ip = ipv4ToInt(e.address);
+			const mask = ipv4ToInt(e.netmask);
+			const broadcast = (ip | (~mask >>> 0)) >>> 0;
+			out.add(intToIpv4(broadcast));
+		}
+	}
+
+	return [...out];
+}

package/src/net/index.ts

@@ -0,0 +1,2 @@
+export {getBroadcastTargets} from './broadcast.js';
+

package/src/protocol.ts

@@ -0,0 +1,18 @@
+export type ActivityState = 'TYPING' | 'IDLE' | 'OFFLINE';
+
+export type DiscoveryPacket = {
+	type: 'termbuddy_discovery';
+	version: number;
+	hostName: string;
+	roomName: string;
+	tcpPort: number;
+	sentAt: number;
+};
+
+export type TcpPacket =
+	| {type: 'hello'; hostName: string; clientName: string; sentAt: number}
+	| {type: 'status'; state: ActivityState; sentAt: number}
+	| {type: 'ping'; sentAt: number}
+	| {type: 'pong'; sentAt: number};
+
+export type ConnectionStatus = 'waiting' | 'connecting' | 'connected' | 'disconnected';

package/src/types.ts

@@ -0,0 +1,8 @@
+export type DiscoveredRoom = {
+	ip: string;
+	hostName: string;
+	roomName: string;
+	tcpPort: number;
+	lastSeenAt: number;
+};
+

package/src/views/MainMenu.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import {Box, Text, useInput} from 'ink';
+
+export function MainMenu(props: {onHost: () => void; onJoin: () => void; onExit: () => void}) {
+	useInput((input, key) => {
+		if (key.escape || input === 'q') props.onExit();
+		if (input === '1') props.onHost();
+		if (input === '2') props.onJoin();
+	});
+
+	return (
+		<Box flexDirection="column" padding={1}>
+			<Text>
+				{String.raw`
+████████╗███████╗██████╗ ███╗   ███╗██████╗ ██╗   ██╗██████╗ ██████╗ ██╗   ██╗
+╚══██╔══╝██╔════╝██╔══██╗████╗ ████║██╔══██╗██║   ██║██╔══██╗██╔══██╗╚██╗ ██╔╝
+   ██║   █████╗  ██████╔╝██╔████╔██║██████╔╝██║   ██║██║  ██║██║  ██║ ╚████╔╝ 
+   ██║   ██╔══╝  ██╔══██╗██║╚██╔╝██║██╔══██╗██║   ██║██║  ██║██║  ██║  ╚██╔╝  
+   ██║   ███████╗██║  ██║██║ ╚═╝ ██║██████╔╝╚██████╔╝██████╔╝██████╔╝   ██║   
+   ╚═╝   ╚══════╝╚═╝  ╚═╝╚═╝     ╚═╝╚═════╝  ╚═════╝ ╚═════╝ ╚═════╝    ╚═╝   
+`}
+			</Text>
+			<Box flexDirection="column" marginTop={1}>
+				<Text>Terminal Body Doubling — 极简 / 极客 / 私密</Text>
+				<Text> </Text>
+				<Text>
+					<Text color="cyan">[1]</Text> 建房 (Host)
+				</Text>
+				<Text>
+					<Text color="cyan">[2]</Text> 加入 (Join)
+				</Text>
+				<Text>
+					<Text color="cyan">[q]</Text> 退出
+				</Text>
+			</Box>
+		</Box>
+	);
+}

package/src/views/RoomScanner.tsx

@@ -0,0 +1,47 @@
+import React, {useMemo} from 'react';
+import {Box, Text, useInput} from 'ink';
+import {useScanner} from '../hooks/index.js';
+import type {DiscoveredRoom} from '../types.js';
+
+export function RoomScanner(props: {
+	onSelectRoom: (room: DiscoveredRoom) => void;
+	onBack: () => void;
+	onExit: () => void;
+}) {
+	const rooms = useScanner();
+
+	const sortedRooms = useMemo(() => {
+		return [...rooms].sort((a, b) => b.lastSeenAt - a.lastSeenAt);
+	}, [rooms]);
+
+	useInput((input, key) => {
+		if (key.escape || input === 'b') props.onBack();
+		if (input === 'q') props.onExit();
+
+		const index = Number.parseInt(input, 10);
+		if (Number.isNaN(index)) return;
+		const room = sortedRooms[index - 1];
+		if (!room) return;
+		props.onSelectRoom(room);
+	});
+
+	return (
+		<Box flexDirection="column" padding={1}>
+			<Text>
+				<Text color="yellow">正在扫描局域网...</Text> (按 <Text color="cyan">b</Text> 返回,{' '}
+				<Text color="cyan">q</Text> 退出)
+			</Text>
+			<Box flexDirection="column" marginTop={1}>
+				{sortedRooms.length === 0 ? (
+					<Text color="gray">暂无房间广播。</Text>
+				) : (
+					sortedRooms.map((room, i) => (
+						<Text key={`${room.ip}:${room.tcpPort}`}>
+							<Text color="cyan">[{i + 1}]</Text> {room.roomName} — {room.hostName} @ {room.ip}:{room.tcpPort}
+						</Text>
+					))
+				)}
+			</Box>
+		</Box>
+	);
+}

package/src/views/Session.tsx

@@ -0,0 +1,127 @@
+import React, {useCallback, useEffect, useMemo, useState} from 'react';
+import {Box, Text, useInput} from 'ink';
+import type {ActivityState} from '../protocol.js';
+import {AiConsole, BuddyAvatar, StatusHeader} from '../components/index.js';
+import {useActivityMonitor, useBroadcaster, useCountdown, useTcpSync} from '../hooks/index.js';
+
+export function Session(
+	props:
+		| {role: 'host'; localName: string; onExit: () => void}
+		| {
+				role: 'client';
+				localName: string;
+				onExit: () => void;
+				hostIp: string;
+				tcpPort: number;
+				roomName: string;
+				hostName: string;
+		  }
+) {
+	const roomName = useMemo(() => `${props.localName}'s Room`, [props.localName]);
+
+	const [showAi, setShowAi] = useState(false);
+	const countdown = useCountdown();
+
+	const tcpOptions = useMemo(() => {
+		return props.role === 'host'
+			? ({role: 'host', localName: props.localName} as const)
+			: ({
+					role: 'client',
+					localName: props.localName,
+					hostIp: props.hostIp,
+					tcpPort: props.tcpPort,
+					hostName: props.hostName
+			  } as const);
+	}, [
+		props.role,
+		props.localName,
+		props.role === 'client' ? props.hostIp : '',
+		props.role === 'client' ? props.tcpPort : 0,
+		props.role === 'client' ? props.hostName : ''
+	]);
+
+	const tcp = useTcpSync(tcpOptions);
+
+	const broadcasterOptions = useMemo(() => {
+		return props.role === 'host'
+			? ({
+					enabled: true,
+					hostName: props.localName,
+					roomName,
+					tcpPort: tcp.listenPort
+			  } as const)
+			: ({enabled: false} as const);
+	}, [props.role, props.localName, roomName, tcp.listenPort]);
+
+	useBroadcaster(broadcasterOptions);
+
+	const localActivity = useActivityMonitor();
+
+	const remoteActivity: ActivityState = tcp.remoteState ?? 'OFFLINE';
+
+	const onToggleAi = useCallback(() => setShowAi((v) => !v), []);
+	const onCloseAi = useCallback(() => setShowAi(false), []);
+
+	useInput(
+		(input, key) => {
+			if (input === 'q') props.onExit();
+			if (input === '/' && !key.ctrl && !key.meta) onToggleAi();
+		},
+		{isActive: !showAi}
+	);
+
+	const buddyName =
+		props.role === 'host'
+			? tcp.peerName ?? 'Waiting...'
+			: `${props.hostName ?? 'Host'} (${props.roomName ?? 'Room'})`;
+
+	const localState = localActivity.state;
+	const localLabel = props.role === 'host' ? `${props.localName} (Host)` : `${props.localName} (Client)`;
+
+	// Sync local activity state to peer.
+	useEffect(() => {
+		if (tcp.status !== 'connected') return;
+		tcp.sendStatus(localState);
+	}, [localState, tcp.status, tcp.sendStatus]);
+
+	return (
+		<Box flexDirection="column" padding={1}>
+			<StatusHeader
+				role={props.role}
+				status={tcp.status}
+				hostIp={props.role === 'client' ? props.hostIp : undefined}
+				tcpPort={props.role === 'client' ? props.tcpPort : tcp.listenPort}
+				countdownLabel={countdown.label}
+			/>
+
+			<Box flexDirection="row" gap={4} marginTop={1}>
+				<Box flexDirection="column" width="50%">
+					<Text color="cyan">{localLabel}</Text>
+					<BuddyAvatar state={localState} />
+				</Box>
+
+				<Box flexDirection="column" width="50%">
+					<Text color="magenta">{buddyName}</Text>
+					<BuddyAvatar state={remoteActivity} />
+				</Box>
+			</Box>
+
+			<Box marginTop={1}>
+				<Text color="gray">
+					按 <Text color="cyan">/</Text> 召唤 AI Console，按 <Text color="cyan">q</Text> 返回菜单。
+				</Text>
+			</Box>
+
+			{showAi ? (
+				<Box marginTop={1}>
+					<AiConsole
+						onClose={onCloseAi}
+						onStartCountdown={countdown.start}
+						localName={props.localName}
+						peerName={tcp.peerName ?? (props.role === 'client' ? props.hostName : undefined) ?? 'Buddy'}
+					/>
+				</Box>
+			) : null}
+		</Box>
+	);
+}

package/src/views/index.ts

@@ -0,0 +1,4 @@
+export {MainMenu} from './MainMenu.js';
+export {RoomScanner} from './RoomScanner.js';
+export {Session} from './Session.js';
+

package/tsconfig.json

@@ -0,0 +1,14 @@
+{
+	"compilerOptions": {
+		"target": "ES2022",
+		"module": "ESNext",
+		"moduleResolution": "Bundler",
+		"lib": ["ES2022"],
+		"jsx": "react-jsx",
+		"types": ["node"],
+		"strict": true,
+		"skipLibCheck": true,
+		"noEmit": true
+	},
+	"include": ["src", "tsup.config.ts"]
+}

package/tsup.config.ts

@@ -0,0 +1,15 @@
+import {defineConfig} from 'tsup';
+
+export default defineConfig({
+	entry: ['src/cli.tsx'],
+	format: ['esm'],
+	platform: 'node',
+	target: 'node18',
+	sourcemap: true,
+	clean: true,
+	bundle: true,
+	splitting: false,
+	banner: {
+		js: '#!/usr/bin/env node'
+	}
+});